如果用户屏幕为< 1024px,因为它将覆盖我的博客内容区域.我发现这个jQuery在网上,但我不知道如何使用它.
$(document).ready(function() {
if ((screen.width>1024)) {
// if screen size is 1025px wide or larger
$(".yourClass").css('display','none'); // you can also use $(".yourClass").hide();
}
elseif ((screen.width<=1024)) {
// if screen size width is less than 1024px
$(".yourClass").css('display','block'); // here you can also use show();
}
});
如果我的浮动div类名称是sharecontent,我应该如下替换上述脚本？如果是的话,它不工作.
$(document).ready(function() {
if ((screen.width>1024)) {
// if screen size is 1025px wide or larger
$(".sharecontent").css('display','none'); // you can also use $(".yourClass").hide();
}
elseif ((screen.width<=1024)) {
// if screen size width is less than 1024px
$(".sharecontent").css('display','block'); // here you can also use show();
}
});
我也尝试用window.width替换screen.width,但仍然没有成功:(
解决方法
使用
media queries.你的CSS代码将是：
@media screen and (max-width: 1024px) {
.yourClass {
display: none !important;
}
}
