Question

当浏览器窗口最大化或使用jquery调整大小超过1600px时，如何隐藏HTML div？

我目前已将其设置为当页面在加载时大于1600px时隐藏div但在页面加载后窗口最大化或调整大小时无法隐藏它。以下是我使用的代码：

if ($(window).width() > 1600) {
      $('#next').hide();
  $('#back').hide();
}

非常感谢任何帮助。

$(window).bind('resize', function(){

if ($(window).width() > 1600) {
      $('#next').fadeOut();
} else {
  $('#next').fadeIn();
}
});

Answer 1

试试此代码

$(window).bind('resize', function(){

 if ($(window).width() > 1600) {
       $('#next').hide();
   $('#back').hide();
  }

});



$('.work').click(function(){ 
   if ($(window).width() < 1600){
     $('#next').fadeIn('slow'); 
   }
});

Answer 2

试试这个，它对我来说非常适合：

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

if ($(window).width() < 700) {
	$(".div").hide();
};

$(window).on("resize", function() {
	if ($(window).width() < 700) {
		$(".div").hide();
	}
	else {
		$(".div").show();
	}
});

＆＃13;

Answer 3

如果浏览器窗口最大化，要执行某些代码，您可以使用：

var a = screen.width;
var b = $(window).width();
var c = b + 17; // add the width of the scrollbar
if (navigator.appVersion.indexOf("Win")!=-1) {
  var d = c + 4; // add width of border on Windows
}
if (navigator.appVersion.indexOf("Mac")!=-1) {
  var d = c + 2; // add width of border on Mac
}
if (navigator.appVersion.indexOf("Linux")!=-1) {
  var d = c + 6; // add width of border on Linux
}

if (a == d) {
// code to run if width of browser window matches width of user's screen
} else {
// code to run otherwise
}

你可能想要使用一个回调函数来使代码在div被隐藏一次之后运行。

编辑：我将滚动条的宽度添加到$(window).width()变量，然后我输入了操作系统识别系统，将操作系统的特定浏览器边框添加到变量中。如有必要，您也可以为滚动条执行此操作。

操作系统标识符的来源：http://www.javascripter.net/faq/operatin.htm

隐藏窗口上的Div最大化＆amp;调整大小＆gt; 1600px - JQuery

3 个答案: