2012-02-06 12 views
-1

私はウェブサイト上で動作し、そのメニューに問題があります。私がメニューの上にマウスを置くと、そのサブメニューは現れません。この問題を解決するために親切に私を助けてください。メニューのホバーオーバーで問題を解決する方法

var $jnav = jQuery.noConflict(); 
$jnav(document).ready(function() { 
    $jnav('#menu-mainnav li').hover(

    function() { 
     $jnav(this).css('background', "url('http://www.mulberrydesignerkitchens.com/wp-content/themes/MBK/images/nav-current-bg.png') no-repeat", 'cursor', "pointer"); 
     if ($jnav(this).is('#menu-mainnav li:last-child')) { 
      $jnav('#menu-mainnav li:last-child').css('background', "url('http://www.mulberrydesignerkitchens.com/wp-content/themes/MBK/images/nav-last-bg.png') no-repeat"); 
     } else if ($jnav(this).is('.sub-menu li:last-child')) { 
      $jnav('.sub-menu li:last-child').css('background', "none scroll #8e4d69"); 
     } 
    }, function() { 
     if (!$jnav(this).hasClass('current-menu-item')) { 
      $jnav(this).css('background', "none"); 
     } 
     if (!$jnav('#menu-mainnav li:first').hasClass('current-menu-item')) { 
      $jnav('#menu-mainnav li:first').css('background', "url('http://www.mulberrydesignerkitchens.com/wp-content/themes/MBK/images/nav-first-bg.png') no-repeat"); 
     } 
    }) 
    $jnav('#menu-mainnav li ul li').hover(

    function() { 
     $jnav(this).css('background-color', "#8e4d69", 'cursor', "pointer"); 
    }, function() { 
     if (!$jnav(this).hasClass('current-menu-item')) { 
      $jnav(this).css('background', "#833b5d"); 
     } 
    }) 
    if (!$jnav('.superfish li:first').hasClass('current-menu-item')) $jnav('.superfish li:first').css('background', "url('http://www.mulberrydesignerkitchens.com/wp-content/themes/MBK/images/nav-first-bg.png') no-repeat"); 
    $jnav('.superfish li.current-menu-item:last-child').css('background', "url('http://www.mulberrydesignerkitchens.com/wp-content/themes/MBK/images/nav-last-bg.png') no-repeat"); 
    if (!$jnav('.sub-menu li:first').hasClass('current-menu-item')) $jnav('.sub-menu li:first').css('background', "#833b5d"); 
    $jnav('.sub-menu li.current-menu-item:last-child').css('background', "#833b5d"); 

    $jnav('ul.superfish').superfish(); 
}); 

私はそれをサブを参照するには、ナビゲーションを超えるクリックする必要があり、すべての時間をjQueryのメニューを実装するためにコードの一部を使用して

enter image description here

Full size image

http://www.mulberrydesignerkitchens.com/

イム-メニュー。 plz plz plz私はこの問題を解決するのに役立ちます。

ありがとうございました。

+3

メニュー?問題のページへのリンクだけではなく、関連する部分のみを投稿してください。 – karim79

+0

私が欲しいものの画像をアップロードしてください。 – Muzammil

+0

サブメニューはここには表示されません。あなたは本当に人々がその小さなタイプを読むことを期待していないのですか? – Scott

答えて

1

あなたのメニュー(SuckerfishとjNav)のホバーイベントのためにお互いに戦っている2つのメニュースクリプトがあります。そのうちの1つを削除するとメニューが修正されます。あなたが必要なすべてを動作させるためにsuckerfish

