当屏幕尺寸高于或低于某个点时,是否可以运行脚本,但仅限于该特定点?我有一个需要两个参数的函数,如果屏幕尺寸低于 769 像素,我希望更改这两个参数。所以我使用了经典的:
$( window ).resize(function() {
if ($(window).width() < 769) {
foobar(foo1, bar1);
}
else {
foobar(foo2, bar2);
}
});
这可以工作,但是每次调整窗口大小时都会运行 foobar 。问题是,如果您将浏览器大小从例如 500 像素调整到 600 像素,我不希望执行该函数,因为这意味着如果您在智能手机上从纵向转到横向,它就会执行,我只希望它在它出现的那一刻执行低于或高于 768 像素。有任何想法吗?
最佳答案
您可以在全局变量中跟踪先前的宽度,然后检查新的和先前的宽度何时位于 768 的任一侧,这样您就知道您已经跨越了边界:
var prevWidth = null;
$(function(){
prevWidth = $(window).width();
console.log(prevWidth);
})
$(window).resize(function() {
var newWidth = $(window).width();
if(prevWidth <= 768 && newWidth > 768) {
foobar(foo1, bar1);
}
else if (prevWidth > 768 && newWidth <= 768) {
foobar(foo2, bar2);
}
prevWidth = newWidth;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
关于javascript - 当屏幕尺寸低于 X 像素时 jQuery 运行脚本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26991116/