js调用图片隐藏&显示实现代码


Posted in Javascript onSeptember 13, 2013
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<html> 
<head> <SCRIPT> 
var intTimeStep=20; 
var isIe=(window.ActiveXObject)?true:false; 
var intAlphaStep=(isIe)?5:0.05; 
var curSObj=null; 
var curOpacity=null; 
function startObjVisible(objId) 
{ 
curSObj=document.getElementById(objId); 
setObjState(); 
} 
function setObjState(evTarget) 
{ 
if (curSObj.style.display==""){curOpacity=1;setObjClose();} 
else{ 
if(isIe) 
{ 
curSObj.style.cssText='DISPLAY: none;Z-INDEX: 1; FILTER: alpha(opacity=0); POSITION: absolute;'; 
curSObj.filters.alpha.opacity=0; 
}else 
{ 
curSObj.style.opacity=0 
} 
curSObj.style.display=''; 
curOpacity=0; 
setObjOpen(); 
} 
} 
function setObjOpen() 
{ 
if(isIe) 
{ 
curSObj.filters.alpha.opacity+=intAlphaStep; 
if (curSObj.filters.alpha.opacity<100) setTimeout('setObjOpen()',intTimeStep); 
}else{ 
curOpacity+=intAlphaStep; 
curSObj.style.opacity =curOpacity; 
if (curOpacity<1) setTimeout('setObjOpen()',intTimeStep); 
} 
} 
function setObjClose() 
{ 
if(isIe) 
{ 
curSObj.filters.alpha.opacity-=intAlphaStep; 
if (curSObj.filters.alpha.opacity>0) { 
setTimeout('setObjClose()',intTimeStep);} 
else {curSObj.style.display="none";} 
}else{ 
curOpacity-=intAlphaStep; 
if (curOpacity>0) { 
curSObj.style.opacity =curOpacity; 
setTimeout('setObjClose()',intTimeStep);} 
else {curSObj.style.display='none';} 
} 
} 
</SCRIPT> 
</head> 
<body>
<input type=text onclick="startObjVisible('objDiv');if(this.value==''){this.value=''}else{this.value=''}" value=""> 
<DIV id="objDiv" style="DISPLAY: none;"><img src="红背心平台/images/城市.jpg"></DIV> 
</body> 
</html>
Javascript 相关文章推荐
JavaScript高级程序设计 阅读笔记(十四) js继承机制的实现
Aug 14 Javascript
JQuery的Ajax跨域请求原理概述及实例
Apr 26 Javascript
Js 去掉字符串中的空格(实现代码)
Nov 19 Javascript
原生js制作简单的数字键盘
Apr 24 Javascript
jquery点击缩略图切换视频播放特效代码分享
Sep 15 Javascript
Node.js+Express配置入门教程
May 19 Javascript
JS实现最简单的冒泡排序算法
Feb 15 Javascript
JS中LocalStorage与SessionStorage五种循序渐进的使用方法
Jul 12 Javascript
Vue.js 单页面多路由区域操作的实例详解
Jul 17 Javascript
详解基于node的前端项目编译时内存溢出问题
Aug 01 Javascript
vue vuex vue-rouert后台项目——权限路由(适合初学)
Dec 29 Javascript
微信小程序自定义toast组件的方法详解【含动画】
May 11 Javascript
javascript常用对话框小集
Sep 13 #Javascript
toggle一个div显示或隐藏且可扩展成自定义下拉框
Sep 12 #Javascript
jquery easyui滚动条部分设置介绍
Sep 12 #Javascript
jquery实现盒子下拉效果示例代码
Sep 12 #Javascript
利用jquery包将字符串生成二维码图片
Sep 12 #Javascript
JQuery实现鼠标滑过显示导航下拉列表
Sep 12 #Javascript
JQuery加载图片自适应固定大小的DIV
Sep 12 #Javascript
You might like
全国FM电台频率大全 - 22 重庆市
2020/03/11 无线电
mysql 中InnoDB和MyISAM的区别分析小结
2008/04/15 PHP
php生成缩略图的类代码
2008/10/02 PHP
组合算法的PHP解答方法
2012/02/04 PHP
PHP伪静态Rewrite设置之APACHE篇
2014/07/30 PHP
PHP中的命名空间详细介绍
2015/07/02 PHP
YiiFramework入门知识点总结(图文教程)
2015/12/28 PHP
thinkPHP模板算术运算相关函数用法分析
2016/07/12 PHP
Zend Framework入门应用实例详解
2016/12/11 PHP
PHP面向对象中new self()与 new static()的区别浅析
2017/08/17 PHP
在修改准备发的批量美化select+可修改select时,在非IE下发现了几个问题
2007/01/09 Javascript
javascript function、指针及内置对象
2009/02/19 Javascript
js 获取浏览器高度和宽度值(多浏览器)
2009/09/02 Javascript
JavaScript中实现块作用域的方法
2010/04/01 Javascript
IE不支持getElementsByClassName最终完美解决方案
2012/12/17 Javascript
JS正则表达式判断有效数实例代码
2017/03/13 Javascript
关于Angularjs中自定义指令一些有价值的细节和技巧小结
2018/04/22 Javascript
Vue表单绑定的实例代码(单选按钮,选择框(单选时,多选时,用 v-for 渲染的动态选项)
2019/05/13 Javascript
[48:11]完美世界DOTA2联赛 Magma vs GXR 第二场 11.07
2020/11/10 DOTA
[43:24]完美世界DOTA2联赛PWL S3 INK ICE vs DLG 第二场 12.12
2020/12/17 DOTA
Python跳出循环语句continue与break的区别
2014/08/25 Python
python3使用pyqt5制作一个超简单浏览器的实例
2017/10/19 Python
Python numpy生成矩阵、串联矩阵代码分享
2017/12/04 Python
Python Web版语音合成实例详解
2019/07/16 Python
解决python中import文件夹下面py文件报错问题
2020/06/01 Python
python制作微博图片爬取工具
2021/01/16 Python
python实现经典排序算法的示例代码
2021/02/07 Python
方太官方网上商城:销售方太抽油烟机、燃气灶、消毒柜等
2017/01/17 全球购物
机械专业求职信
2014/05/25 职场文书
幼儿园保育员责任书
2014/07/22 职场文书
大学生入党积极分子自我评价
2014/09/20 职场文书
简单租房协议书
2014/10/21 职场文书
小学生六年级作文之关于感恩
2019/08/16 职场文书
HTML中table表格拆分合并(colspan、rowspan)
2021/04/07 HTML / CSS
Python数据分析之绘图和可视化详解
2021/06/02 Python
Python绘画好看的星空图
2022/03/17 Python