调用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 相关文章推荐
javascript函数中的arguments参数
Aug 01 Javascript
基于JQuery的简单实现折叠菜单代码
Sep 15 Javascript
Grid得到选择行数据的方法总结
Jan 17 Javascript
jQuery实现用户注册的表单验证示例
Aug 28 Javascript
判断文档离浏览器顶部的距离的方法
Jan 08 Javascript
jQuery学习笔记之jQuery+CSS3的浏览器兼容性
Jan 19 Javascript
JavaScript分页功能的实现方法
Apr 25 Javascript
Jquery解析json字符串及json数组的方法
May 29 Javascript
深入浅析Vue.js计算属性和侦听器
May 05 Javascript
Vuex的初探与实战小结
Nov 26 Javascript
Angular 2使用路由自定义弹出组件toast操作示例
May 10 Javascript
vue 全局封装loading加载教程(全局监听)
Nov 05 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
全国FM电台频率大全 - 1 北京市
2020/03/11 无线电
PHP实现分页的一个示例
2006/10/09 PHP
利用PHP实现与ASP Banner组件相似的类
2006/10/09 PHP
nginx+php-fpm配置文件的组织结构介绍
2012/11/07 PHP
利用php+mcDropdown实现文件路径可在下拉框选择
2013/08/07 PHP
PHP获取中英混合字符串长度的方法
2014/06/07 PHP
JS刷新当前页面的几种方法总结
2013/12/24 Javascript
jQuery实现选项联动轮播效果【附实例】
2016/04/19 Javascript
bootstrap网页框架的使用方法
2016/05/10 Javascript
javascript css红色经典选项卡效果实现代码
2016/05/17 Javascript
JQuery实现动态操作表格
2017/01/11 Javascript
js设置随机切换背景图片的简单实例
2017/11/12 Javascript
JS的Ajax与后端交互数据的实例
2018/08/08 Javascript
详解ES6中的Map与Set集合
2019/03/22 Javascript
[55:35]VGJ.S vs Mski Supermajor小组赛C组 BO3 第二场 6.3
2018/06/04 DOTA
利用Python查看目录中的文件示例详解
2017/08/28 Python
用python实现的线程池实例代码
2018/01/06 Python
基于anaconda下强大的conda命令介绍
2018/06/11 Python
python实现随机漫步算法
2018/08/27 Python
python实现邮件发送功能
2019/08/10 Python
Python时间序列缺失值的处理方法(日期缺失填充)
2019/08/11 Python
运动鞋中的劳斯莱斯:索康尼(SAUCONY)
2017/08/09 全球购物
HealthElement海外旗舰店:新西兰大卖场
2018/02/23 全球购物
药品质量检测应届生求职信
2013/11/14 职场文书
春节活动策划方案
2014/01/24 职场文书
2014年健康教育实施方案
2014/02/17 职场文书
公证委托书模板
2014/04/03 职场文书
《果园机器人》教学反思
2014/04/13 职场文书
捐款通知怎么写
2015/04/24 职场文书
商场圣诞节活动总结
2015/05/06 职场文书
导游词之江西赣州
2019/10/15 职场文书
关于antd tree 和父子组件之间的传值问题(react 总结)
2021/06/02 Javascript
一篇文章看懂MySQL主从复制与读写分离
2021/11/07 MySQL
Redis 哨兵机制及配置实现
2022/03/25 Redis
Redis官方可视化工具RedisInsight安装使用教程
2022/04/19 Redis
使用vuex-persistedstate本地存储vuex
2022/04/29 Vue.js