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 相关文章推荐
一个页面放2段图片滚动代码出现冲突的问题如何解决
Dec 21 Javascript
window.addEventListener来解决让一个js事件执行多个函数
Dec 26 Javascript
jQuery 快速结束当前正在执行的动画
Nov 20 Javascript
Js保留小数点的4种效果实现代码分享
Apr 12 Javascript
jquery修改网页背景颜色通过css方法实现
Jun 06 Javascript
让JavaScript和其它资源并发下载的方法
Oct 16 Javascript
JS设置cookie、读取cookie、删除cookie
Apr 17 Javascript
jQuery超赞的评分插件(8款)
Aug 20 Javascript
html、css和jquery相结合实现简单的进度条效果实例代码
Oct 24 Javascript
利用JQuery实现datatables插件的增加和删除行功能
Jan 06 Javascript
express如何解决ajax跨域访问session失效问题详解
Jun 20 Javascript
OpenLayers3实现图层控件功能
Sep 25 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
让你同时上传 1000 个文件 (二)
2006/10/09 PHP
PHP隐形一句话后门,和ThinkPHP框架加密码程序(base64_decode)
2011/11/02 PHP
php中的PHP_EOL换行符详细解析
2013/10/26 PHP
PHP 读取和编写 XML
2014/11/19 PHP
实例讲解yii2.0在php命令行中运行的步骤
2015/12/01 PHP
jquery last-child 列表最后一项的样式
2010/01/22 Javascript
被jQuery折腾得半死,揭秘为何jQuery为何在IE/Firefox下均无法使用
2010/01/22 Javascript
javascript 用记忆函数快速计算递归函数
2010/03/15 Javascript
js实现鼠标滚轮控制图片缩放效果的方法
2015/02/20 Javascript
jQuery中inArray方法注意事项分析
2016/01/25 Javascript
JavaScript中正则表达式判断匹配规则及常用方法
2017/08/03 Javascript
JavaScript数据结构之单链表和循环链表
2017/11/28 Javascript
微信小程序自定义底部弹出框
2020/11/16 Javascript
微信小程序实现bindtap等事件传参
2019/04/08 Javascript
Vue父组件如何获取子组件中的变量
2019/07/24 Javascript
VUE.js实现动态设置输入框disabled属性
2019/10/28 Javascript
JQuery常用简单动画操作方法回顾与总结
2019/12/07 jQuery
ES6 class类链式继承,实例化及react super(props)原理详解
2020/02/15 Javascript
js实现自定义滚动条的示例
2020/10/27 Javascript
pip 错误unused-command-line-argument-hard-error-in-future解决办法
2014/06/01 Python
详解Python中time()方法的使用的教程
2015/05/22 Python
Python使用tablib生成excel文件的简单实现方法
2016/03/16 Python
Django 添加静态文件的两种实现方法(必看篇)
2017/07/14 Python
python判断一个集合是否为另一个集合的子集方法
2018/05/04 Python
win10系统下Anaconda3安装配置方法图文教程
2018/09/19 Python
python安装读取grib库总结(推荐)
2020/06/24 Python
Python程序慢的重要原因
2020/09/04 Python
NBA欧洲商店(法国):NBA Europe Store FR
2016/10/19 全球购物
财务管理个人自荐书范文
2013/11/24 职场文书
远程研修随笔感言
2014/02/10 职场文书
大型会议接待方案
2014/03/01 职场文书
老师对学生的寄语
2014/04/09 职场文书
2015年生产部工作总结范文
2015/05/25 职场文书
敬老院活动感想
2015/08/07 职场文书
大学生干部培训心得体会
2016/01/06 职场文书
在K8s上部署Redis集群的方法步骤
2021/04/27 Redis