【问题标题】:.slideToggle hover on div jquery [duplicate].slideToggle 悬停在 div jquery [重复]
【发布时间】:2013-04-24 21:07:33
【问题描述】:

我希望能够在悬停时滑动切换 div,但它不起作用.. 这是代码:

<div class='slide-header'>
        header....
</div>

<div class='slide-content'>
       Content..................
</div>

<script>
$(".slide-header").hover(function () {
    $(".slide-content").slideToggle("slow");
});
</script>

<style><!-- initially, I don't want to display .slide-content -->
    .slide-content { display:none; }
</style>

如何在悬停时使用 .slideToggle?谢谢!

【问题讨论】:

  • 似乎工作正常:jsfiddle.net/j08691/rfUWg
  • 这很好用。看看控制台有没有错误...
  • 你有正确引用 jQuery 吗?你有它在文档准备功能中吗?
  • 谢谢@idor_brand。忘记准备文件了...愚蠢..谢谢!

标签: jquery hover slidetoggle


【解决方案1】:

试试这个

$(".slide-header").hover(function () {
    $(".slide-content").stop().slideDown("slow");
}, function(){
    $(".slide-content").stop().slideUp("slow");
});

【讨论】:

  • 由于某种原因这不起作用..
  • 抱歉,它确实有效。忘记准备文件了。。谢谢!
  • 不客气 :) .. 如果是这种情况,您可能会丢失 document.ready 在您发布的另一种情况下.. 这也应该有效..
  • 在一次 hoverOn 和 hoverOut 之后上下滑动 5 次。为什么?我发现 - .stop() 必须添加
【解决方案2】:

将其包装在 document ready 函数中:

$(function(){
    $(".slide-header").hover(function () {
        $(".slide-content").slideToggle("slow");
    });
});

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-05-05
    相关资源
    最近更新 更多