调用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功能函数(2009-06-04更新)
Jun 04 Javascript
JavaScript读取中文cookie时的乱码问题的解决方法
Oct 14 Javascript
jquery中防刷IP流量软件影响统计的一点对策
Jul 10 Javascript
Jquery为单选框checkbox绑定单击click事件
Dec 18 Javascript
JavaScript(js)设置默认输入焦点(focus)
Dec 28 Javascript
JS版的date函数(和PHP的date函数一样)
May 12 Javascript
JavaScript实现ASC转汉字及汉字转ASC的方法
Jan 23 Javascript
原生js实现移动端触摸轮播的示例代码
Dec 22 Javascript
vue.js与element-ui实现菜单树形结构的解决方法
Apr 21 Javascript
修改npm全局安装模式的路径方法
May 15 Javascript
Vue组件通信的几种实现方法
Apr 25 Javascript
vue深度监听(监听对象和数组的改变)与立即执行监听实例
Sep 04 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与XML的PDF文档生成技术
2006/10/09 PHP
使PHP自定义函数返回多个值
2006/11/26 PHP
PHPEXCEL 使用小记
2013/01/06 PHP
PHP 年月日的三级联动实例代码
2017/05/24 PHP
PHP实现找出链表中环的入口节点
2018/01/16 PHP
PHP+百度AI OCR文字识别实现了图片的文字识别功能
2019/05/08 PHP
laravel5 Eloquent 实现事务方式
2019/10/21 PHP
纯css+js写的一个简单的tab标签页带样式
2014/01/28 Javascript
详解JavaScript语法对{}处理的坑爹之处
2014/06/05 Javascript
移动适配的几种方案(三种方案)
2016/11/25 Javascript
JS如何生成一个不重复的ID的函数
2016/12/25 Javascript
Vue入门之数据绑定(小结)
2018/01/08 Javascript
jQuery NProgress.js加载进度插件的简单使用方法
2018/01/31 jQuery
微信小程序时间轴实现方法示例
2019/01/14 Javascript
JavaScript实现的弹出遮罩层特效经典示例【基于jQuery】
2019/07/10 jQuery
vue中使用百度脑图kityminder-core二次开发的实现
2019/09/26 Javascript
vue element-ui读取pdf文件的方法
2019/11/26 Javascript
解决vue做详情页跳转的时候使用created方法 数据不会更新问题
2020/07/24 Javascript
vue组件实现移动端九宫格转盘抽奖
2020/10/16 Javascript
[02:42]2014DOTA2国际邀请赛 三冰专访:我会打到Ti20
2014/07/13 DOTA
[46:47]完美世界DOTA2联赛PWL S2 FTD vs Magma 第二场 11.20
2020/11/23 DOTA
python静态方法实例
2015/01/14 Python
python3 pillow生成简单验证码图片的示例
2017/09/19 Python
Python字典,函数,全局变量代码解析
2017/12/18 Python
python 接口返回的json字符串实例
2018/03/27 Python
对python 生成拼接xml报文的示例详解
2018/12/28 Python
python把1变成01的步骤总结
2019/02/27 Python
Python 调用 ES、Solr、Phoenix的示例代码
2020/11/23 Python
大学应届毕业生个人求职信
2013/09/23 职场文书
应届毕业生求职信范文分享
2013/12/26 职场文书
英文求职信写作小建议
2014/02/16 职场文书
公司欠款证明
2015/06/24 职场文书
2016年感恩教师节校园广播稿
2015/12/18 职场文书
八年级英语教学反思
2016/02/15 职场文书
Javascript使用integrity属性进行安全验证
2021/11/07 Javascript
python可视化大屏库big_screen示例详解
2021/11/23 Python