程序问答   发布时间:2022-06-02  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了在除桌面之外的所有断点中运行 jquery大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。

如何解决在除桌面之外的所有断点中运行 jquery?

开发过程中遇到在除桌面之外的所有断点中运行 jquery的问题如何解决?下面主要结合日常开发的经验,给出你关于在除桌面之外的所有断点中运行 jquery的解决方法建议,希望对你解决在除桌面之外的所有断点中运行 jquery有所启发或帮助;

我只有最少的代码知识,我正在努力实现一些目标。我只希望它适用于较小的设备——基本上小于桌面大小。这是我的代码

$('.menu-button').click(function() {
  var clicks = $(this).data('clicks');
  if (clicks) {
     $("body").CSS("overflow","auto");
  } else {
     $("body").CSS("overflow","hIDden");
  }
  $(this).data("clicks",!clicks);
});

 $('.nav-BACkground,.nav__link,.priMary-button').click(function() {
  $( ".menu-button" ).click();

});

解决方法

有一千种方法可以做到这一点,因为你似乎没有使用任何给你“断点”的 css 框架,而“小于桌面”是非常不精确的,我将向你展示一种使用 css 和 javascript 的方法

你的 html 中只有一个带有特定 id 的空元素,例如

<div id="resolution_check"></div>

在您的 css 中,您定义了一个媒体查询和断点,并在宽度较小时将此元素设置为不显示。例如

@media only screen and (max-width: 760pX) {
  #resolution_check { display: none; }
}

在您的 javascript 中,您现在可以检查此元素是否设置为不显示,如果是,则用户分辨率小于 761 像素

var small_screen = $('#resolution_check').css('display')=='none';

下面将遵循您的代码,您可以在其中检查上面的 var,例如:

$('.menu-button').click(function() {
   if(!small_screen){ // if NOT small screen return
     return false; 
   }
 ...

此外,在调整大小事件时,您需要再次设置 small_screen,因为宽度发生了变化

大佬总结

以上是大佬教程为你收集整理的在除桌面之外的所有断点中运行 jquery全部内容,希望文章能够帮你解决在除桌面之外的所有断点中运行 jquery所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。