jquery - 功能工作窗口调整大小

Question

这是我的代码

var bodyWidth = ($(document).width()/2);
console.log(bodyWidth);
$('.freeshipping').css('right',bodyWidth);

它很好，但我想要这个函数体调整大小和页面刷新。如何？

Answer 1

$(window).resize(function(){
    var bodyWidth = ($(document).width()/2);
    console.log(bodyWidth);
    $('.freeshipping').css('right',bodyWidth);
});

更新：调用函数一次：

$(window).resize((function(){
   var bodyWidth = ($(document).width()/2);
   console.log(bodyWidth);
   $('.freeshipping').css('right',bodyWidth);

   return arguments.callee;
})());​

Answer 2

$(window).on('resize', function() {
   var bodyWidth = ($(document).width()/2);
   console.log(bodyWidth);
   $('.freeshipping').css('right',bodyWidth);
});

如果您还需要执行一次（没有显式调整大小操作）链接该trigger()方法

$(window).on('resize', function() {
   var bodyWidth = ($(document).width()/2);
   console.log(bodyWidth);
   $('.freeshipping').css('right',bodyWidth);
}).trigger('resize');

由于您的目标是 DOM 元素$('.freeshipping')，因此请务必将此代码段包装在 domready 事件中

Answer 3

尝试这个

 $(window).resize(function() {
     var bodyWidth = ($(document).width()/2);
    console.log(bodyWidth);
    $('.freeshipping').css('right',bodyWidth);
    });

更多信息：http ://api.jquery.com/resize/

Answer 4

好的，所以每个人都回答了很好的问题，但是！这是另一个示例：

    //store temporarily the existing method
    var resize = $.fn.resize;

    //overwrite $(window).resize with your method
    $(window).resize(function () {

        //here you do your stuff
        stuff.setWidth(param);

        //call the original
        resize;
    });

不同之处在于您已经有一个$(window).resize(function () { /* ... */ });不想松散的方法，只是为了扩展。我在编写自己的 jQuery 插件时遇到了这个问题。我不得不考虑用户/开发人员添加的现有 $(window).resize() 方法。因此，通过这种方式，我可以保留它并运行更新我自己的插件所需的方法/功能。