调用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中绑定事件的命名空间详解
Apr 05 Javascript
Jquery命名冲突解决的五种方案分享
Mar 16 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(三)情景对话中仿打字机输出文字
Jan 23 Javascript
javascript获取下拉列表框当中的文本值示例代码
Jul 31 Javascript
Javascript实现苹果悬浮虚拟按钮
Apr 10 Javascript
基于jQuery的AJAX和JSON实现纯html数据模板
Aug 09 Javascript
jQuery表单元素选择器代码实例
Feb 06 Javascript
JavaScript切换搜索引擎的导航网页搜索框实例代码
Jun 11 Javascript
JS实现带动画的回到顶部效果
Dec 28 Javascript
vue加载完成后的回调函数方法
Sep 07 Javascript
vue组件化中slot的基本使用方法
May 01 Javascript
在vue中created、mounted等方法使用小结
Jul 21 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
玩家交还《星际争霸》原始码光盘 暴雪报以厚礼
2017/05/05 星际争霸
PHP实现定时生成HTML网站首页实例代码
2008/11/20 PHP
Ping服务的php实现方法,让网站快速被收录
2012/02/04 PHP
解析php file_exists无效的解决办法
2013/06/26 PHP
php使用curl通过代理获取数据的实现方法
2016/05/16 PHP
yii2缓存Caching基本用法示例
2016/07/18 PHP
PHP实现双链表删除与插入节点的方法示例
2017/11/11 PHP
Laravel 修改默认日志文件名称和位置的例子
2019/10/17 PHP
php如何实现数据库的备份和恢复
2020/11/30 PHP
jQuery源码分析-02正则表达式 RegExp 常用正则表达式
2011/11/14 Javascript
比较不错的JS/JQuery显示或隐藏文本的方法
2014/02/13 Javascript
JQuery异步加载无限下拉框级联功能实现示例
2014/02/19 Javascript
VUE实现密码验证与提示功能
2019/10/18 Javascript
vue组件实现移动端九宫格转盘抽奖
2020/10/16 Javascript
[51:06]DOTA2-DPC中国联赛 正赛 Elephant vs Aster BO3 第二场 1月26日
2021/03/11 DOTA
python使用rsa加密算法模块模拟新浪微博登录
2014/01/22 Python
Python通过递归遍历出集合中所有元素的方法
2015/02/25 Python
Python 3.x 新特性及10大变化
2015/06/12 Python
Python如何获取系统iops示例代码
2016/09/06 Python
Python中如何获取类属性的列表
2016/12/26 Python
解决python tkinter界面卡死的问题
2019/07/17 Python
解决django中ModelForm多表单组合的问题
2019/07/18 Python
python 类之间的参数传递方式
2019/12/20 Python
python GUI库图形界面开发之PyQt5动态(可拖动控件大小)布局控件QSplitter详细使用方法与实例
2020/03/06 Python
Python连接Impala实现步骤解析
2020/08/04 Python
Django web自定义通用权限控制实现方法
2020/11/24 Python
运动服饰每月订阅盒:Ellie
2018/04/29 全球购物
香港百佳网上超级市场:PARKNSHOP.com
2020/06/10 全球购物
实习护士自我鉴定
2013/10/13 职场文书
会计毕业生自我鉴定
2013/11/04 职场文书
工商管理实习生自我鉴定范文
2013/12/18 职场文书
餐饮收银员岗位职责
2014/02/07 职场文书
厕所文明标语
2014/06/11 职场文书
活动总结新闻稿
2014/08/30 职场文书
警察群众路线对照检查材料思想汇报
2014/10/01 职场文书
团代会开幕词
2015/01/28 职场文书