我在摆弄 Snap.svg。我不想听起来真的很笨,但是我没有在 API 文档中得到下一个示例;
var f = paper.filter(Snap.filter.blur(5, 10)),
c = paper.circle(10, 10, 10).attr({
filter: f
});
我正在文档中搜索纸质实例,甚至它所指的位置。我试图在悬停时获得模糊的路径。见下一个例子;
var paper = Snap.select("#icon-parent"),
icon = Snap.select("#x-mark-icon"),
f = paper.filter(Snap.filter.blur(5, 10));
icon.hover(function(event) {
this.animate({
transform : "t110,150",
filter: f
}, 200, mina.easeout);
}, function(event) {
this.animate({
transform : "t0,0"
}, 200, mina.easeout);
});
这是 Iconmonstr 图标;
<svg id="icon-parent" xml:space="preserve" enable-background="new 0 0 512 512" viewBox="0 0 512 512" height="40px" width="40px" y="0px" x="0px" xmlns="http://www.w3.org/2000/svg" version="1.1">
<path d="M256,50C142.229,50,50,142.229,50,256s92.229,206,206,206s206-92.229,206-206S369.771,50,256,50z M334.124,378.545l-77.122-77.117l-77.123,77.127l-41.425-41.449l77.106-77.117l-77.115-77.11l41.448-41.424l77.103,77.092 l77.09-77.102l41.459,41.432l-77.104,77.108l77.113,77.102L334.124,378.545z" id="x-mark-icon"/>
</svg>