如何用flash制作水滴

发布网友发布时间：2022-04-26 14:03

共2个回答

懂视网时间：2022-05-12 16:52

给大家带来用H5制作H5制作水滴特效教程，怎么用H5制作特效？H5制作水滴特效的流程，H5制作水滴特效的注意事项有哪些，一起来看一下。

<!DOCTYPE html>
<html >
<head>
 <meta charset="UTF-8">
 
 <title>利用canvas 画布制作逼真的水滴特效</title>
<meta name="keywords" content="利用canvas 画布制作逼真的水滴特效" />
<meta name="description" content="利用canvas 画布制作逼真的水滴特效" />
 
 
 <style>
 /* NOTE: The styles were added inline because Prefixfree needs access to your styles and they must be inlined if they are on local disk! */
 body {
  background-color: black;
}
canvas {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-filter: blur( 10px ) contrast( 10 );
  -moz-filter: blur( 10px ) contrast( 10 );
  filter: blur( 10px ) contrast( 10 );
}
 </style>
 
 
</head>
 
<body>
 <canvas id=c></canvas>
 
 <script src="js/index.js"></script>
 
</body>
</html>
Css部分：
body {
  background-color: black;
}
canvas {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-filter: blur( 10px ) contrast( 10 );
  -moz-filter: blur( 10px ) contrast( 10 );
  filter: blur( 10px ) contrast( 10 );
}

相信看了这些案例你已经掌握了方法，更多精彩请关注Gxl网其它相关文章！

相关阅读：

用H5制作烟花粒子特效的制作方法

html与xhtml的区别详解

网页的效果图与DIV+CSS关系

热心网友时间：2022-05-12 14:00

1.水滴用钢笔工具画，用部分选取工具转换形状。按Ctrl+shift+F9,打开颜色面板，选择径向渐变，点击长方形颜色条，单击色标，然后在颜色区域点击，可更改色标颜色。按F，选择渐变变形工具,调整颜色，直到合适位置。

2.将轮廓删除，先按Ctrl+B打散对象。

方法1，用选择工具，轮廓线全部选中，按delete,删掉。

方法2，是把整个图全部选中，再把填充色点掉，接着删掉轮廓线就可以了。

2-1.按ctrl+3显示全部，然后点击属性面板，改变画板高度，为800px。如图。按ctrl+-缩小到合适画面。

3.选中第1帧，然后选中水滴，按F8键，转换为元件，选图形，点击确定。

4.打开时间轴面板，第1帧让水滴在上面

5.在第10帧，F6插入关键帧，按住shift垂直移动到下面

6.在第10帧，选择椭圆工具，画1个水波，选中这个物体，设置成如图颜色#3BC8F7。

选中这个物体，按F8键，转换为元件。在第10帧将水波和水滴的位置移好。按ctrl+k垂直对齐。

在第11帧，按F7插入1个空白帧，然后将前1帧的水波剪切到11帧。黏贴的时候按ctrl+shift+v原位置黏贴。如图。在第10帧画上水波，就是为了确定水波的位置。

7.在11帧按Q快捷键，用任意变形工具将水波变小1点,按住shift,只有水波没有水滴。效果如图。

8.在19帧按F6键，创建关键帧，将水波拉大.

8-1.在1到10帧点任意1帧点右键，创建传统补间动画。在11帧到19帧点任意1帧点右键，创建传统补间动画。

设置属性-->FPS:12

9.最后1帧选中，设置属性，属性-->色彩效果-->样式：alpha,alpha：0,拖到最左边.

10.在1到10帧设置点任意1帧，在属性里设置缓动：-100

11.ctrl+shift+alt+s另存为水滴效果.gif（动画）就可以了。

12.做好了。