Javascript $(窗口)。调整事件大小无法100%顺利进行
我在一个页面(#home)上运行以下代码,该页面应该平滑地插入一个滑块,或者如果页面容器低于480px,则保持页面原样 我无法使调整大小事件100%顺利运行 如果我缩小窗口,脚本(js.slide.js)将不会被触发,但内容将加载到(slide.php)中。如果我继续减少一点额外的窗口,一切都会好的 谁能告诉我如何才能使这项工作顺利进行。代码如下Javascript $(窗口)。调整事件大小无法100%顺利进行,javascript,jquery,Javascript,Jquery,我在一个页面(#home)上运行以下代码,该页面应该平滑地插入一个滑块,或者如果页面容器低于480px,则保持页面原样 我无法使调整大小事件100%顺利运行 如果我缩小窗口,脚本(js.slide.js)将不会被触发,但内容将加载到(slide.php)中。如果我继续减少一点额外的窗口,一切都会好的 谁能告诉我如何才能使这项工作顺利进行。代码如下 $(document).ready(function(){ if ($("#home").length > 0 ){ var homeSl
$(document).ready(function(){
if ($("#home").length > 0 ){
var homeSlideShow = {
$promoArea: $('#promo-area'),
$currentContent: $('#promo-area').contents(),
$pageContainer: $('.page'),
init: function(){
var hSS = homeSlideShow;
if (hSS.$pageContainer.width() > 480 ){
hSS.setTheSlideShow();
} else{
hSS.$promoArea.html(hSS.$currentContent);
}
},
setTheSlideShow: function(){
var hSS = homeSlideShow;
$.getScript(myscript_wp_vars.temp_dir + '/js/slide.js', function(){
hSS.$promoArea.load(myscript_wp_vars.temp_dir + '/libs/slide.php #c4u-slide',
function(){
var options = {
preloader: false,
nextButton: true,
prevButton: true,
animateStartingFrameIn: true,
transitionThreshold: 250
};
var sequence = $("#sequence").sequence(options).data("sequence"),
$slideShow = $("#c4u-slide");
});
});
}
};
//
// Check page size
//
if (homeSlideShow.$pageContainer.width() > 480 ){
homeSlideShow.setTheSlideShow();
}
//
// On window resize
//
$(window).resize(function() {
homeSlideShow.init();
});
}// END home.length
});//End $(document).ready(function()
提前感谢您的帮助或建议
干杯
Noelwindow.resize事件会被触发多次,具体取决于浏览器的行为。我建议你试试这个:
var timeoutResize;
$(window).resize(function(){
if(typeof timeoutResize != 'undefined') clearTimeout(timeoutResize);
timeoutResize = setTimeout(function(){homeSlideShow.init();},50);
});
Ben Alman提供了一个很好的jquery扩展,用于限制和消除活动:干杯,我稍微增加了超时时间,但效果很好@nxtwrld感谢您为节流和去抖动事件提供的指导,非常有用的信息,特别是在调整窗口大小方面。干杯