Question

我只想让facebook像popbox一样导航如下：

http://i.stack.imgur.com/kQqJi.png

问题是，如何使用btn2切换另一个名为POPBOX2的popbox，使用btn3切换POPBOX3等等。 popBox2 的 LAYOUT 和 popBox3 的 popBox3 ，但 popBox1 的箭头 popBox在btn下。这该怎么做？我在这个小提琴http://jsfiddle.net/FArIZzX77/dNVUj/

中复制了我的问题

感谢答案：）

Answer 1

基本上，就像这样。包含在jQuery document.ready。

中

打开弹出框的按钮

$(document).ready(function(){
    $('#linkid').click(function(){
        $('.popupboxclass').hide();
        $('#popupbox1').show();
    });
    $('#link2id').click(function(){
        $('.popupboxclass').hide();
        $('#popupbox2').show();
    });
    $('#link3id').click(function(){
        $('.popupboxclass').hide();
        $('#popupbox3').show();
    });
});

<强> CSS：

.yourcontainer{
position:relative;
}

.popupboxclass{
display:none;
position:absolute;
top:50px;
left;50px;
width:200px;
height:200px;
border:1px solid #000;
}

<强> HTML

<div class="yourcontainer">
    <a href="#" id="linkid">Open popup 1</a>
    <a href="#" id="link2id">Open popup 2</a>
    <a href="#" id="link3id">Open popup 3</a>
    <div class="popupboxclass" id="popupbox1">Box 1</div>
    <div class="popupboxclass" id="popupbox2">Box 2</div>
    <div class="popupboxclass" id="popupbox3">Box 3</div>
</div>

小提琴：http://jsfiddle.net/Sqa2D/1/

但请在尝试之前尝试一下。不要只是等待并认为社区会为你做这件事。这是你用jQuery做的最简单的事情。

修改我误解了一部分，我编辑了我的答案。

Answer 2

请参阅 EDIT FIDDLE ，将每个popbox分开。

jQuery facebook喜欢popbox顶级导航

2 个答案: