1

我有一个这样的 HTML 结构：

<ul id="carousel" class="jcarousel-skin-photos">
            <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li>
            <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li>

            <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li>
            <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li>
            <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li>              
            <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li>
            <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li>
            <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li>
            <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li>
            <li><a href="images/content/featuredPhoto.jpg"><img src="images/content/featuredPhoto.jpg" alt="Lorem Ipsum Dolor Sit Amet..." /></a></li>
        </ul>


        <a href="javascript:;" id="zoom">Yakınlaştır</a>

还有一个用于淡入/淡出效果的 jQuery 代码片段：

    $('ul#carousel li a').hover(
  function() {
    $('a#zoom').fadeIn('fast');
  }, 
  function() {
    $('a#zoom').fadeOut('slow');
});

最后我想在a#zoom元素上悬停时显示ul#carousel li a元素。但是淡入/淡出效果有些奇怪。

这是我的工作页面。你可以在网上查看。

那么我该如何解决这个奇怪的问题呢？

4

2 回答 2

6

出现问题是因为当鼠标指针移到缩放图标上时，它不再被认为是在轮播上，所以淡出开始。当淡出完成时，鼠标指针突然在轮播上，所以淡入再次开始。

我认为奇怪的行为是缩放图标的闪烁。

要解决此问题，您必须通过将悬停事件处理程序添加到缩放图标本身来取消鼠标移动到缩放图标上时的淡出。

于 2009-11-25T14:02:05.187 回答
0

我用这段代码解决了这个奇怪的问题：

$('a#zoom').mouseover(function() {
    $(this).stop();
});

谢谢文森特。

于 2009-11-25T15:45:34.980 回答