2011-07-12 10 views
4

このメニューでは、サブカテゴリが下にスライドします。メインカテゴリページでサブメニューを開いたままにするにはCSSを使用しましたが、jQuery slideUp()機能はmouseOutでその機能を無効にしています。私はメインメニューのページでサブメニューを開いたままにしておきたいと思います。あなたのメインカテゴリページのhrefが何であるかを見るためにサブメニューを開いたままにする

$(document).ready(function() { 
    $(".main").hover(function() { 
     $(".sub", this).slideDown('slow'); 
    }, 
    function() { 
     if(window.location.href != 'mysite.com/main-categories') 
     { 
      $(".sub", this).slideUp('slow'); 
     } 
    }); 
}); 

単にalert(window.location.href);を、その値のスワップ:

<div id="sidebar"> 
<ul> 
    <li class="main"> 
     <a href="real_estate.php" class="real_estate">Real Estate </a> 
     <ul class="sub" id="sub_real_estate"> 
      <li> <a href="consulting.php">Consulting Services</a></li> 
      <li> <a href="investment.php">Investment</a></li> 
      <li> <a href="property_mgmt.php">Property Management</a></li> 
      <li> <a href="development.php">Development</a></li> 
     </ul> 
    </li> 
    <li class="main"> 
     <a href="investment.php" class="">Investment</a> 
     <ul class="sub" id="sub_investment"> 
      <li><a href="philosophy.php">Philosophy</a></li> 
      <li><a href="criteria.php">Criteria</a></li> 
     </ul> 
    </li> 
</ul> 
</div> 

のjQuery

$(document).ready(function() { 
$(".main").hover(function() { 
    $(".sub", this).slideDown('slow'); 
}, 
function() { 
    $(".sub", this).slideUp('slow'); 
}); 
}) 

CSS

.sub {display:none;} 

body.real_estate #sub_real_estate, body.investment #sub_investment { 
display:block; 
} 

答えて

2

これを試してみてください〜に入る私が上記で提供した比較。あなたは、その後も.currentからdisplay:none;を削除する必要がCSSで

$(document).ready(function() { 
$(".main").hover(function() { 
    $(".sub", this).not(".current").slideDown('slow'); 
}, 
function() { 
    $(".sub", this).not(".current").slideUp('slow'); 
}); 
}) 

0

あなたはnot()を各ページにサブメニューにclass="current"を入れて使用することができます。

+0

メニュー全体が1ページにあり、すべてのメインページ内にphpを使用している場合、これは機能しますか? – MG1

+0

はい、すべてのページにCSSとJavascriptが含まれている限りです。 – Steeven

+1

これと違うのは 'not()'を使うことと、 'display:inherit;'行fxを使って '.current'をCSSで表示させる必要があることです。スクリプトとそれ以外のものは、常に同じように動作します。なぜそれはうまくいかないと思いますか? – Steeven

関連する問題