如何在调整浏览器大小时隐藏div？

Question

结帐www.usatoday.com。
调整浏览器大小时，隐藏右侧部分。然后，当点击按钮（当然现在正在隐藏时出现）时，它无处可见。我想做同样的事情。

Answer 1

在CSS中使用媒体查询

@media only screen and (max-device-width: 480px) {
    .mydiv{display:none;}
}

相应地改变你的宽度。

Answer 2

将使用媒体查询检查http://mediaqueri.es/  更多例子

这里有一些关于媒体查询的教程

http://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries

http://www.1stwebdesigner.com/css/media-queries-tutorial-convert-burnstudio-responsive-website/

Answer 3

我建议你做出非常简单的决定。这是你html：

<div id="divToHide">
    TEXT THAT SHOUD DISAPPEAR
</div>
<button id="showDivToHide">
    Show div</button>

这就是javascript代码：

$(document).ready(function () {
    $(window).resize(function () {
        $('#divToHide').hide();
    });

    $('#showDivToHide').click(function () {
        $('#divToHide').show();
    });
});

当然，您可以描述自己的规则来隐藏和显示您的div。