-2

我只想让 facebook 像 popbox 顶部导航如下：

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

问题是，如何用 btn2 切换另一个名为 POPBOX2 的弹出框，用 btn3 切换 POPBOX3 等等。popBox2和popBox3的LAYOUT与popBox1相同，但 popBox 的箭头在btn 下方。这该怎么做？我已经在这个小提琴http://jsfiddle.net/FArIZzX77/dNVUj/上复制了我的问题

感谢你的回答 ：）

4

2 回答 2

0

基本上是这样的。包裹在 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 做的最简单的事情。

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

于 2012-09-26T12:32:27.193 回答
0

看到这个EDIT FIDDLE把每一个popbox分开。

于 2012-09-26T13:11:46.987 回答