首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >带有Pixastic的灰度切换按钮

带有Pixastic的灰度切换按钮
EN

Stack Overflow用户
提问于 2013-05-29 01:00:34
回答 1查看 249关注 0票数 0

我有一个脚本,必须处理图像和(其中)能够转换为灰度,并再次回到非灰度。

我正在使用Pixastic来做这件事,到目前为止,它在我的概念证明(http://www.gportdev.nl/klanten/dgsw/hbhg/)中工作得很好。

不过,我想要的是让灰度按钮在灰度和非灰度之间切换,但我不确定如何实现这一点。我是否应该克隆画布元素并在两个元素上都应用Pixastic,或者是否有更好的解决方案?

谢谢!

EN

回答 1

Stack Overflow用户

发布于 2014-02-07 00:14:11

我有类似的东西..。当我徘徊的时候,我正在模糊我的形象。我想对你来说,这应该和我的概念是一样的。而不是悬停,你将会有点击事件。

我现在正在做的是,如果我在图片下方的.productText上悬停……我也想让图像变得模糊。

代码语言:javascript
复制
$(document).ready(function () { 
                   blurEvent();   
            }); 

function blurEvent() {
    $('.imageUrl').load(function () {
        $('.imageUrl').each(function () {
            this.onmouseover = function () {
                var canvas1 = Pixastic.process(this, "blurfast", { amount: 2 });
                    canvas1.onmouseout = function () {
                        Pixastic.revert(this);
                    }
                }
            });
        });
    }

HTML:

代码语言:javascript
复制
<!--MY HTML-->
<div class="col1 w1 modelCount-@Model.Count() @name model-@counter">

@{if (product.Type == "Product")
    {
        <div class="xlFont whiteFont productImage productImageH">
            <img class="imageUrl" src="@product.ImageUrl" />
        </div>
        <div class="productText productTextH">
            <div class="mFont padding10 padBotNone">@product.Name</div>
            <div class="sFont padding10 padTopNone">@product.FromText</div>
            <button class="margL10 displayNone">MoreInfo</button>
        </div>
     }
 }
票数 -1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/16797576

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档