单击元素时如何恢复pixastic中的图像？答案

【问题标题】：How to revert an image in pixastic when an element is clicked?单击元素时如何恢复pixastic中的图像？
【发布时间】：2012-06-04 01:20:16
【问题描述】：

我刚刚尝试了以下代码来模糊图像，效果很好。但是我想在单击元素时恢复原状，我该怎么做？

$(window).bind("load",function() {

         $(".testclass").pixastic("blurfast", {amount:0.9});
    $(".clickclass").click(function(e){
        // this statement should revert the image
                });
    }
);

【问题讨论】：

标签： jquery pixastic

【解决方案1】：

我没用过，试试看：

$(".clickclass").click(function(e){
      $(this).pixastic("blurfast", {amount:0}); //This should remove the blur
});

编辑：黑暗中的另一个刺：

$(".clickclass").click(function(e){
      Pixastic.revert(this);
 })

【讨论】：

我也试过那个编辑过的，还是不行。找到一种替代方法来模糊图像而不是使用 pixastic 插件会很棒

【解决方案2】：

adding [0] made a big difference. Definitely did the trick for me. Give it a try

Pixastic.revert($(this).find('.imageUrl')[0]);

Another thing is i had to create a VAR as pixastic creates a duplicate canvas

This is my whole function

$(function () {

        $('.col1.w1').mouseenter(function () {


            var origImg = ($(this).find('.imageUrl'));
            if (origImg.is('img')) {
                Pixastic.process(origImg[0], 'blurfast', { amount: 2 });
            }


        });
        $('.col1.w1').mouseout(function () {
            var origImg = ($(this).find('.imageUrl'));
            Pixastic.revert($(this).find('.imageUrl')[0]);


        });
    });

【讨论】：