js下雪特效（HTML下雪代码）

本文目录

• HTML下雪代码
• 给视频添加特效，老电影效果、下雪特效等
• javascript 怎么让一个小div沿着正弦曲线运动，做下雪特效用
• 如何用html或者js制作天降很多的滑稽还有代码雨的特效
• 图片添加动态效果 就是给图片添加下雪的动态效果 保存为GIF动画

HTML下雪代码

《html》
《head》

《/head》
《BODY bgcolor=“#000000“》
《SCRIPT language=JavaScript1.2》
var snowsrc=“images/xuehua1.gif“
var no = 10;
var ns4up = (document.layers) ? 1 : 0; // browser sniffer
var ie4up = (document.all) ? 1 : 0;
var dx, xp, yp; // coordinate and position variables
var am, stx, sty; // amplitude and step variables
var i, doc_width = 800, doc_height =600;
if (ns4up) {
doc_width = self.innerWidth;
doc_height = self.innerHeight;
} else if (ie4up) {
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}

dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();
for (i = 0; i 《 no; ++ i) {
dx[i] = 0; // set coordinate variables
xp[i] = Math.random()*(doc_width-50); // set position variables
yp[i] = Math.random()*doc_height;
am[i] = Math.random()*20; // set amplitude variables
stx[i] = 0.02 + Math.random()/10; // set step variables
sty[i] = 0.7 + Math.random(); // set step variables
if (ns4up) { // set layers
if (i == 0) {
document.write(“《layer name=\“dot“+ i +“\“ left=\“50\“ top=\“50\“ visibility=\“show\“》《img src=’“+snowsrc+“’ border=\“0\“》《/a》《/layer》“);
} else {
document.write(“《layer name=\“dot“+ i +“\“ left=\“50\“ top=\“50\“ visibility=\“show\“》《img src=’“+snowsrc+“’ border=\“0\“》《/layer》“);
}
} else if (ie4up) {
if (i == 0) {
document.write(“《div id=\“dot“+ i +“\“ style=\“POSITION: absolute; Z-INDEX: “+ i +“; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\“》《img src=’“+snowsrc+“’ border=\“0\“》《/a》《/div》“);
} else {
document.write(“《div id=\“dot“+ i +“\“ style=\“POSITION: absolute; Z-INDEX: “+ i +“; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\“》《img src=’“+snowsrc+“’ border=\“0\“》《/div》“);
}
}
}
function snowNS() { // Netscape main animation function
for (i = 0; i 《 no; ++ i) { // iterate for every dot
yp[i] += sty[i];
if (yp[i] 》 doc_height-50) {
xp[i] = Math.random()*(doc_width-am[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
doc_width = self.innerWidth;
doc_height = self.innerHeight;
}
dx[i] += stx[i];
document.layers[“dot“+i].top = yp[i];
document.layers[“dot“+i].left = xp[i] + am[i]*Math.sin(dx[i]);
}
setTimeout(“snowNS()“, 10);
}

function snowIE() { // IE main animation function
for (i = 0; i 《 no; ++ i) { // iterate for every dot
yp[i] += sty[i];
if (yp[i] 》 doc_height-50) {
xp[i] = Math.random()*(doc_width-am[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}
dx[i] += stx[i];
document.all[“dot“+i].style.pixelTop = yp[i];
document.all[“dot“+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]);
}
setTimeout(“snowIE()“, 10);
}

if (ns4up) {
snowNS();
} else if (ie4up) {
snowIE();
}
《/SCRIPT》

《/body》

《/html》

记得给我加分啊
var snowsrc=“images/xuehua1.gif“这句是你雪花图片的地址

给视频添加特效，老电影效果、下雪特效等

1、打开视频㡱，在软件开始界面中，选择“宽屏幕（16:9）”界面。

2、接着就会进入到界面，点击“导入”从电脑中选择一个需要的视频文件，选好后“打开”

3、视频添加进来后，用鼠标右键单击视频，然后选择“添加剪辑”，这样视频就会添加到时间线中的影片轨里了。

4、接着就可以在“效果”面板中多种效果中，双击效果右边的预览窗口中就会显示该效果的动画。

5、接着添加效果之前，需要先放大时间线，这样的话方便后面对效果的时长进行调整。接着就拖动一下进度条，把进度条拖动到你想要加效果的视频画面的位置上，然后选择一个效果，并右键点击它选择“应用”，最后效果已经添加到了效果轨中，可以按住效果然后拖动长度，是设置效果的显示时长，长度越长，效果显示时间越长；相反，长度越短，效果显示时间越短。

javascript 怎么让一个小div沿着正弦曲线运动，做下雪特效用

《div id=“x“ style=“width:5px; height:5px; background-color:red; position:absolute;“》《/div》

《script type=“text/javascript“》
(function() {
var l = 0;
var d = 50;
var lmax = 1000;
var tmax = 200;
var o = document.getElementById(’x’);
setInterval(function() {
++l;
l %= lmax;
x.style.left = l + ’px’;
x.style.top = Math.floor(tmax + tmax * Math.sin(l / d)) + ’px’;
}, 20);
})();
《/script》

如何用html或者js制作天降很多的滑稽还有代码雨的特效

《style》
* {
margin:0;
padding:0;
}
body {
background:black;
overflow:hidden;
}
.container {
width:20px;
height:60px;
position:absolute;
}
.nav {
height:20px;
width:20px;
display:block;
margin-top:12px;
border-radius:10px;
background:#33ccff;
opacity:0.8;

background: url(1.jpg) no-repeat center;
background-size: auto 100%;
}
《/style》
《script》
$(function() {
var w = window.screen.width;
var h = window.screen.height;
var count = 0;
var drop = function() {
this.v = Math.random() * 1 + 0.5;
this.left = Math.random() * w;
}
drop.prototype = {
constructor: drop,
create: function() {
count++;
var $drop = $(’《div class=“container“》《span class=“nav“》《/span》《/div》’);
$drop.appendTo(’body’);
},
addCss: function() {
$(’.container:last’).css({
left: this.left + ’px’
})
},
dropEvent: function() {
var time = Math.floor(h / this.v);//下降速度
$(’.container:last’).animate({
top: h + ’px’,
opacity: ’1’
}, time)
}
}
function updata() {
if(count 》 200) {
for(var i = 0; i 《 100; i++) {
$(’div:first’).remove();
}
count = 0;
}
}
setInterval(function() {
var Drop = new drop();
Drop.create();
Drop.addCss();
Drop.dropEvent();
updata();
}, 50)
})
《/script》

图片添加动态效果 就是给图片添加下雪的动态效果 保存为GIF动画

运行照片下雪软件，在软件运行后会显示一个界面，直接点击“关闭”界面就可以了。然后会来到下图软件主界面，在项目面板里的空白处点击鼠标右键，在右键菜单里选择“导入”--“文件”，从电脑窗口里选择要添加下雪效果的照片/图片进来，点击“打开”。

然后雪景照片素材已经添加进来了，按住该照片然后往时间线面板里拖拽，项目面板里就会自动生成一个雪景的合成，这个就不用管了，这是软件自动生成的。

接着在软件菜单栏里找到“效果”并选择“模拟仿真”效果中的“CC 下雪”效果。添加了下雪之后的效果已经很不错了。

不过，还能继续调整下雪的一些参数，在特效控制台面板中如图所示：数量、速度、幅度、频率、雪片大小、来源最深和透明度这七种参数设置，简单说就是想要什么雪就下什么雪，可以从小雪下到暴雪，懒得调整参数也没关系，不调整就不用改变。

好啦，自己已经调整好了下雪的效果，那现在就可以把这个下雪的图片保存成GIF动态图哦，可以随意分享到网站中，点击菜单栏上的“图像合成”中点击“添加到渲染队列”。然后软件底部的渲染队列中就会要渲染输出的文件信息，点击输出组件，弹出来的设置界面中在格式里选择“GIF动画”，点“确定”。

格式选好以后，就点击输出到在弹出来的窗口中输入文件名还有设置该图片要保存的路径，点“保存”。最后就可以点击“渲染”按钮，渲染输出GIF图片啦！