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 相关文章推荐
JS的replace方法介绍
Oct 20 Javascript
使用jQuery UI的tooltip函数修饰title属性的气泡悬浮框
Jun 24 Javascript
JS实现超简单的鼠标拖动效果
Nov 02 Javascript
input点击后placeholder中的提示消息消失
Jan 15 Javascript
JavaScript资源预加载组件和滑屏组件的使用推荐
Mar 10 Javascript
jQuery实现验证表单密码一致性及正则表达式验证邮箱、手机号的方法
Dec 05 jQuery
js构建二叉树进行数值数组的去重与优化详解
Mar 26 Javascript
vue+element-ui实现表格编辑的三种实现方式
Oct 31 Javascript
ajaxfileupload.js实现上传文件功能
Apr 19 Javascript
js实现表格单列按字母排序
Aug 12 Javascript
js实现搜索提示框效果
Sep 05 Javascript
Vue使用鼠标在Canvas上绘制矩形
Dec 24 Vue.js
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
简单的cookie计数器实现源码
2013/06/07 PHP
ajax 文件上传应用简单实现
2009/03/03 Javascript
js自动下载文件到本地的实现代码
2013/04/28 Javascript
JavaScript语言核心数据类型和变量使用介绍
2013/08/23 Javascript
jquery获取一个元素下面相同子元素的个数代码
2014/07/31 Javascript
javascript中函数作为参数调用的方法
2015/02/09 Javascript
JavaScript限定图片显示大小的方法
2015/03/11 Javascript
jquery实现表单输入时提示文字滑动向上效果
2015/08/10 Javascript
微信小程序 加载 app-service.js 错误解决方法
2016/10/12 Javascript
谈谈target=_new和_blank的不同之处
2016/10/25 Javascript
在javascript中,null>=0 为真,null==0却为假,null的值详解
2017/02/22 Javascript
Vue.js 中的 $watch使用方法
2017/05/25 Javascript
node.js实现微信JS-API封装接口的示例代码
2017/09/06 Javascript
vue解决跨域路由冲突问题思路解析
2017/11/03 Javascript
详解从react转职到vue开发的项目准备
2019/01/14 Javascript
vue cli3 调用百度翻译API翻译页面的实现示例
2019/09/13 Javascript
p5.js绘制旋转的正方形
2019/10/23 Javascript
python求众数问题实例
2014/09/26 Python
Python 冒泡,选择,插入排序使用实例
2015/02/05 Python
深入解析Python中函数的参数与作用域
2016/03/20 Python
python中使用psutil查看内存占用的情况
2018/06/11 Python
对python制作自己的数据集实例讲解
2018/12/12 Python
Python嵌套式数据结构实例浅析
2019/03/05 Python
python实现简单加密解密机制
2019/03/19 Python
python-Web-flask-视图内容和模板知识点西宁街
2019/08/23 Python
HTML5进度条特效
2014/12/18 HTML / CSS
网络艺术零售业的先驱者:artrepublic
2017/09/26 全球购物
俄罗斯便宜的在线服装商店:GroupPrice
2020/04/10 全球购物
电子商务专业个人的自我评价
2013/12/19 职场文书
商业活动邀请函
2014/02/04 职场文书
学校学雷锋活动总结
2014/06/26 职场文书
服务员态度差检讨书
2014/10/28 职场文书
党员学习群众路线心得体会
2014/11/04 职场文书
单位租房协议书范本
2014/12/04 职场文书
优秀学生主要事迹怎么写
2015/11/04 职场文书
教你修复 Win11应用商店加载空白问题
2021/12/06 数码科技