0

我正在使用 Drupals Nivo Slider 模块,并希望当鼠标悬停在滑块 div 上时标题向上滑动,并在鼠标离开 div 时消失。我已经弄清楚了,但我遇到的问题是模块中的 html 具有 display:block 的内联样式,它使标题出现,我不希望标题显示直到有人将鼠标悬停在它上面。现在我必须将鼠标悬停在它上面以摆脱 display:block ,然后由于我正在使用的 mouseleave 事件它可以工作。

奇怪的是,直到第三张图片才出现问题,因为第一张图片没有标题,而第二张图片完全符合我的要求,直到有人鼠标悬停才显示标题。这是第三、第四和第五张图像在图像淡入时显示它们的标题。我尝试在我的 CSS 中添加 display:none !important ,这使得标题根本不出现。这是我的 jQuery,任何帮助将不胜感激,我很抱歉花了这么多文字来解释我的问题。

        $('.nivo-caption').css('display', '');

        $('#home_slider').hover(function(){
                $('.nivo-caption p').slideToggle('fast');
        }); 

        $('#home_slider').mouseleave(function(){
                $('.nivo-caption p').css("display", "none");
        });
4

1 回答 1

0

这个怎么样?

    $('.nivo-caption').hide();

    $('#home_slider').hover(
        function(){
            $('.nivo-caption').show('fast');
        },
        function(){
            $('.nivo-caption').hide('fast');
        },
    ); 
于 2012-10-26T03:51:59.257 回答