gpt4 book ai didi

jquery悬停触发滑动框,求助?

转载 作者:行者123 更新时间:2023-12-01 04:25:23 25 4
gpt4 key购买 nike

我有以下代码:

        <html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>

<script>
$(document).ready(function() {
// hides the slickbox as soon as the DOM is ready (a little sooner that page load)
$('#slickbox').hide();
$('#slick-slidetoggle').hover(function() {
$('#slickbox').slideToggle(400);
return false;
});
});
</script>

<style>
#slickbox {
background: #EEE;
border: 1px solid #900;
height: 135px;
}
</style>
</head>
<body>
<a href="#" id="slick-slidetoggle">Slide toggle the box</a>

<div id="slickbox" style="display: block; ">This is the box that will be shown and hidden and toggled at your whim. :)</div>
</body>
</html>

为了方便起见,我也将其放入 jsfiddle 中:http://jsfiddle.net/WFf9X/

我需要帮助来实现以下目标:

我希望能够滚动文本:滑动切换框,该框应该打开,但我也应该能够在框中移动光标,而不关闭它。仅当光标离开框或文本滑动切换框时,框才会在 400 毫秒后关闭。

感谢您的帮助。

最佳答案

首先制作 #slick-slidetoggle你的 child <a> :

<a href="#" id="slick-slidetoggle">
Slide toggle the box
<div id="slickbox" style="display: none; ">This is the box that will be shown and hidden and toggled at your whim. :)</div>
</a>

fiddle :http://jsfiddle.net/ambiguous/WFf9X/1/

这样,您仍然会将鼠标悬停在 <a> 上当鼠标位于 <div> 内时。这样做的问题是它使得整个<div>链接的一部分,但您可以使用其他内容而不是 <a> 来清理它并移动<a>在“其他东西”里面:

<div id="slick-slidetoggle">
<a href="javascript:void(0)">Slide toggle the box</a>
<div id="slickbox" style="display: none;">This is the box that will be shown and hidden and toggled at your whim. :)</div>
</div>

fiddle :http://jsfiddle.net/ambiguous/WFf9X/2/

关于jquery悬停触发滑动框,求助?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6810434/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com