這是網站:http://test.slatong.com/如何在一個div顯示時隱藏所有其他div?
在標題菜單中。當你懸停每個列表項時,它將顯示不同的div#id。
我想知道如何隱藏所有其他div的時候彼此格表示很喜歡這個網站的標題:http://www.hytwatches.com/
我仍然在試圖找到辦法。
這裏是我寫的代碼:
<div id="slidemenu">
<!--- HEADER -->
<header class="top-header">
<div class="container">
<div class="row">
<nav class="main-navigation">
<ul class="menu col-lg-10" >
<li data-file="about">
<a href="" class="item col-lg-2">
about us
</a>
</li>
<li data-file="collection">
<a href="" class="item col-lg-2">
collection
</a>
</li>
<li id="logo">
<a href="" class="middle col-lg-2">
<img src="img/logo.png" alt="">
</a>
</li>
<li data-file="innovation">
<a href="" class="item col-lg-2">
innovation
</a>
</li>
<li data-file="find-us">
<a href="" class="item col-lg-2">
find us
</a>
</li>
</ul>
<div class="socials col-lg-2">
<ul>
<li>
<a href="" class="facebook">
f
</a>
</li>
<li>
<a href="" class="twitter">
t
</a>
</li>
<li>
<a href="" class="youtube">
y
</a>
</li>
</ul>
</div>
<!--- socials -->
</nav>
<!--- end main navigation -->
</div>
<!--- end row -->
</div>
<!--- end container -->
</header>
<!--- end top header -->
<!--- SUB MENU SECTION -->
<section>
<div id="sub_menu">
<div class="container">
<div class="row">
<nav>
<ul class="dspn" id="about">
<li class="col-lg-3">
<a href="">
<img src="img/about/about-behind_hyt.png" >
</a>
</li>
<li class="col-lg-3">
<a href="">
<img src="img/about/about-behind_hyt.png" >
</a>
</li>
<li class="col-lg-3">
<a href="">
<img src="img/about/about-behind_hyt.png" >
</a>
</li>
<li class="col-lg-3">
<a href="http://www.hytwatches.com/Services/PressMedia.sls" >
<img src="img/about/about-behind_hyt.png" >
</a>
</li>
</ul>
</nav>
<nav>
<ul class="dspn" id="innovation">
<li class="col-lg-3">
<a href="http://www.hytwatches.com/Innovation/HYTScience.sls">
<img src="img/about/about-behind_hyt.png" >
</a>
</li>
<li class="col-lg-3">
<a href="http://www.hytwatches.com/Innovation/HYTnnovation.sls">
<img src="img/about/about-behind_hyt.png" >
</a>
</li>
<li class="col-lg-3">
<a href="http://guide.hytwatches.com">
<img src="img/about/about-behind_hyt.png" >
</a>
</li>
</ul>
</nav>
<nav>
<ul class="dspn" id="find-us">
<li class="col-lg-3">
<a href="http://www.hytwatches.com/Services/CustomerService.sls" >
<img src="img/about/about-behind_hyt.png" >
</a>
</li>
<li class="col-lg-3">
<a href="http://www.hytwatches.com/Services/ContactHYT.sls" >
<img src="img/about/about-behind_hyt.png" >
</a>
</li>
<li class="col-lg-3">
<a href="http://www.hytwatches.com/Services/Retails.sls">
<img src="img/about/about-behind_hyt.png" >
</a>
</li>
<li class="col-lg-3">
<a href="http://lounge.hytwatches.com">
<img src="img/about/about-behind_hyt.png" >
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</section>
<!--- end sub menu section -->
這裏是jQuery代碼:
$(document).ready(function(){
var id = $(".main-navigation ul li").data("file");
$("#sub_menu nav ul#" + id).addClass("dspn");
});
請分享你的JavaScript代碼 –
你有沒有在這使得任何試圖自己這麼遠? SO不是一個網站來請求代碼,而是請求幫助解決您已有的代碼。此外,最好將問題代碼包含在帖子中,而不是鏈接到外部網站。一旦問題得到解決,外部網站將不再有用作爲路上其他人的參考。 –
對不起,我只是重寫了我的問題。 –