这个小提琴: http://jsfiddle.net/remibreton/Aurk8/
当窗口调整大小时会发生事件,但是我想要发生的是,如果窗口已经处于所述大小,那么它应该运行代码,此时,窗口会侦听调整大小的触发器,但如果以调整大小的宽度刷新页面,则无效。
实际上,如果屏幕尺寸低于992像素宽,我想将列表转换为选择菜单,我想我可以通过检查窗口大小来做到这一点...如果它是992像素,那么添加一个类。然后该类运行将列表转换为项目的魔法......例如:
jQuery(document).ready(function()
{
jQuery(window).on('resize', function(event){
var windowSize = jQuery(window).width();
if(windowSize < 992){
jQuery( "ul#intro-tabs" ).addClass( "tabs-select" );
} else {
jQuery( "ul#intro-tabs" ).removeClass( "tabs-select" );
}
});
// Turn a list in to an select menu
jQuery('ul.tabs-select').each(function(){
var list=jQuery(this),
select=jQuery(document.createElement('select')).insertBefore(jQuery(this)
.hide()).change(function(){
window.location.href=jQuery(this).val();
});
jQuery('>li a', this).each(function(){
var option=jQuery(document.createElement('option'))
.appendTo(select)
.val(this.href)
.html(jQuery(this).html());
if(jQuery(this).attr('class') === 'selected'){
option.attr('selected','selected');
}
});
list.remove();
});
});