我正在使用Drupals Nivo Slider模块,并希望当鼠标悬停在滑块div上时标题向上滑动,当鼠标离开div时消失。我已经弄清楚了,但我遇到的问题是模块中的html具有内联样式的显示:块并且它使标题出现并且我不希望标题显示直到某人鼠标悬停在它上面。现在我必须鼠标悬停它以摆脱显示:阻止,然后它工作,因为我正在使用mouseleave事件。
奇怪的是问题直到第三张图片才出现,因为第一张图片没有标题,而第二张图片正是我想要的,而不是显示标题直到有人将鼠标放在上面。这是第三张,第四张和第五张图像在图像淡入时显示其标题。我尝试添加display:none!对我的css很重要,这使得字幕根本不显示。这是我的jQuery,任何帮助将非常感谢,我很抱歉花了这么多文字来解释我的问题。
$('.nivo-caption').css('display', '');
$('#home_slider').hover(function(){
$('.nivo-caption p').slideToggle('fast');
});
$('#home_slider').mouseleave(function(){
$('.nivo-caption p').css("display", "none");
});
答案 0 :(得分:0)
这个怎么样?
$('.nivo-caption').hide();
$('#home_slider').hover(
function(){
$('.nivo-caption').show('fast');
},
function(){
$('.nivo-caption').hide('fast');
},
);