var $jnav = jQuery.noConflict(); 
$jnav(document).ready(function() { 
    $jnav('#menu-mainnav li').hover(

    function() { 
     $jnav(this).css('background', "url('http://www.mulberrydesignerkitchens.com/wp-content/themes/MBK/images/nav-current-bg.png') no-repeat", 'cursor', "pointer"); 
     if ($jnav(this).is('#menu-mainnav li:last-child')) { 
      $jnav('#menu-mainnav li:last-child').css('background', "url('http://www.mulberrydesignerkitchens.com/wp-content/themes/MBK/images/nav-last-bg.png') no-repeat"); 
     } else if ($jnav(this).is('.sub-menu li:last-child')) { 
      $jnav('.sub-menu li:last-child').css('background', "none scroll #8e4d69"); 
     } 
    }, function() { 
     if (!$jnav(this).hasClass('current-menu-item')) { 
      $jnav(this).css('background', "none"); 
     } 
     if (!$jnav('#menu-mainnav li:first').hasClass('current-menu-item')) { 
      $jnav('#menu-mainnav li:first').css('background', "url('http://www.mulberrydesignerkitchens.com/wp-content/themes/MBK/images/nav-first-bg.png') no-repeat"); 
     } 
    }) 
    $jnav('#menu-mainnav li ul li').hover(

    function() { 
     $jnav(this).css('background-color', "#8e4d69", 'cursor', "pointer"); 
    }, function() { 
     if (!$jnav(this).hasClass('current-menu-item')) { 
      $jnav(this).css('background', "#833b5d"); 
     } 
    }) 
    if (!$jnav('.superfish li:first').hasClass('current-menu-item')) $jnav('.superfish li:first').css('background', "url('http://www.mulberrydesignerkitchens.com/wp-content/themes/MBK/images/nav-first-bg.png') no-repeat"); 
    $jnav('.superfish li.current-menu-item:last-child').css('background', "url('http://www.mulberrydesignerkitchens.com/wp-content/themes/MBK/images/nav-last-bg.png') no-repeat"); 
    if (!$jnav('.sub-menu li:first').hasClass('current-menu-item')) $jnav('.sub-menu li:first').css('background', "#833b5d"); 
    $jnav('.sub-menu li.current-menu-item:last-child').css('background', "#833b5d"); 
    jQuery('.lightbox').lightBox({ 
     imageLoading: 'http://www.mulberrydesignerkitchens.com/wp-content/themes/MBK/images/lightbox-ico-loading.gif', 
     imageBtnClose: 'http://www.mulberrydesignerkitchens.com/wp-content/themes/MBK/images/lightbox-btn-close.gif', 
     imageBtnPrev: 'http://www.mulberrydesignerkitchens.com/wp-content/themes/MBK/images/lightbox-btn-prev.gif', 
     imageBtnNext: 'http://www.mulberrydesignerkitchens.com/wp-content/themes/MBK/images/lightbox-btn-next.gif' 
    }); 
    $jnav('#logo').hover(function() { 
     $jnav(this).css('opacity', '0.8'); 
    }, function() { 
     $jnav(this).css('opacity', '1'); 
    }); 
    $jnav('#homepage-images h4').css('display', 'none'); 
    $jnav('ul.superfish').superfish({ 
     hoverClass: 'nav#primary-menu a' 
    }); 
}); 

は次のとおりです。

<script> 

    $(document).ready(function() { 
     $('ul.sf-menu').superfish(); 
    }); 

</script> 
+0

もし私がそれらの誰かを削除しても。私のすべてのスタイルはなくなります。どうやって同じスタイルとそのホバーオーバーを維持することができますか? – Muzammil

+0

どうすればこの問題を解決できますか? – Muzammil

+0

@MuzammilはJSブロックを削除し、suckerfishが提供するクラスを使用し、CSSを使用してメニューをスタイルします。あなたが簡単なCSSで簡単にスタイルを設定できるときには、JavaScriptを使ってメニューをスタイルすることができます。 SuckerfishはhoverClassを提供しています。これを使用して、メニュー項目のホバーイベントをスタイル設定することができます(斜めの画像を追加するため)。 'hoverClass: 'sfHover'' –

関連する問題