调用jQuery滑出效果时闪烁的解决方法


Posted in Javascript onMarch 27, 2014

问题现象如题所示,在调用jQuery 滑出效果时,层会现次闪烁一下.在网上找了许多解决文案,说要加如下标示:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

可问题是现在的 标题头已 为 html4.0 ,如若改为上面的情况,则页面会乱掉。最终找到了一个高手写的东东,重写的jQuery的滑出

效果。高手的链接地址如下:
http://aqr199.myweb.hinet.net/jquery_slide_iebug.htm

代码如下:

var b1 = new slide_fix($('#Div3')); 
$('#Button5').click(function(){b1.close();});//收 
$('#Button6').click(function(){b1.open();});//? function slide_fix(b){ 
var h = b.height(); 
var step = 600; 
var time = 13; 
this.open = function(){ 
timeRate(step,function(c,r){ 
var h1 = h*r; 
b.height(h1); 
if(c==1){b.show();} 
}); 
} 
this.close = function(){ 
timeRate(step,function(c,r){ 
var h1 = h *(1-r); 
b.height(h1); 
if(r==1){b.hide();} 
}); 
} 
function timeRate(step,fn){ 
var t = now(); 
var count = 1; 
var timeId = setInterval(function(){ 
var t1 = now(); 
var rate = ((t1-t)>step) ? 1 : (t1-t)/step; 
fn(count,rate); 
if(rate==1){clearInterval(timeId);} 
count++; 
},time); 
} 
function now() { 
return (new Date).getTime(); 
} 
}
Javascript 相关文章推荐
用js+xml自动生成表格的东西
Dec 21 Javascript
JavaScript事件列表解说
Dec 22 Javascript
转换json格式的日期为Javascript对象的函数
Jul 13 Javascript
IE6下js通过css隐藏select的一个bug
Aug 16 Javascript
event.X和event.clientX的区别分析
Oct 06 Javascript
javascript中怎么做对象的类型判断
Nov 11 Javascript
生成二维码方法汇总
Dec 26 Javascript
Javascript基础教程之for循环
Jan 18 Javascript
jquery中取消和绑定hover事件的实现代码
Jun 02 Javascript
Three.js基础部分学习
Jan 08 Javascript
基于vue2的table分页组件实现方法
Mar 20 Javascript
node.js到底要不要加分号浅析
Jul 11 Javascript
jquery选择符快速提取web表单数据示例
Mar 27 #Javascript
页面元素绑定jquery toggle后元素隐藏的解决方法
Mar 27 #Javascript
javascript怎么禁用浏览器后退按钮
Mar 27 #Javascript
js弹出确认是否删除对话框
Mar 27 #Javascript
js或jquery实现页面打印可局部打印
Mar 27 #Javascript
window.location.href IE下跳转失效的解决方法
Mar 27 #Javascript
jquery无法设置checkbox选中即没有变成选中状态
Mar 27 #Javascript
You might like
php报表之jpgraph柱状图实例代码
2011/08/22 PHP
php数组函数序列之next() - 移动数组内部指针到下一个元素的位置,并返回该元素值
2011/10/31 PHP
如何使用“PHP” 彩蛋进行敏感信息获取
2013/08/07 PHP
简单分析ucenter 会员同步登录通信原理
2014/08/25 PHP
PHP、Python和Javascript的装饰器模式对比
2015/02/03 PHP
PHP实现对数组分页处理实例详解
2017/02/07 PHP
Yii2实现跨mysql数据库关联查询排序功能代码
2017/02/10 PHP
使用WAMP搭建PHP本地开发环境
2017/05/10 PHP
PHP实现二叉树深度优先遍历(前序、中序、后序)和广度优先遍历(层次)实例详解
2018/04/20 PHP
js字符串转换成xml对象并使用技巧解读
2013/04/18 Javascript
JS函数重载的解决方案
2014/05/13 Javascript
jQuery简单实现隐藏以及显示特效
2015/02/26 Javascript
jQuery实现仿腾讯迷你首页选项卡效果代码
2015/09/17 Javascript
关于javascript事件响应的基础语法总结(必看篇)
2016/12/26 Javascript
纯JS实现弹性导航条效果
2017/03/06 Javascript
Nodejs回调加超时限制两种实现方法
2017/06/09 NodeJs
ExtJs使用自定义插件动态保存表头配置(隐藏或显示)
2018/09/25 Javascript
基于js Canvas实现二次贝塞尔曲线
2018/12/25 Javascript
如何自动化部署项目?折腾服务器之旅~
2019/04/16 Javascript
深入学习js函数的隐式参数 arguments 和 this
2019/06/24 Javascript
[05:02]2014DOTA2 TI中国区预选赛精彩TOPPLAY第三弹
2014/06/25 DOTA
[03:27]《辉夜杯》线下训练营 导师CU和海涛指点迷津
2015/10/23 DOTA
python基础教程之字典操作详解
2014/03/25 Python
Python实现的彩票机选器实例
2015/06/17 Python
Python机器学习k-近邻算法(K Nearest Neighbor)实例详解
2018/06/25 Python
python 2.7.13 安装配置方法图文教程
2018/09/18 Python
python查询文件夹下excel的sheet名代码实例
2019/04/02 Python
Python+Selenium+phantomjs实现网页模拟登录和截图功能(windows环境)
2019/12/11 Python
使用pandas库对csv文件进行筛选保存
2020/05/25 Python
最新Python idle下载、安装与使用教程图文详解
2020/11/28 Python
酒店服务与管理毕业生求职信
2013/11/02 职场文书
企业贷款委托书格式
2014/09/12 职场文书
学校领导班子群众路线整改措施
2014/09/16 职场文书
教师专业技术工作总结2015
2015/05/13 职场文书
广播体操比赛主持词
2015/06/29 职场文书
2016三严三实专题教育活动心得体会
2016/01/06 职场文书