2012-05-17 73 views
1

這是我的代碼功能的工作窗口調整

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

它是好的,但我想這個工作函數體調整大小和頁面清爽。怎麼樣?

回答

1
$(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中的事件來包裝這個片段

+0

謝謝,當我刷新頁面時也需要工作這個功能, – ShibinRagh

0

試試這個

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

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

+0

謝謝,還需要工作這個功能當我刷新頁面 – ShibinRagh

+0

使用F. Calderan代碼來觸發事件 – Venu

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

UPDATE:來電功能一次:

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

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

謝謝,還需要工作這個功能當我刷新頁面, – ShibinRagh

+0

@ShibinRagh看到我的更新。 – Engineer

+0

我會喜歡這一個,這是一個interresting,並有它背後的大腦! =)好的解決方案@Engineer! =)我喜歡這些自我調用的匿名函數,儘管當它們很多時,很難保持它們,但思想很好! =) – benqus

0

好了,大家都已經回答了這個問題這是很好的,但是! 這裏是另一個例子:

//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()方法。所以這樣我保留它並運行我需要更新自己的插件的方法/函數。

+0

謝謝,還需要工作這個功能,當我我正在刷新頁面,清楚嗎? – ShibinRagh

+0

刷新頁面時,會丟失(現有)數據。如果您喜歡,可以將其存儲在cookie中,如果瀏覽器支持,則可以將其存儲在localStorage(HTML5解決方案,鍵>值數組)中。或者將其存儲在服務器端的數據庫中(如果有),並在頁面加載時查詢它。 – benqus