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中根据字数截取字符串,不能截断url
Jan 12 Javascript
html+javascript实现可拖动可提交的弹出层对话框效果
Aug 05 Javascript
javascript中match函数的用法小结
Feb 08 Javascript
jquery处理json数据实例分析
Jun 03 Javascript
深入分析原生JavaScript事件
Dec 29 Javascript
JavaScript如何禁止Backspace键
Dec 02 Javascript
实现easyui的datagrid导出为excel的示例代码
Nov 10 Javascript
使用Node.js实现RESTful API的示例
Aug 01 Javascript
微信小程序使用navigateTo数据传递的实例
Sep 26 Javascript
React Native 截屏组件的示例代码
Dec 06 Javascript
JS操作Fckeditor的一些常用方法(获取、插入等)
Feb 19 Javascript
Vue使用Proxy代理后仍无法生效的解决
Nov 13 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
php简单开启gzip压缩方法(zlib.output_compression)
2013/04/13 PHP
php实现httpRequest的方法
2015/03/13 PHP
PHP查看当前变量类型的方法
2015/07/31 PHP
Ubuntu 16.04下安装PHP 7过程详解
2017/03/28 PHP
javascript中的location用法简单介绍
2007/03/07 Javascript
JAVASCRIPT模式窗口中下载文件无法接收iframe的流
2013/10/11 Javascript
javascript中bind函数的作用实例介绍
2014/09/28 Javascript
JavaScript通过this变量快速找出用户选中radio按钮的方法
2015/03/23 Javascript
jQuery实现自动调整字体大小的方法
2015/06/15 Javascript
JQuery.Ajax()的data参数类型实例详解
2015/11/20 Javascript
JS函数的几种定义方式分析
2015/12/17 Javascript
Jquery轮播效果实现过程解析
2016/03/30 Javascript
jQuery Dialog 取消右上角删除按钮事件
2016/09/07 Javascript
js字符串与Unicode编码互相转换
2017/05/17 Javascript
使用vue-resource进行数据交互的实例
2017/09/02 Javascript
微信小程序获取手机号授权用户登录功能
2017/11/09 Javascript
JS中appendChild追加子节点无效的解决方法
2018/10/14 Javascript
node.js 如何监视文件变化
2020/09/01 Javascript
微信小程序实现星星评分效果
2020/11/01 Javascript
python中将字典转换成其json字符串
2014/07/16 Python
Python实现子类调用父类的方法
2014/11/10 Python
Python中表示字符串的三种方法
2017/09/06 Python
详解pandas使用drop_duplicates去除DataFrame重复项参数
2019/08/01 Python
pygame实现俄罗斯方块游戏(基础篇1)
2019/10/29 Python
tensorflow生成多个tfrecord文件实例
2020/02/17 Python
PyCharm Anaconda配置PyQt5开发环境及创建项目的教程详解
2020/03/24 Python
Python selenium文件上传下载功能代码实例
2020/04/13 Python
python爬虫scrapy基于CrawlSpider类的全站数据爬取示例解析
2021/02/20 Python
日本著名化妆品零售网站:Cosme Land
2019/03/01 全球购物
总经理助理职责
2014/02/04 职场文书
总经理工作职责范文
2014/03/14 职场文书
欢迎家长标语
2014/10/08 职场文书
2015年环境整治工作总结
2015/05/22 职场文书
总经理致辞
2015/07/29 职场文书
对Golang中的FORM相关字段理解
2021/05/02 Golang
nginx配置之并发频次限制
2022/04/18 Servers