动态改变div的z-index属性的简单实例


Posted in Javascript onAugust 08, 2013
<script language="javascript"> 
var MAX_INDEX=4; 
function change(ddd) 
{ 
if(ddd.style.zIndex<= MAX_INDEX) 
{ 
ddd.style.zIndex = MAX_INDEX+1; 
MAX_INDEX++; 
} 
} 
</script> 
<div id="layer1" onclick="javascript:change(this);" style="position:absolute;margin-left:100;margin-top:50px;margin-=100;width=100;height=100;background-color:#ff0000;z-index:1"></div> 
<div id="layer2" onclick="javascript:change(this);" style="position:absolute;margin-left:120;margin-top:60px;margin-=120;width=100;height=100;background-color:#00ff00;z-index:2"></div> 
<div id="layer3" onclick="javascript:change(this);" style="position:absolute;margin-left:140;margin-top:70px;margin-=140;width=100;height=100;background-color:#0000ff;z-index:3"></div> 
<div id="layer4" onclick="javascript:change(this);" style="position:absolute;margin-left:160;margin-top:80px;margin-=160;width=100;height=100;background-color:#000000;z-index:4"></div>
Javascript 相关文章推荐
非常好的js代码
Jun 27 Javascript
js或css文件后面跟参数的原因说明
Jan 09 Javascript
jQuery获得IE版本不准确webbrowser的解决方法
Feb 23 Javascript
escape编码与unescape解码汉字出现乱码的解决方法
Jul 02 Javascript
javascript里使用php代码实例
Dec 13 Javascript
jQuery使用post方法提交数据实例
Mar 25 Javascript
JS 动态判断PC和手机浏览器实现代码
Sep 21 Javascript
微信小程序 网络API Websocket详解
Nov 09 Javascript
纯js模仿windows系统日历
Feb 04 Javascript
微信小程序tabBar用法实例详解
Dec 04 Javascript
vue中如何实现pdf文件预览的方法
Jul 12 Javascript
Vue指令指令大全
Feb 09 Javascript
Js制作简单弹出层DIV在页面居中 中间显示遮罩的具体方法
Aug 08 #Javascript
JS+css 图片自动缩放自适应大小
Aug 08 #Javascript
javascript:文字不间断向左移动的实例代码
Aug 08 #Javascript
js获得地址栏?问号后参数的方法
Aug 08 #Javascript
让页面上两个div中的滚动条(滑块)同步运动示例
Aug 07 #Javascript
js动态创建、删除表格示例代码
Aug 07 #Javascript
关于extjs4如何获取grid修改后的数据的问题
Aug 07 #Javascript
You might like
关于shopex同步ucenter的redirect问题,导致script不运行
2013/04/10 PHP
Windows下的PHP 5.3.x安装 Zend Guard Loader教程
2014/09/06 PHP
Yii2如何批量添加数据
2016/05/17 PHP
如何在Mozilla Gecko 用Javascript加载XSL
2007/01/09 Javascript
用Javascript数组处理多个字符串的连接问题
2009/08/20 Javascript
jquery 最简单的属性菜单
2009/10/08 Javascript
Javascript解决常见浏览器兼容问题的12种方法
2010/01/04 Javascript
JQuery循环滚动图片代码
2011/12/08 Javascript
javascript使用location.search的示例
2013/11/05 Javascript
随鼠标移动的时钟非常漂亮遗憾的是只支持IE
2014/08/12 Javascript
使用js获取图片原始尺寸
2014/12/03 Javascript
jquery插件unobtrusive实现片段式加载
2015/06/15 Javascript
JavaScript实现表格快速变色效果代码
2015/08/19 Javascript
js仿QQ中对联系人向左滑动、滑出删除按钮的操作
2016/04/07 Javascript
AngularJS入门教程之更多模板详解
2016/08/19 Javascript
echarts饼图扇区添加点击事件的实例
2017/10/16 Javascript
React Native中导航组件react-navigation跨tab路由处理详解
2017/10/31 Javascript
[06:45]DOTA2卡尔工作室 英雄介绍幻影长矛手篇
2013/07/12 DOTA
Python脚本暴力破解栅栏密码
2015/10/19 Python
PHP实现发送和接收JSON请求
2018/06/07 Python
Django后台admin的使用详解
2019/07/08 Python
Python + Flask 实现简单的验证码系统
2019/10/01 Python
Python 生成VOC格式的标签实例
2020/03/10 Python
美国时尚大码女装购物网站:Avenue
2019/05/24 全球购物
竞选班长演讲稿
2013/12/30 职场文书
合作意向书模板
2014/03/31 职场文书
体育教师求职信
2014/05/24 职场文书
护理专业求职信
2014/06/15 职场文书
建筑安全生产责任书
2014/07/22 职场文书
党支部党的群众路线对照检查材料
2014/09/24 职场文书
小学生校园广播稿
2014/09/28 职场文书
单位工作证明书格式
2014/10/04 职场文书
解决mysql的int型主键自增问题
2021/07/15 MySQL
【海涛教你打DOTA】死灵飞龙第一视角解说
2022/04/01 DOTA
MySQL数据库实验实现简单数据库应用系统设计
2022/06/21 MySQL
css3手动实现pc端横向滚动
2022/06/21 HTML / CSS