2

我正在使用Adipoli jQuery 图像悬停效果，但在更改某些属性时遇到问题。图像更改为灰度和鼠标悬停它会更改为颜色，但是我设置了当我单击图像时它应该保持彩色，但它已损坏，因为它不是替换图像而是在顶部添加图像并在其上添加另一个图像（但它是未定义的所以它没有显示）。以下是我正在使用的代码，但您可以从www.filedropper.com/adipoli-test下载完整示例

<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 专家可以帮助我。

4

1 回答 1

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'
    });
}
于 2013-06-02T18:07:29.460 回答