使用jquery移动对象，具体取决于调整大小和/或加载

Question

我在网站标题后面放置了一个导航栏。

如果用户将窗口大小调整为小于768px，我想在打开的body标签之后移动此对象，但如果它们使浏览器宽度超过此数量，则将其返回到原始位置。

如果页面加载取决于浏览器宽度，导航栏正在加载到正确的位置，但我真的希望这也适用于调整大小。

有什么建议吗？

到目前为止，我的代码非常基本......

jQuery(document).ready(function ($) {
    var width = window.innerWidth || document.documentElement.clientWidth;
    if (width < 768) {
        $('#customMenu').prependTo('body');
    }
}); // END:jQuery(document).ready(function(){

Answer 1

我不确定我是否理解，但如果你想在resize事件上触发功能，你可以使用：

$(window).on('resize', function() {
    var winWidth = $(window).width();
    if (winWidth < 768) {
        $('#customMenu').prependTo('body');
    } else {
        $('#customMenu').prependTo('#somewhereElse');
    }
});