jQuery窗口调整大小前置答案

【问题标题】：jQuery window resize prependjQuery窗口调整大小前置
【发布时间】：2013-01-25 00:19:06
【问题描述】：

在调整窗口大小时遇到问题。我要做的是检查窗口是否小于 600 像素，然后在正文前添加一个 div (.inner)。在调整大小时，我想检查窗口宽度，如果它大于 600 像素，请将 div（内部）放回原位。

HTML

<body>
  <div class="outer">
     <div class="inner">
     </div>
  </div>

var windowWidth = $(window).width();

checkWidth();

function checkWidth(){
    if(windowWidth > 600){
    $('.outer').append($('.inner'));
    console.log('back in place');
  } else {
    $('body').prepend($('.inner'));
        console.log('prepend');
  }
}
$(window).resize(function() {
  checkWidth();
}).trigger('resize');

【问题讨论】：

您在没有关闭字符串的情况下编写了 $('body)，这实际上是在您的代码上还是只是这里的错字？
你有没有机会使用 CSS media-queries 来帮助解决这个问题？

标签： jquery

【解决方案1】：

您需要检索函数内部的宽度。否则它将始终包含调整大小之前的值。

$(checkWidth);
$(window).resize(checkWidth).trigger('resize');

function checkWidth()
{
    var window_width = $(window).width();

    if(window_width > 600)
    {
        $('.outer').append($('.inner'));
        console.log('back in place');
    } 
    else 
    {
        $('body').prepend($('.inner'));
        console.log('prepend');
    }
}

【讨论】：