メニューホバーオーバーで問題を解決する方法

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

enter image description here

フルサイズの画像

http://www.mulberrydesignerkitchens.com/

私はjQueryメニューを実装するためにコードを使用しています

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();
});

私はそれをサブメニューを見るためにナビゲーション上でクリックする必要があります。 plz plz plz私はこの問題を解決するのに役立ちます。

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

1
サブメニューはここには表示されません。あなたは本当に人々がその小さなタイプを読むことを期待していないのですか?
追加された 著者 Scott,
私が欲しいものの画像をアップロードしてください。
追加された 著者 Muzammil,
どのメニュー?問題のページへのリンクだけではなく、関連する部分のみを投稿してください。
追加された 著者 karim79,

1 答え

あなたはメニューのホバーイベント(SuckerfishとjNav)のためにお互いに戦っている2つのメニュースクリプトを持っており、それらのうちの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");
    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>
1
追加された
まあ、私はそれらの誰かを削除する場合。私のすべてのスタイルはなくなります。どうやって同じスタイルとそのホバーオーバーを維持することができますか?
追加された 著者 Muzammil,
この問題を解決するにはどうすればいいですか
追加された 著者 Muzammil,
Ilich大丈夫。ありがとうございました。あなたに私にいくつかのコードを与えることができれば試してみましょう。それは非常に理解するのに役立ちます。
追加された 著者 Muzammil,
Ilich - ありがとうございました。最終的に完了しました。ありがとうございました
追加された 著者 Muzammil,
はい、私はすでに答えをチェックしています...そして、それは私のために本当に役に立つものでした。もう一度ありがとう。
追加された 著者 Muzammil,
:クリックしたDティック:D
追加された 著者 Muzammil,
@MuzammilはJSブロックを削除し、suckerfishが提供するクラスを使用し、メニューをスタイルするためにCSSを使用します。あなたが簡単なCSSで簡単にスタイルを設定できるときには、JavaScriptを使ってメニューをスタイルすることができます。 SuckerfishはhoverClassを提供しています。これを使用して、メニュー項目のホバーイベントをスタイル設定することができます(斜めの画像を追加するため)。 hoverClass: 'sfHover'
追加された 著者 Andres Ilich,
あなたがそこにチーフを持っている@Muzammil厳しい順序:P ..特に昼食時...しかし、ここにあなたを始めるためのフィドルです: jsfiddle.net/pjSE4 ...単純なCSSでjavascriptで追加しているすべてのスタイルを置き換え始めます。
追加された 著者 Andres Ilich,
@Muzammilうれしい私は助けることができます。あなたの問題を解決するのに役立ちましたら、正しい答えにニックネームを付けることを忘れないでください。
追加された 著者 Andres Ilich,