调用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 相关文章推荐
jQuery 判断元素上是否绑定了事件
Oct 28 Javascript
js tab效果的实现代码
Dec 26 Javascript
javascript中字符串替换函数replace()方法与c# 、vb 替换有一点不同
Jun 25 Javascript
jquery固定底网站底部菜单效果
Aug 13 Javascript
常用的jquery模板插件——jQuery Boilerplate介绍
Sep 23 Javascript
js文件包含的几种方式介绍
Sep 28 Javascript
jQuery实现checkbox全选的方法
Jun 10 Javascript
JavaScript将base64图片转换成formData并通过AJAX提交的实现方法
Oct 24 Javascript
JavaScript内存泄漏的处理方式
Nov 20 Javascript
node.js环境搭建图文详解
Sep 19 Javascript
Angular7创建项目、组件、服务以及服务的使用
Feb 19 Javascript
小程序表单认证布局及验证详解
Jun 19 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计算百度地图两个GPS坐标之间距离的方法
2015/01/09 PHP
PHP设计模式之建造者模式定义与用法简单示例
2018/08/13 PHP
Avengerls vs Newbee BO3 第一场2.18
2021/03/10 DOTA
写出更好的JavaScript之undefined篇(上)
2009/11/22 Javascript
5个最佳的Javascript日期处理类库分享
2012/04/15 Javascript
javascript高级程序设计第二版第十二章事件要点总结(常用的跨浏览器检测方法)
2012/08/22 Javascript
jquery实现弹出窗口效果的实例代码
2013/11/28 Javascript
jquery和css3实现的炫酷时尚的菜单导航
2014/09/01 Javascript
AngularJS入门教程之学习环境搭建
2014/12/06 Javascript
详细介绍jQuery.outerWidth() 函数具体用法
2015/07/20 Javascript
javascript实现方法调用与方法触发小结
2016/03/26 Javascript
利用JS实现点击按钮后图片自动切换的简单方法
2016/10/24 Javascript
jQuery中get方法用法分析
2016/12/07 Javascript
详解javascript获取url信息的常见方法
2016/12/19 Javascript
微信小程序 封装http请求实例详解
2017/01/16 Javascript
AngularJS的ng-repeat指令与scope继承关系实例详解
2017/01/21 Javascript
vue axios 二次封装的示例代码
2017/12/08 Javascript
JavaScript反射与依赖注入实例详解
2018/05/29 Javascript
详解Vue的常用指令v-if, v-for, v-show,v-else, v-bind, v-on
2018/10/12 Javascript
20道JS原理题助你面试一臂之力(必看)
2019/07/22 Javascript
浅谈layui 数据表格前后台传值的问题
2019/09/12 Javascript
Python使用asyncio包处理并发详解
2017/09/09 Python
人机交互程序 python实现人机对话
2017/11/14 Python
Python实现判断字符串中包含某个字符的判断函数示例
2018/01/08 Python
python3+PyQt5+Qt Designer实现堆叠窗口部件
2018/04/20 Python
Python读取txt文件数据的方法(用于接口自动化参数化数据)
2018/06/27 Python
Python中Subprocess的不同函数解析
2019/12/10 Python
德国咖啡批发商:Coffeefair
2019/08/26 全球购物
测试驱动开发的主要步骤是什么
2014/12/10 面试题
Python中如何定义一个函数
2016/09/06 面试题
防灾减灾标语
2014/10/07 职场文书
2014年公司工作总结
2014/11/22 职场文书
家装电话营销开场白
2015/05/29 职场文书
党支部评议意见
2015/06/02 职场文书
2015教师个人师德工作总结
2015/10/23 职场文书
Python中的嵌套循环详情
2022/03/23 Python