Question

在“caption”类中执行jQuery代码似乎存在一些问题。

我的类“.showmore”位于标题部分，但是当我执行悬停功能时，它似乎没有执行这个jQuery函数。

Galleriffic jQuery中有什么东西阻止我执行这个???

<html>
    <head>
        <link rel="stylesheet" href="<?php echo $siteurl; ?>css/galleriffic-2.css" type="text/css" />
        <script type="text/javascript" src="<?php echo $siteurl; ?>js/jquery.galleriffic.js"></script>
        <script type="text/javascript" src="<?php echo $siteurl; ?>js/jquery.opacityrollover.js"></script>
    </head>

    <script type="text/javascript">
        $('.showmore').hover(function(){
            $(this).fadeTo('fast', 1);
        });
    </script>

    <div class="caption">    
        <div class="showmore">+</div>
    </div>

Answer 1

尝试将<script>移至页面底部。目前$('.showmore').hover(...)在.showmore div写入页面之前执行。

或者您可以尝试这样的事情：

$(function() {
    $('.showmore').hover(function(){
        $(this).fadeTo('fast', 1);
    });
});

这可确保您在DOM完成加载后执行代码。有关详细信息，请参阅.ready()。

还尝试将两个函数传递到悬停事件中。它确实无关紧要（参见source code），但通常情况下，hover接受两个函数作为参数 - 第一个在鼠标进入元素时执行，第二个在鼠标离开时执行元素。这是一个例子：

$('.showmore').hover(function() { $(this).fadeIn('fast'); },
                     function() { $(this).findOut('fast'); });

当只传入一个函数时，该函数在鼠标进入和离开元素时都会执行。

另外，请确保您在页面中包含jquery。在您发布的示例中，似乎您包含了galleriffic和opacityrollover插件，但不包括jquery核心。

使用jQuery内联的jQuery Galleriffic问题

1 个答案: