动态改变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 相关文章推荐
jquery.jstree 增加节点的双击事件代码
Jul 27 Javascript
qTip 基于JQuery的Tooltip插件[兼容性好]
Sep 01 Javascript
JavaScript高级程序设计 读书笔记之十一 内置对象Global
Mar 07 Javascript
Python脚本后台运行的几种方式
Mar 09 Javascript
实例代码讲解jquery easyui动态tab页
Nov 17 Javascript
Java遍历集合方法分析(实现原理、算法性能、适用场合)
Apr 25 Javascript
浅谈JavaScript中变量和函数声明的提升
Aug 09 Javascript
javaScript如何跳出多重循环break、continue
Sep 01 Javascript
JS实现数组去重复值的方法示例
Feb 18 Javascript
jQuery列表检索功能实现代码
Jul 17 jQuery
JS获取浏览器地址栏的多个参数值的任意值实例代码
Jul 24 Javascript
js实现图片推拉门效果代码实例
May 18 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
图片存储与浏览一例(Linux+Apache+PHP+MySQL)
2006/10/09 PHP
php程序效率优化的一些策略小结
2010/07/17 PHP
php集成套件服务器xampp安装使用教程(适合第一次玩PHP的新手)
2015/06/03 PHP
Laravel框架执行原生SQL语句及使用paginate分页的方法
2018/08/17 PHP
jquery ajax实现下拉框三级无刷新联动,且保存保持选中值状态
2013/10/29 Javascript
JS之Date对象和获取系统当前时间详解
2014/01/13 Javascript
基于javascript实现泡泡大冒险网页版小游戏
2016/03/23 Javascript
利用bootstrapValidator验证UEditor
2016/09/14 Javascript
AngularJS中的Promise详细介绍及实例代码
2016/12/13 Javascript
JavaScript实现音乐自动切换和轮播
2017/11/05 Javascript
vue在使用ECharts时的异步更新和数据加载详解
2017/11/22 Javascript
微信小程使用swiper组件实现图片轮播切换显示功能【附源码下载】
2017/12/12 Javascript
原生JS控制多个滚动条同步跟随滚动效果
2017/12/22 Javascript
Vue.js 动态为img的src赋值方法
2018/03/14 Javascript
深入koa-bodyparser原理解析
2019/01/16 Javascript
jQuery模仿ToDoList实现简单的待办事项列表
2019/12/30 jQuery
JS简单表单验证功能完整示例
2020/01/26 Javascript
Python 网络编程起步(Socket发送消息)
2008/09/06 Python
Python IDE PyCharm的基本快捷键和配置简介
2015/11/04 Python
使用Python对微信好友进行数据分析
2018/06/27 Python
Python读取txt文件数据的方法(用于接口自动化参数化数据)
2018/06/27 Python
python循环输出三角形图案的例子
2019/11/22 Python
python 监测内存和cpu的使用率实例
2019/11/28 Python
Python GUI库PyQt5图形和特效样式QSS介绍
2020/02/25 Python
opencv 图像腐蚀和图像膨胀的实现
2020/07/07 Python
Python selenium模块实现定位过程解析
2020/07/09 Python
加拿大女鞋品牌:ALDO
2016/11/13 全球购物
Ajax的优点和缺点
2014/11/21 面试题
报纸媒体创意广告词
2014/03/17 职场文书
大专生自我鉴定怎么写
2014/09/16 职场文书
解除施工合同协议书
2014/10/17 职场文书
大学生英文求职信范文
2015/03/19 职场文书
第二次离婚起诉书
2015/05/18 职场文书
2015年暑期实践报告范文
2015/07/13 职场文书
职场:企业印章管理制度(模板)
2019/10/18 职场文书
Java Spring Boot 正确读取配置文件中的属性的值
2022/04/20 Java/Android