http://www.kahuna-webstudio.fr/を見て、ページを約 50 ピクセル下にスクロールすると、画面の左側にある div がスライド アウトします。私はこの効果を複製することに成功しましたが、私には 1 つのことが避けられます。それは、私のページで更新を押すと、jquery プログラミングがリセットされます。私はこれが起こることを望んでいません。http://www.kahuna-webstudio.fr/は完全に機能しています。ページを 50 ピクセル下にスクロールすると左のナビゲーションが表示され、更新を押しても左のナビゲーションは表示されたままです。左側のナビゲーションは、ユーザーがスクロールしてページの上部に戻ったときにのみ消えます。
現在機能していること:ユーザーがページを 296 ピクセル下にスクロールすると、左のナビゲーションがスライドし、ユーザーがスクロール バーをページの上部 (25 ピクセル未満) に戻すと、左のナビゲーションがスライドして消えます。これはすべて機能しています。
何が機能していないか:しかし、ユーザーが 296 ピクセル下にスクロールし、左側のナビゲーションがスライドアウトし、ユーザーがページを表示しているときに更新を押したとします。この場合、左のナビゲーションが消えます。jquery プログラミングがリセットされました。ユーザーが 296 ピクセル以上の場合、ユーザーが更新を押しても左のナビゲーションが常に表示されるようにします。
私のコードは以下です。私の質問が理にかなっていることを願っています。どんな助けも歓迎します。ありがとうございました。
$(window).scroll(function () {
var wintop = $(window).scrollTop();
var docheight = $(document).height();
var winheight = $(window).height();
var newwidthgrow = 80;
var smallheight = 0;
var smallwidth = 0;
//var expanded = "false";
if ((wintop > 296)) {
//expanded = "true";
$("#slidebottom").stop().animate({
height: docheight + "px"
}, 'fast', function () {
$("#slidebottom").stop().animate({
width: newwidthgrow + "px"
}, 'slow', function () {
$("#slidebottomContents").fadeIn();
});
});
}
if ((wintop < 25)) {
//expanded = "false";
$("#slidebottom").stop().animate({
height: docheight + "px"
}, 'fast', function () {
$("#slidebottomContents").fadeOut(function () {
$("#slidebottom").stop().animate({
width: smallwidth + "px"
});
});
});
}
});