jQuery“.hover”没有在Wordpress主题上工作

时间:2013-11-08 18:09:42

标签: jquery wordpress hover

我有一个大问题。

我编写了一个简单的jQuery脚本,使菜单悬停动画流畅,而不仅仅是使用css“:hover”属性。问题在于它可以在任何地方使用,但不能在我的网站上使用。

header.php中的HTML:

<div id="nav">

     <?php wp_nav_menu( array( 'theme_location' => 'header-menu', 'depth' => 1)); ?>            

</div>

示例前端HTML代码:

<div id="nav">
        <div class="menu-menu-glowne-container">
            <ul id="menu-menu-glowne" class="menu">
                <li id="menu-item-23" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-6 current_page_item menu-item-23"><a href="link">Page Name</a></li>
                <li id="menu-item-23" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-6 current_page_item menu-item-23"><a href="link">Page Name</a></li>
                <li id="menu-item-23" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-6 current_page_item menu-item-23"><a href="link">Page Name</a></li>
            </ul>
        </div>
    </div>

CSS:

#nav ul {
    width: auto;
    margin-left: 15px;
    }

#nav ul li {
    display: inline-block;
    width: auto;
    }

#nav ul li a {
    display: block;
    height: 20px;
    font: 16px Arial;
    text-decoration: none;
    color: #a8a8a8;
    border-right: 1px solid #e9e9e9;
    padding: 20px 20px;
    margin-left: -3px;
    }

#nav ul li a:hovser {
    color: #f1f1f1;
    border-right: 1px solid #a8a8a8;
    text-shadow: none;
    box-shadow: 1px 1px 10px 1px #d1d1d1;
    }

脚本本身:

jQuery(function () {
            jQuery('#nav li a').hover(
               function(){
                  jQuery(this).animate({backgroundColor: '#a8a8a8', color: '#f1f1f1'}, 300);
               }, function(){
                  jQuery(this).animate({backgroundColor: '#f1f1f1', color: '#a8a8a8'}, 300); 
               });
             });

问题是它在我的网站上不起作用:cow-art [dot] pl。在JSFiddle中它运行得很好,但在jQuery 1.6.2上使用jQuery UI 1.8.4:http://jsfiddle.net/kT95d/115/

在jQuery 1.10.1上:http://jsfiddle.net/9nzzr/2/

我不知道问题出在哪里,也许事实上,菜单是通过PHP在Wordpress中加载的?

我整天都想弄明白,但没有成功。我希望你能帮我解决这个问题。

0 个答案:

没有答案