如何使用jquery給圖像賦予熔岩燈效果

我在div元素中使用了批量圖像，所以我需要給那些我無法獲得的圖像提供一些不錯的熔岩燈效果，並遵循下面的一些示例：如何使用jquery給圖像賦予熔岩燈效果

http://nixbox.com/projects/jquery-lavalamp/demos

誰能幫助我嗎？

這裏是我的代碼：

$('#showfilelist').append("<div id=" + file.id + "><a href='uploads/" + document.getElementById("currentDirectory").value + "/" + file.name + "' target='_blank' rel='gallery'><img src='uploads/" + document.getElementById("currentDirectory").value + "/" + file.name + "'width='50' height='50' class='images'/></a></div>");

這是我的熔岩效果CSS代碼：

.images 
     { 
     border: 1px solid #33CC33; 
     background-color:#CCFFCC; 
     z-index:1; 
     -webkit-border-radius: 3px; 
     -moz-border-radius: 3px; 
     border-radius: 3px; 
     box-shadow: 2px 2px 3px #000; 
     -webkit-box-shadow: 2px 2px 3px #000; 
     -moz-box-shadow: 2px 2px 3px #000; 
     }

這是腳本：

$('images').lavaLamp({ 
      target: 'img', 
      autoResize: true 
     });

來源

2011-10-19 coder

爲什麼你在使用JQuery的時候使用這個長手語法document.getElementById（「currentDirectory」）.value'？ – Tules

即獲取存儲的會話值。 – coder

會話值？會話由服務器而不是客戶端管理。我認爲你的意思是你有一些自定義數據隱藏在ID爲「currentDirectory」的元素中，你仍然可以使用'$（'＃currentDirectory'）。val（）' – Tules

也許它僅僅是你錯過了JQuery類選擇器的一個小點？

$('.images').lavaLamp({ 
     target: 'img', 
     autoResize: true 
    });

這裏的工作版本

http://jsfiddle.net/Bpnca/84/

的問題是，你想申請的LavaLamp的效果樣式應用到所有的元素時，它應該被分配到.backLava類

來源

2011-10-19 13:22:04 Tules

哦，謝謝你糾正這個錯誤，我仍然無法做到這一點後，我只是得到每個圖像的綠色背景。 – coder

你可以發佈一個鏈接到你的網頁？ – Tules

這是你可以看到我得到的鏈接http://jsfiddle.net/Bpnca/15/ – coder

回答

相關問題