調(diào)用jQuery滑出效果時閃爍的解決方法
更新時間:2014年03月27日 16:45:22 作者:
這篇文章主要介紹了在調(diào)用jQuery 滑出效果時,層會現(xiàn)次閃爍一下的解決方法,需要的朋友可以參考下
問題現(xiàn)象如題所示,在調(diào)用jQuery 滑出效果時,層會現(xiàn)次閃爍一下.在網(wǎng)上找了許多解決文案,說要加如下標示:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
可問題是現(xiàn)在的 標題頭已 為 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();
}
}
復制代碼 代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
可問題是現(xiàn)在的 標題頭已 為 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();
}
}
相關文章
json對象與數(shù)組以及轉(zhuǎn)換成js對象的簡單實現(xiàn)方法
下面小編就為大家?guī)硪黄猨son對象與數(shù)組以及轉(zhuǎn)換成js對象的簡單實現(xiàn)方法。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-06-06實現(xiàn)只能輸入數(shù)字的input不用replace方法
只能輸入數(shù)字在以往都是使用replace方法實現(xiàn)的,在本文你將學習到不使用它依然可以實現(xiàn),具體代碼如下,感興趣的朋友可以參考下2013-09-09