將樣式作爲參數傳遞給jquery動畫

Question

所以我有一個函數用於處理懸停的元素，但是我希望能夠將css樣式作爲參數傳遞。我曾嘗試不同的變化，但是這是目前我的代碼（只是必要部分）...

function load_hovers(mouseOverCss){ 
    $('.hover').hover(function(){ 
    $(this).animate({ 
     eval(mouseOverCss) 
    }, 500, function() { 
    }); 

和我打電話load_hovers("backgroundColor: 'red'");

這將返回一個錯誤invalid object initializer $(this).animate({。沒有使用eval，錯誤是missing : after property id {eval(mouseOverCss)}\n。

有什麼建議嗎？

Answer 1

了它。

var mouseOverCss = {}; 
mouseOverCss['backgroundColor'] = 'red'; 
mouseOverCss['paddingLeft'] = '100px'; 
load_hovers(mouseOverCss); 

，然後就

$(this).animate(mouseOverCss, duration); 

感謝菲爾你爲我的不只是發送一個字符串格式化前的動畫（）的道路上！

Answer 2

你可能最好遠離Eval選項（Eval是邪惡的，所有這些......），並嘗試將對象傳遞給你的方法。

首先創建一個對象，你的CSS的說法：

var css = {}; 
css.Property = 'backgroundColor'; 
css.Value = 'Red'; 

然後你就可以通過這個（或其中的一個數組，如果你需要多個屬性），以你的方法：

function load_hovers(classes) 
{ 
    $('.hover').hover(function(){ 
     $(this).animate({ 
     $(this).css(classes.Property, classes.Value); // or iterate over an array of these 
     }, 500, function() { 
     }); 
    }); 
}