我实现的悬停 jquery 显示和隐藏功能有一个小问题。 [点击此处查看站点][1]当我将 visibility: hidden;
应用于我的 CSS 时,此 div .hover-hide
不显示。但是,当我删除 css 属性 visibility: hidden;
时,一旦将鼠标悬停在 div .hover-hide
上,悬停显示和隐藏功能就会起作用。有谁知道我做错了什么。下面是我的代码片段:
html
<figure class="tint">
<div class="carousel-col-copy hover-hide">
<h1>lee vintage</h1>
<div class="col-copy-passage col-copy-boarder">
<p>With prints inspired by the abstract artists Blinky Palermo and Robert Mangold, lee vintage presents bold pieces from their SS13 collection</p>
</div>
</div>
<img src="timthumb/timthumb.php?src=img/20.jpg&w=450&h=530&zc=1&q=100&a=0" class="slider-img grid-img">
</figure>
$(".tint").hover(function(){
$('.hover-hide').removeClass('hidden');
},function(){
$('.hover-hide').addClass('hidden');
});
最佳答案
试试这个:-
http://jsfiddle.net/DhQjk/
CSS
.hidden { visibility:hidden; }
HTML
最初将隐藏
类添加到您的动态内容。
<div class="carousel-col-copy hover-hide hidden">
JS
悬停时使用 .toggle()
。
$(".tint").hover(function(){
$('.hover-hide').toggleClass('hidden');
});
关于javascript - Jquery 悬停显示和隐藏可见性问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16366199/