合并3种功能的jQuery

这些功能完美的作品，但我可以肯定有比这更聪明的办法：合并3种功能的jQuery

$(window).scroll(function(){ 
    $('#header').css({ 
    'left': $(this).scrollLeft() + (($(window).width() - $("#header").width())/2) 
    }); 
}); 

$(window).resize(function(){ 
    $('#header').css({ 
    'left': $(this).scrollLeft() + (($(window).width() - $("#header").width())/2) 
    }); 
}); 

$(function(){ 
    $('#header').css({ 
    'left': $(this).scrollLeft() + (($(window).width() - $("#header").width())/2) 
    }); 
});

来源

2013-07-18 Bruno

你可以给一个名称的功能：

$(window).on('scroll resize', something).trigger('resize'); 

function something(){ 
    $('#header').css({ 
    'left': $(this).scrollLeft() + (($(window).width() - $("#header").width())/2) 
    }); 
}

来源

2013-07-18 21:06:42

我不明白你在哪里，包括它被称为'$（function（）{}）;'...... – Ian

@Ian这是真的，我忘了包装所有在DOM准备处理程序中，但由于OP接受了这个答案，我想代码是在页面的底部。他在原始代码中准备好的DOM可能只是在加载时触发事件。 '.trigger（）'也一样。 –

工程就像一个魅力。谢谢卡尔安德烈！ – Julesfrog

包住它在一个函数并调用它的3个名额。

$(window).scroll(function() { 
    alignHeader() 
}); 

$(window).resize(function() { 
    alignHeader() 
}); 

$(function() { 
    alignHeader(); 
}); 

function alignHeader() { 
    $('#header').css({ 
     'left': $(this).scrollLeft() + (($(window).width() - $("#header").width())/2) 
    }); 
}

您也可以尝试这个方法

$(window).on('resize scroll', alignHeader) 

$(function() { 
    alignHeader(); 
}); 

function alignHeader() { 
    $('#header').css({ 
     'left': $(this).scrollLeft() + (($(window).width() - $("#header").width())/2) 
    }); 
}

来源

2013-07-18 21:03:34

这就是快，感谢ü！ – Bruno

@布鲁诺..不客气:) –

合并3种功能的jQuery

回答

相关问题