ホームページ >ウェブフロントエンド >jsチュートリアル >jQuery スライドアウト効果_JavaScript スキル呼び出し時のちらつきの解決策

jQuery スライドアウト効果_JavaScript スキル呼び出し時のちらつきの解決策

WBOY
WBOYオリジナル
2016-05-16 16:54:031386ブラウズ

問題はタイトルにあるとおりで、jQuery のスライドアウト エフェクトを呼び出すと、レイヤーが 1 回点滅します。

というマークを追加する必要があるとの解決策がインターネットでたくさん見つかりました。 コードをコピーします コードは次のとおりです:



しかし問題は、タイトルヘッダーが html4 になったことです。 0. 上記の状況に変更すると、ページが乱雑になります。最後に、jQuery のスライドアウト

エフェクトを書き換えた、専門家によって書かれたものを見つけました。マスターのリンクアドレスは次のとおりです:
http://aqr199.myweb.hinet.net/jquery_slide_iebug.htm

コードは次のとおりです:
コードをコピーします コードは次のとおりです。

var b1 = new slide_fix($('#Div3')); $('#Button5').click(function (){b1.close();});//Close
$('#Button6').click(function(){b1.open();} );//

関数 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();}
});
}

関数 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); rate==1){clearInterval(timeId); }
count
},time);

関数 now() {
return (新しい日付) ; ();
}
}

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。