0
我有一個WordPress插件,用於圖像的滑塊/拇指插件。當我將鼠標懸停在圖像上時,會出現縮略圖,然後當我離開圖像時,它們消失。我遇到的問題是當我向下滾動頁面時,縮略圖重新出現並且不會消失。它以某種方式將懸停在頁面滾動上。jQuery懸停保持活動時向下滾動/向上頁
這裏是隱藏/顯示縮略圖的腳本:
initAutoHide:function(){// Init Auto Hide
HideID = setInterval(methods.hideItems, parseInt(AutoHideTime));
$('.DOP_ThumbnailGallery_Container', Container).hover(function(){
methods.showItems();
}, function(){
HideID = setInterval(methods.hideItems, parseInt(AutoHideTime));
});
},
showItems:function(){// Show Items
clearInterval(HideID);
ItemsHidden = false;
if (imageLoaded){
$('.DOP_ThumbnailGallery_NavigationLeft', Container).css('display', 'block');
$('.DOP_ThumbnailGallery_NavigationRight', Container).css('display', 'block');
}
if (ThumbnailsPosition == 'top'){
$('.DOP_ThumbnailGallery_ThumbnailsContainer', Container).stop(true, true).animate({'margin-top': 0}, 600);
}
if (ThumbnailsPosition == 'right'){
$('.DOP_ThumbnailGallery_ThumbnailsContainer', Container).stop(true, true).animate({'margin-left': $('.DOP_ThumbnailGallery_Container', Container).width()-$('.DOP_ThumbnailGallery_ThumbnailsContainer', Container).width()}, 600);
}
if (ThumbnailsPosition == 'bottom'){
$('.DOP_ThumbnailGallery_ThumbnailsContainer', Container).stop(true, true).animate({'margin-top': $('.DOP_ThumbnailGallery_Container', Container).height()-$('.DOP_ThumbnailGallery_ThumbnailsContainer', Container).height()}, 600);
}
if (ThumbnailsPosition == 'left'){
$('.DOP_ThumbnailGallery_ThumbnailsContainer', Container).stop(true, true).animate({'margin-left': 0}, 600);
}
methods.showCaption();
},
hideItems:function()
{
clearInterval(HideID);
ItemsHidden = true;
$('.DOP_ThumbnailGallery_NavigationLeft', Container).css('display', 'none');
$('.DOP_ThumbnailGallery_NavigationRight', Container).css('display', 'none');
if (ThumbnailsPosition == 'top'){
$('.DOP_ThumbnailGallery_ThumbnailsContainer', Container).stop(true, true).animate({'margin-top': 0-$('.DOP_ThumbnailGallery_ThumbnailsContainer', Container).height()}, 600);
}
if (ThumbnailsPosition == 'right'){
$('.DOP_ThumbnailGallery_ThumbnailsContainer', Container).stop(true, true).animate({'margin-left': $('.DOP_ThumbnailGallery_Container', Container).width()}, 600);
}
if (ThumbnailsPosition == 'bottom'){
$('.DOP_ThumbnailGallery_ThumbnailsContainer', Container).stop(true, true).animate({'margin-top': $('.DOP_ThumbnailGallery_Container', Container).height()}, 600);
}
if (ThumbnailsPosition == 'left'){
$('.DOP_ThumbnailGallery_ThumbnailsContainer', Container).stop(true, true).animate({'margin-left': 0-$('.DOP_ThumbnailGallery_ThumbnailsContainer', Container).width()}, 600);
}
methods.hideCaption();
}
},
誰能推薦最好的東西做殺懸停時,不能直接在圖像?
要添加到這一點,這裏是滾動時我如何能躲:
$(document).scroll(function(){
$(".DOP_ThumbnailGallery_ThumbnailsContainer").hide();
});
現在,如果用戶將鼠標懸停在後面的圖像,我該怎麼把它帶回來?
感謝, 添
感謝您的快速回復!我發現了一種在用戶滾動時隱藏容器的方法,但唯一的問題是我不知道如何添加邏輯來將其放回,如果它們懸停。以下是我在頁面滾動中隱藏的內容: $(document).scroll(function(){ $(「#DOP_ThumbnailGallery_ThumbnailsContainer」)。hide(); }); 你知道我可以在用戶懸停時重新出現嗎? –