2014-02-26 148 views
0

你好,我有两个弹出的div,当点击主导航时弹出。目前,第二个div始终保持在最前,所以你必须关闭它才能获得第一个div。这里有一个链接我的网站,所以你可以看到我在说什么:http://nshek.com/弹出窗口顶部?

当你点击混合媒体,然后摄影,没有问题。但是,我希望在打开照片弹出窗口时单击混合媒体时显示在顶部。

任何帮助将不胜感激。这里是我的导航&弹出窗口的代码。

<ul id="topnav"> 
<li><a href = "javascript:void(0)" onclick = "document.getElementById('print').style.display='block';document.getElementById('fade').style.display='block'">mixed media/prints</a></li> 
    <div id="print" class="white_content"> 
    <div id="link"> 
    <b>prints</b> 
    <br />-<a href="/photobased.php">photo-based</a> 
    <br />-<a href="/silkscreen.php">silkscreen</a> 
    <br />-<a href="/relief.php">relief/monoprint</a> 
    <br />-<a href="/litho.php">lithography</a> 


    <br><b>other mediums</b> 
    <br />-<a href="">mixed media</a> 
    <br />-<a href="">paintings</a> 
    </div> 
    <br><br> 
    <div id="close"><a href = "javascript:void(0)" onclick = "document.getElementById('print').style.display='none';document.getElementById('fade').style.display='none'">Close</a></div> 
    </div> 

<li><a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">photography</a></li> 
    <div id="light" class="white_content"> 
    <b>digital photography</b> 
    <br /><div id="link"> 
    -<a href="">list series</a> 
    <br />-<a href="/">view all</a> 
    </div> 
    <br><b>film photography</b> 
    <br /><div id="link"> 
    -<a href="/cafilm.php">california, usa</a> 
    <br />-<a href="/hkfilm.php">hong kong</a> 
    <br />-<a href="/miscfilm.php">miscellaneous</a> 
    </div> 
    <br><br> 
    <div id="close"><a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">Close</a></div> 
    </div> 

<li><a href="/digitalworks.php">digital works</a></li> 
<li><a href="/CV.php">CV/resumé</a></li> 
<li><a href="/contact.php">contact</a></li> 
</ul> 

回答

0

添加你有隐藏你的div到你的脚本透露出一个div被点击菜单项上,这样当您单击菜单项时,脚本代码首先隐藏,可以来回切换所有div然后只显示与您刚刚单击的菜单项相对应的一个。

此外,您已将id“close”分配给两个不同的div。 Id应该是唯一的 - 只能使用一次。为了避免这种情况,不要让“关闭”一个班级和ID。

0

在你的情况下,你只是没有隐藏下一个弹出窗口,它可能比你的第一个弹出窗口索引更高,所以你只需要先隐藏它,然后通常弹出下一个弹出窗口。通过jQuery 解决方案:

$('#showFirst').bind('click', function(){ 
    $('#1').show(); 
    $('#2').hide(); 
}) 

这里是小提琴http://jsfiddle.net/Goodluck/uxv73/