2012-05-11 170 views
2

我正在使用Adipoli jQuery Image Hover Effects,但我在更改某些屬性時遇到問題。圖像更改爲灰度,onmouseover更改爲顏色,但隨後我設置了單擊圖像時它應保持着色,但它已損壞,因爲它不是替換圖像,而是將圖像添加到頂部並將其添加到另一圖像(但未定義它沒有顯示)。下面是我使用的代碼,但你可以從www.filedropper.com/adipoli-testAdipoli jQuery圖像懸停效果

<script type="text/javascript"> 
$(document).ready(function() { 
    $('#image1').adipoli({ 
     'startEffect' : 'grayscale', 
     'hoverEffect' : 'popout' 
    }); 
}); 

function select(n){  
    $('#image1').adipoli({ 
     'startEffect' : 'normal', 
     'hoverEffect' : 'popout' 
    });       
} 
</script> 
<div style="width:650px; height: 400px; display:block; margin: 60px;"> 
<a href="javascript:void(0)" onclick="select(1)"><img src="image1.jpg" class="img1" id="image1"></a> 
</div> 

我真的想做到這一點,我希望一些jQuery的專家可以幫我下載完整的例子。

回答

0

我使新的jQuery功能「adipoliDestroy」,它從元素銷燬adipoli。現在,在元素上重新啓動adipoli之前,請再次調用destroy和init adipoli。

(function($){ 
    $.fn.adipoliDestroy = function(){ 
     var clone = this.clone().css('display', 'block'), 
       wrapper = null; 
     if (wrapper = this.parents('.adipoli-wrapper')){ 
      wrapper.replaceWith(clone); 
     } 
     return clone; 
    } 
})(jQuery); 

function select(n){ 
    $('#image1').adipoliDestroy().adipoli({ 
     'startEffect' : 'normal', 
     'hoverEffect' : 'popout' 
    }); 
}