float jquery メニューに問題があります。まあ、それは完全に機能します。しかし、ブラウザ ウィンドウのサイズが変わると、問題が発生します。ウィンドウが十分に大きい場合、完全にスクロール/スライドしますが、スクロール量と「トップ」量がウィンドウの高さよりも大きい場合は、小さなウィンドウでスライドさせたいと思います。現在、ウィンドウのサイズが小さすぎると、メニューが非表示領域 (1024x768 など) でスライドします。
これが私のコードです:
$float_speed=1500; //milliseconds
$float_easing="easeOutQuint";
$menu_fade_speed=500; //milliseconds
$closed_menu_opacity=0.75;
$fl_menu=$("#float_menu_left");
$fl_menu_menu=$("#fl_menu .menu");
$fl_menu_label=$("#fl_menu .label");
$(window).load(function() {
menuPosition=$('#float_menu_left').position().top;
FloatMenu();
$fl_menu.hover(
function(){ //mouse over
$fl_menu_label.fadeTo($menu_fade_speed, 1);
$fl_menu_menu.fadeIn($menu_fade_speed);
},
function(){ //mouse out
$fl_menu_label.fadeTo($menu_fade_speed, $closed_menu_opacity);
$fl_menu_menu.fadeOut($menu_fade_speed);
}
);
});
$(window).scroll(function () {
FloatMenu();
});
function FloatMenu(){
var scrollAmount=$(document).scrollTop();
var topAmount = $("#float_menu_left").css("top");
var newPosition=menuPosition+scrollAmount;
if($(window).height()<$fl_menu.height()+scrollAmount){
$fl_menu.css("top",menuPosition);
} else {
$fl_menu.stop().animate({top: newPosition}, $float_speed, $float_easing);
}
}
最後の機能は重要であり、問題を引き起こす機能です。特にこの部分:
if($(window).height()<$fl_menu.height()+scrollAmount){
$fl_menu.css("top",menuPosition);
} else {
$fl_menu.stop().animate({top: newPosition}, $float_speed, $float_easing);
}
あなたが私を助けてくれることを願っています、私は一生懸命努力しました、信じてください。
よろしくお願いします