根据窗口宽度添加header类
根据窗口宽度添加header类
提问于 2017-05-09 18:32:55
我想切换断点是窗口宽度小于1000px.But的标题类，当我将大小调整为小时，它工作得很好，但反之亦然。
以下是html的示例：
<header class="header-1">
........
</header>这里的标头类可以是header-1，header-2 ......等
下面是js代码：
jQuery(window).on('load resize', function(){
var width = jQuery(window).width();
var header = jQuery(document).find('header');
var headerClass = header.attr('class');
if(width < 1000){
if( headerClass !== 'header-6' ){
header.removeClass(headerClass);
header.addClass('header-xs');
}else{
header.removeClass('header-xs').addClass(headerClass);
}
}
});回答 2
Stack Overflow用户
发布于 2017-05-09 18:39:41
因为当你的大小恢复时你没有恢复状态。在else条件下恢复状态：
jQuery(window).on('load resize', function(){
var width = jQuery(window).width();
var header = jQuery(document).find('header');
var headerClass = header.attr('class');
if(width < 1000){
if( headerClass !== 'header-6' ){
header.removeClass(headerClass);
header.addClass('header-xs');
}else{
header.removeClass('header-xs').addClass(headerClass);
}
}else{
// you have to restore the previous state here
}
});Stack Overflow用户
发布于 2017-05-09 18:45:26
尝试使用"container“div。
此div中的元素将根据分辨率自动调整大小。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/43867443
复制相关文章
相似问题
腾讯云开发者
