调用jQuery滑出效果时闪烁的解决方法

前端技术 2023/09/10 JavaScript
问题现象如题所示，在调用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();
}
}

本文地址：https://www.stayed.cn/item/26537

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案