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 apply/call/caller/callee/bind使用方法与区别分析
Oct 28 Javascript
jquery 使用点滴函数代码
May 20 Javascript
JavaScript 反科里化 this [译]
Sep 20 Javascript
js 金额格式化来回转换示例
Feb 23 Javascript
借助javascript代码判断网页是静态还是伪静态
May 05 Javascript
Jquery+asp.net后台数据传到前台js进行解析的方法
May 11 Javascript
基于JavaScript的操作系统你听说过吗?
Jan 28 Javascript
全面了解JavaScript对象进阶
Jul 19 Javascript
js中判断变量类型函数typeof的用法总结
Aug 09 Javascript
javascript数据类型详解
Feb 07 Javascript
jQuery.form.js的使用详解
Jun 14 jQuery
protractor的安装与基本使用教程
Jul 07 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 SQLite类
2009/05/07 PHP
php session和cookie使用说明
2010/04/07 PHP
php绘图之生成饼状图的方法
2015/01/24 PHP
javascript显示选择目录对话框的代码
2008/11/10 Javascript
javascript 常用方法总结
2009/06/03 Javascript
当jQuery遭遇CoffeeScript的时候 使用分享
2011/09/17 Javascript
基于jQuery的input输入框下拉提示层(自动邮箱后缀名)
2012/06/14 Javascript
Javascript this 的一些学习总结
2012/08/31 Javascript
JavaScript判断textarea值是否为空并给出相应提示
2014/09/04 Javascript
基于Angularjs实现分页功能
2016/05/30 Javascript
DIV+CSS+jQ实现省市联动可扩展
2016/06/22 Javascript
酷! 不同风格页面布局幻灯片特效js实现
2021/02/19 Javascript
详解handlebars+require基本使用方法
2016/12/21 Javascript
JS二叉树的简单实现方法示例
2017/04/05 Javascript
angularJs 表格添加删除修改查询方法
2018/02/27 Javascript
JS实现的汉字与Unicode码相互转化功能分析
2018/05/25 Javascript
Vue.js 图标选择组件实践详解
2018/12/03 Javascript
微信小程序实现图片上传
2019/05/23 Javascript
js+audio实现音乐播放器
2020/09/13 Javascript
vue 避免变量赋值后双向绑定的操作
2020/11/07 Javascript
python3简单实现微信爬虫
2015/04/09 Python
PYTHON基础-时间日期处理小结
2018/05/05 Python
没编程基础可以学python吗
2020/06/17 Python
Python抓包并解析json爬虫的完整实例代码
2020/11/03 Python
香港卓悦化妆品官网:BONJOUR
2017/09/21 全球购物
英国最大的户外商店:Go Outdoors
2019/04/17 全球购物
编程实现去掉XML的重复结点
2014/05/28 面试题
EJB3.1都有哪些改进
2012/11/17 面试题
上班看电影检讨书
2014/02/12 职场文书
孝敬父母的演讲稿
2014/05/14 职场文书
2014学习优秀共产党员先进事迹思想汇报
2014/09/14 职场文书
小学少先队辅导员述职报告
2015/01/10 职场文书
借条格式范本
2015/05/25 职场文书
百年校庆宣传标语口号
2015/12/26 职场文书
Python中常见的导入方式总结
2021/05/06 Python
Mysql数据库索引面试题(程序员基础技能)
2021/05/31 MySQL