最小化到页面底部

时间:2014-03-13 13:24:43

标签: javascript jquery html css

我有一个div标签,用于最小化我使用以下JS

function my()
{
    $("#button").click(function(){
        if($(this).html() == "+"){
            $(this).html("-");
            $("#box, #title_bar").toggle("Up");
        }
        else{
            $(this).html("+");
            $("#box, #title_bar").toggle("Down");
        }    
    });
}

我的div标签看起来像这样,

<div id="widnow">
    <div id="button">-</div>
    <div id="title_bar"><b>Console Log</b></div>
    <div id="box"></div>
</div>

将我的div最小化到页面的左上角,如下图所示,

when max

最小化时

when min

对于我已经使用的扩展,只能在底部扩展,

#widnow{
    position: absolute;
    top: 750px;
    right: 0;
    bottom: 0;
    left: 42px;
    resize: both;
}

所以现在我希望它像facebook聊天窗口,即

  1. 最小化到页面底部和
  2. 最大化到原始位置250px和
  3. 只能在窗口顶部展开。
  4. 我如何完成上述任务?

    感谢。

1 个答案:

答案 0 :(得分:1)

试试这个:

function Minimize() 
{
    window.innerWidth = 100;
    window.innerHeight = 100;
    window.screenX = screen.width;
    window.screenY = screen.height;
    alwaysLowered = true;
}

function Maximize() 
{
    window.innerWidth = screen.width;
    window.innerHeight = screen.height;
    window.screenX = 0;
    window.screenY = 0;
    alwaysLowered = false;
}

<A HREF="javascript:onClick=Minimize()">Minimize</A>
<A HREF="javascript:onClick=Maximize()">Maximize</A>