js实例入门(简单展开或关闭)
简直的展开或关闭
.hide{display:none;}
.show{display:block;}
.hand{cursor:pointer;}
.text{padding:10px;background:F3FCFF;line-height:1.3em;border:solid 5px B2DCF9;margin-bottom:7px;}
/*根据点击项,动态加载内容至iframe中
expand(展开),e_d即expand div
container(容器),c即容器缩写
b为bool缩写
n为num缩写
*/
function e_d(obj,n){//这二个参数构成iframe里的子页面。test1.htm/test2.htm/test3.htm
var c = obj.parentNode.nextSibling; /*取父级的下一个节点,跟父级同辈的。*/
var b = ( c.className == 'hide' );
obj.src = 'images/' + (b?'minus':'plus') + '.gif'/*变换+-图片*/
c.className=b?'text':'hide'
if(!c.innerHTML){//如果这一层里没有内容才更新。有内容则不变化
var str = '';
c.innerHTML = str;
}
}
展开1
展开2
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
相关推荐
-
JS模拟的QQ面板上的多级可展开的菜单
QQ菜单 if (!document.getElementById) document.getElementById = function() { return null; } function initializeMenu(menuId, actuatorId) { var menu = document.getElementById(menuId); var actuator = document.getElementById(actuatorId); if (menu == null ||
-
js鼠标滑过图片震动特效的方法
本文实例讲述了js鼠标滑过图片震动特效的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>鼠标滑过 图片震动效果</title> <STYLE>.shakeimage { POSITION: re
-
js实现鼠标悬停图片上时滚动文字说明的方法
本文实例讲述了js实现鼠标悬停图片上时滚动文字说明的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <title>js实现鼠标悬停图片上时的滚动文字说明</title> <body> <SCRIPT LANGUAGE="JavaScript"> <!-- Begin function showtip2(current,e,text){ if (document.all&&a
-
Js操作树节点自动折叠展开的几种方法
1.方法一 复制代码 代码如下: var tree = L5.getCmp('edocOutfileRelationTree'); //增加选择树,节点自动折叠 tree.on("click", function(node,e){ node.getUI().toggleCheck(true); }); tree.root.expand(); 2.方法二 复制代码 代码如下: var tree = L5.getCmp('orgstrutree'); //增加选择树,节点自动折叠 tree
-
JS点击链接后慢慢展开隐藏着图片的方法
本文实例讲述了JS点击链接后慢慢展开隐藏着图片的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <title>JS点击链接后,慢慢展开隐藏着的图片</title> <body> <script language="JavaScript"> var b=0; var c=true; function fade(){ if(document.all); if(c == true){b+=3} i
-
js实现按钮控制图片360度翻转特效的方法
本文实例讲述了js实现按钮控制图片360度翻转特效的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <title>js实现按钮控制图片360度翻转特效</title> <body> <script language="javascript"> var isIE = (document.uniqueID)?1:0; var i=1; function rotate(image) { var o
-
JS实现固定在右下角可展开收缩DIV层的方法
本文实例讲述了JS实现固定在右下角可展开收缩DIV层的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"
-
JS 简单展开关闭切换代码
第一种方法:原理比较简单通过判断当前是隐藏还是显示的,并以此来判断. function show() { var a=document.getElementById('aa'); a.style.display=="none"?a.style.display="":a.style.display="none"; } 操作 我们 欢迎你 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 第二种:更简单,但原理不是一眼能看出来能详解的朋友可
-
js展开闭合效果演示代码
复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&qu
-
js实现双击图片放大单击缩小的方法
本文实例讲述了js实现双击图片放大单击缩小的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>双击图片放大,单击缩小</title> </head> <body> <SCRIPT
随机推荐
- LIS 最长递增子序列 Java的简单实现
- php生成随机密码的三种方法小结
- javascript获取表格 td 中的内容
- php-fpm开机自动启动Shell脚本
- C#实现简单获取及设置Session类
- 后现代 经典语录
- Web服务器识别技术揭秘
- JS实现时间格式化的方式汇总
- 认识Linux
- Java中的this指针使用方法分享
- JavaScript中的公有、私有、特权和静态成员用法分析
- C++实现ping程序实例
- 那些年一起学习的PHP(三)
- Swift如何调用Objective-C的可变参数函数详解
- 前端天气插件tpwidget使用方法详解
- Python 70行代码实现简单算式计算器解析
- Laravel框架基于ajax和layer.js实现无刷新删除功能示例
- layer.confirm取消按钮绑定事件的方法
- Java InputStream的多种使用详解
- 浅谈Scala模式匹配