HTML＋TIME学习笔记（十）

莺燕音画

第十课

上一节我们讲了HTML+TIME+CSS来做滤镜效果，但那个是静态的，这一节我们来学习下动态效果如何制作。

点这里看效果

代码如下：

<img id="image4" src=" http://roger01rao.ik8.com/htmlntime/jiaocheng/ffice:smarttags" />05a.jpg" style="position:absolute; left:20; top:150; filter:progidXImageTransform.Microsoft.glow(color='pink',strength='0',enabled='false');">fficeffice" />

<t:set id="glowset1" targetElement="image4" attributeName="filters.item('DXImageTransform.Microsoft.glow').enabled" to="true" begin="glow1.begin" end="glow1.end" />

<t:animate id="glow1" targetElement="image4" attributeName="filters.item('DXImageTransform.Microsoft.glow').strength" from="0" to="20" begin="1" dur="15" autoreverse="true" repeatcount="4" />

大家可以看到，上面的效果其实也就是以前讲过的属性的综合运动，这个效果就是图片动态运动发光。首先需要设置发光颜色和不能显示，然后再设置它可以显示，接着让发光强度从0到10增长，也就产生了动态效果，当然CSS静态滤镜还有很多，在上一节我已经一一列举了。在演示里我提供给大家运动发光效果，大家自己可以去尝试一下另外的效果看看，如果有哪个滤镜不会出效果，可以在回复帖子里留言，大家一起来学习。

一剑飘香红

老规矩,收了,谢谢

紫色灵枫

我来学习了

快乐相随

学习一下，这个动态移动速度好像有点慢

文子

虽然偶不懂，进来支持下

冰雪飞梦

好好学习,天天向上.

雨丝丝

学习学习哦~~