CSS / jQuery - 显示：无基于浏览器大小

Question

在我正在开发的网站上，我有2个登录框。一个位于侧边栏中，一个浮动在屏幕右侧的固定位置。如果浏览器宽度高于1360px，我只想显示向右浮动的登录框。如果宽度低于该宽度，我只想在侧边栏中显示该宽度。

我一直在尝试使用jQuery来执行此操作：

＆＃13;

＆＃13;

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>
	if ( $(window).width() > 1360) { 
		$("#sidelog").css({"display": "none"});
	} else {
		$("#memberbox").css({"display": "none"});
	}
</script>

＆＃13;

＆＃13;

＆＃13;

#sidelog是侧边栏登录框，#memberbox是浮动的。

我不确定为什么它不起作用 - 我只是一个初学者！ LOL。

有人能帮助我吗？

Answer 1

CSS media queries

#sidelog { display: block; }
#memberbox { display: none; }
@media (min-width: 1361px) {
    #sidelog { display: none; }
    #memberbox { display: block; }
}