Question

我为hide编写了一个代码，并在屏幕分辨率为860px的情况下编写了文字。但是，如果我犯了错误，它就不起作用了吗？

的示例

感谢您的帮助！

＆＃13;

var width = $(window).width(), height = $(window).height();
if ((width >= 1024)) {
$('#px').show()
} else {
$('#px').hide()
}

＆＃13;

p {display: inline;}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div class="container"><p id="px">www.</p>mywebsite.com</div>

＆＃13;

Answer 1

CSS

您只需使用纯CSS即可完成此操作，无需任何JavaScript或页面加载。这种方式比使用JavaScript

更好，更受支持

@media (max-width: 860px) {
  #px {
    display: none;
  }
}

<div id="px">Text to be hidden under 860px</div>

JavaScript / jQuery

如果您确实需要在JavaScript / jQuery中完成，那么您的代码会少量出现。

$(document).ready(function() {
  var width = $(window).outerWidth();
  if (width <= '860') {
    $('#px').hide();
  } else {
    $('#px').show();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="px">Text to be hidden under 860px</div>

Answer 2

您不需要javaScript，只能使用css：

@media screen and (max-width: 1024px){
#px{display: none}
}

@media screen and (min-width: 1024px){
#px{display: block}
}

隐藏屏幕宽度860px下的文字

2 个答案:

CSS

JavaScript / jQuery