0

我试图div在有人将鼠标悬停在图像上时显示。

这是我的 jQuery 代码：

var $i = jQuery.noConflict(); 
$i("#overlay-<?php echo $j;?>").hover(function () {
    $i("#overlay-show-<?php echo $j;?>").fadeIn("fast");
    $i("#overlay-show-<?php echo $j;?>").fadeOut("fast");   
});

这是我的 HTML 代码

<div id="overlay-show-1" class="overlay-show" style="display: block;">
 <div class="product-price">
 <h2 class="product-name"><a title="Marotte Top"href="http://sabbathshop.com/index.php/apparel/marotte-top.html">Marotte Top</a></h2>   
 <div class="price-box">
 <span id="product-price-180" class="regular-price">
  <span class="price">$80.00</span></span>
  </div>
  </div>
   <div class="price-bottombg"></div>
 </div>
4

1 回答 1

0

$i("#overlay-show-<?php echo $j;?>").is(":hidden")无论是否有匹配的选择器，都会返回一个对象。

您应该检查length以查看是否有匹配项：

if ($i("#overlay-show-<?php echo $j;?>").is(":hidden").length>0) {

回应您的更新：

由于该事件只有一个函数参数.hover()，因此当您悬停和悬停时将执行此操作。

同样在您的函数中，您fadeIn直接调用fadeOut. 因此，这将导致元素淡入，然后立即再次淡出（导致您提到的闪烁）。

您应该将代码更改为仅fadeIn在悬停时，并且仅fadeOut在悬停时。

$i("#overlay-<?php echo $j;?>").hover(function () {
    $i("#overlay-show-<?php echo $j;?>").fadeIn("fast"); 
}, function(){
    $i("#overlay-show-<?php echo $j;?>").fadeOut("fast");  
});
于 2012-09-27T09:42:41.107 回答