调用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 相关文章推荐
onbeforeunload与onunload事件异同点总结
Jun 24 Javascript
JS中的this变量的使用介绍
Oct 21 Javascript
JavaScript Array对象扩展indexOf()方法
May 09 Javascript
javascript面向对象特性代码实例
Jun 12 Javascript
jQuery的观察者模式详解
Dec 22 Javascript
判断数组是否包含某个元素的js函数实现方法
May 19 Javascript
windows下vue.js开发环境搭建教程
Mar 20 Javascript
vue使用ElementUI时导航栏默认展开功能的实现
Jul 04 Javascript
js实现开关灯效果
Mar 30 Javascript
解决微信小程序scroll-view组件无横向滚动的问题
Feb 04 Javascript
全局安装 Vue cli3 和 继续使用 Vue-cli2.x操作
Sep 08 Javascript
vue使用v-model进行跨组件绑定的基本实现方法
Apr 28 Vue.js
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
substr()函数中文版
2006/10/09 PHP
织梦模板标记简介
2007/03/11 PHP
将一维或多维的数组连接成一个字符串的php代码
2010/08/08 PHP
比较strtr, str_replace和preg_replace三个函数的效率
2013/06/26 PHP
smarty模板中使用get、post、request、cookies、session变量的方法
2014/04/24 PHP
PHP实现利用MySQL保存session的方法
2014/08/23 PHP
详解PHP中websocket的使用方法
2016/09/15 PHP
PHP中大括号'{}'用法实例总结
2017/02/08 PHP
ajax调用返回php接口返回json数据的方法(必看篇)
2017/05/05 PHP
jquery得到font-size属性值实现代码
2013/09/30 Javascript
js控制网页背景音乐播放与停止的方法
2015/02/06 Javascript
基于javascript实现仿百度输入框自动匹配功能
2016/01/03 Javascript
vue深入解析之render function code详解
2017/07/18 Javascript
vuejs实现本地数据的筛选分页功能思路详解
2017/11/15 Javascript
详解ES6系列之私有变量的实现
2018/11/21 Javascript
JS实现图片拖拽交换效果
2018/11/30 Javascript
vue-router的钩子函数用法实例分析
2019/10/26 Javascript
TensorFlow数据输入的方法示例
2018/06/19 Python
Python3.7 dataclass使用指南小结
2019/02/22 Python
基于python操作ES实例详解
2019/11/16 Python
python GUI库图形界面开发之PyQt5中QMainWindow, QWidget以及QDialog的区别和选择
2020/02/26 Python
Python读取文件内容为字符串的方法(多种方法详解)
2020/03/04 Python
使用Django实现把两个模型类的数据聚合在一起
2020/03/28 Python
css3 clip实现圆环进度条的示例代码
2018/02/07 HTML / CSS
东南亚旅游平台:The Trip Guru
2018/01/01 全球购物
凯撒娱乐:Caesars Entertainment
2018/02/23 全球购物
法雷奥SQA(electric)面试问题
2016/01/23 面试题
5.1手机促销活动
2014/01/17 职场文书
销售顾问岗位职责
2014/02/25 职场文书
责任担保书范文
2014/05/21 职场文书
妇联领导班子剖析材料
2014/08/21 职场文书
行政专员岗位职责范本
2014/08/26 职场文书
管辖权异议上诉状
2015/05/23 职场文书
mysql多表查询-笔记七
2021/04/05 MySQL
Python爬虫之爬取某文库文档数据
2021/04/21 Python
MySQL数据库Innodb 引擎实现mvcc锁
2022/05/06 MySQL