2

私は1つのことを理解しようとしています。私は、1ページのWebサイトを持っており、他のメニューリンクがhttp://jsfiddle.net/kuuwj/15/を気に入ったときに、ポートフォリオの下にサブメニューを非表示にしたいです。

HTML

<ul id="navbar">
    <li><a href="#home" id="nav-home">Home</a></li>
    <li><a href="#portfolio" id="nav-portfolio">Portfolio</a>
        <div class="portfolio-apps">
         <section id="website">
            <span class="button">AAAAAAAAAAAAAAAAAAAAAA</span>
         </section>
         <section id="gterminal">
            <span class="button">BBBBBBBBBBBBBBBBBBBBBB</span>
         </section>
         <section>
            <span class="button">CCCCCCCCCCCCCCCCCCCCCC</span>
         </section>
        </div>
    </li>
    <li><a href="#about" id="nav-about">About Me</a></li>
    <li><a href="#contact" id="nav-contact">Contact</a></li>
   </ul>

JS

$(document).ready(function () {
    var portf_apps = $('.portfolio-apps');
    portf_apps.hide();
    $('#nav-portfolio').click(function() {
        portf_apps.show();
    });
      
});
4

2 に答える 2

2

Javascriptを次のように変更します。

$('#navbar > li > a').click(function(){
    portf_apps.hide();
});
$('#nav-portfolio').unbind('click').click(function() {
    portf_apps.show();
});
于 2013-01-22T15:41:22.653 に答える
1

ポートフォリオが1つを表示する前に、別のクリックイベントを他のナビゲーションバー要素にバインドします。

$("#navbar a").on('click', function () {
   $(".portfolio-apps").hide(); 
});

var portf_apps = $('.portfolio-apps');
...

これにより、portf_appsメソッドが後でトリガーされ、クリックされた場合でも子が表示されます。ただし、一般的に親子関係で機能するようにこれを更新することをお勧めします。

http://jsfiddle.net/jWujm/

于 2013-01-22T15:39:16.027 に答える