1

这是网址:http: //174.120.239.48/~peakperf/

这是jQuery:

http://pastebin.com/fB16ahcZ

网站仍在大力开发中。

如果您将鼠标悬停在轮播上的“服务保留”上,您将看到该功能的工作方式。悬停时跨度元素淡入,鼠标移出时隐藏。有些卡住了,有些工作正常。另请注意,当您单击向右箭头并滚动轮播时,跨度会卡在“打开”状态。

任何帮助将不胜感激,谢谢!

4

2 回答 2

1

您似乎有多个具有相同 ID 的标签,这是不允许的。身份证是"homeslide6-show"。您还应该在开始之前尝试停止动画并将您的 JavaScript 简化为:

jQuery(document).ready(function() {

    // hides the slickbox as soon as the DOM is ready
    jQuery('#homeslide1, #homeslide2, #homeslide3, #homeslide4, #homeslide5, #homeslide6').hide();

    // shows the slickbox on clicking the noted link  
    for (var i = 1; i <= 6; i++) {
        jQuery('#homeslide' + i + '-show').parent().hover(
            function(e, i) {
                jQuery('#homeslide' + i).stop(true, true).fadeIn('slow');
                e.preventDefault();
                return false;
            },
            function(e, i){
                jQuery('#homeslide' + i).stop(true, true).fadeOut('slow');
                e.preventDefault();
                return false;
            }
        );
    }
});

让我知道这是否有效。

已编辑

我上面的 javascript 不正确。以下作品:

jQuery(document).ready(function() {

    // hides the slickbox as soon as the DOM is ready
    jQuery('#homeslide1, #homeslide2, #homeslide3, #homeslide4, #homeslide5, #homeslide6').hide();

    // shows the slickbox on clicking the noted link  
    for (var i = 1; i <= 6; i++) {
        jQuery('#homeslide' + i + '-show').parent().data({element: '#homeslide' + i}).hover(
            function() {
                var element = jQuery('element');
                jQuery(element).stop(true, true).fadeIn('slow');
                return false;
            },
            function(){
                var element = jQuery('element');
                jQuery(element).stop(true, true).fadeOut('slow');
                return false;
            }
        );
    }
});
于 2011-02-24T00:11:23.280 回答
1

您的标记无效,因为它缺少结束的“a”标记(见下文)

</a>

这是您的代码中的错误。

           <a href="#" id="homeslide6-show">
               <img src="http://174.120.239.48/~peakperf/wp-content/themes/strausberg/images/home_service_retention.jpg" width="200" height="92" />
          </li>
      </ul>

此外,通过使用 each() 函数,您的 jquery 代码可以减少大约 90%。

例如,向您的 ul 添加一个 id 并这样做

<ul id="mycarousel">

    jQuery('#mycarousel').find('span').each(function(){

        jQuery(this).hover(function() {

            jQuery(this).next().fadeIn('slow');

            return false;

        }, function(){

            jQuery(this).next().fadeOut('slow');

            return false;
        });
    });

ps,这段代码是固定到当前的html结构的,你应该使用类来使它更灵活

于 2011-02-24T00:03:42.273 回答