jQuery 和 CSS 问题

Question

我在 http://jsfiddle.net/48k7g/5/ 写了一个 jQuery 代码

$('#btn').click(function(){
    $('#pph_test').hide('slow');
});

我需要让它类似于这样:

单击该按钮将打开一个新部分，如图像示例所示。还请帮助我使用正确的 CSS 使其看起来像示例。

Answer 1

您真正需要的是在该容器的顶部制作一个具有 float:right; 的 css 的 div。我添加了额外的 CSS 以使其看起来更像图像。

.float {
    display:none;
    width:300px;
    float:right;
    margin:10px;
    padding:3px;
    border:1px solid #000;
    background:grey;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    border-radius:3px;
}

然后按钮将是:

$('#btn').click(function () {
    $('#pph_test .float').toggle();
});

http://jsfiddle.net/48k7g/8/