网页上漂浮的花瓣

[ 发布者:在远方┊来源:本站整理┊时间:2006-08-19┊浏览:

人次 ]

该特效用到的图片:

网页特效观止|JsCode.CN|---网页上漂浮的花瓣

var no = 6; // snow number

var speed = 12; // smaller number moves the snow faster

var snowflake = "http://www.jscode.cn/Uploadfile/2006819224938886.GIF";

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 = 400, doc_height = 500;

if (ns4up) {

doc_width = self.innerWidth;

doc_height = self.innerHeight;

} else if (ie4up) {

doc_width = 500;

doc_height = 500;

}

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("

document.write("top=\"15\" visibility=\"show\">

document.write(snowflake + "\" border=\"0\">

");

} else {

document.write("

document.write("top=\"15\" visibility=\"show\">

document.write(snowflake + "\" border=\"0\">

");

}

} else if (ie4up) {

if (i == 0) {

document.write("

document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");

document.write("visible; TOP: 15px; LEFT: 15px;\">

document.write(snowflake + "\" border=\"0\">

");

} else {

document.write("

document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");

document.write("visible; TOP: 15px; LEFT: 15px;\">

document.write(snowflake + "\" border=\"0\">

");

}

}

}

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()", speed);

}

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()", speed);

}

if (ns4up) {

snowNS();

} else if (ie4up) {

snowIE();

}

本类相关信息

推荐另一种色带制作方法

怎么样?还行吧? 现在介绍怎么调用它们的很多了,不过命令不是很完整,我把...

页面马赛克显示效果

页面左右分开

html花瓣特效代码,网页上漂浮的花瓣相关推荐

  1. html桃花特效,页面上桃花飘飘 - 网页特效代码|网页特效观止 - 让你的网页靓起来!...

    页面上桃花飘飘 [ 发布者:luwei┊来源:本站整理┊时间:2005-10-23┊浏览: 人次 ] 网页特效|Linkweb.cn/Js|---页面上桃花飘飘 var plumsrc="i ...

  2. html图片跟随鼠标,跟随鼠标的图片 - 网页特效代码|网页特效观止 - 让你的网页靓起来!...

    跟随鼠标的图片 [ 发布者:在远方┊来源:本站整理┊时间:2006-03-08┊浏览: 人次 ] 网页特效|JsCode.cn|---跟随鼠标的图片 var newtop=0 var newleft= ...

  3. jquery返回顶部特效代码 网页滚动返回顶部特效

    网页悬浮返回顶部图标可以说是一项非常常见切比较实用的功能,可以使用HTML来实现,但是返回顶部效果太过僵硬,体验不好,这里分享一个纯js返回顶部切具有过渡效果的实例. 效果如上图所示. 具体代码如下: ...

  4. html flash音乐播放器代码,网页上播放mp3或flash等播放器代码

    复制代码代码如下: style="cursor:hand"> style="cursor:hand"> 附一: 控制播放器控件 media play ...

  5. HTML特效代码大全(史上最全)

    1.贴图:<img src="图片地址"> 2.加入连接:<a href="所要连接的相关地址">写上你想写的字</a> 3 ...

  6. HTML5七夕情人节表白网页(烂漫的空中散落的花瓣3D相册) HTML+CSS+JS 求婚 html生日快乐祝福代码网页 520情人节告白代码 程序员表白源码 3D旋转相册 js烟花代码

    HTML5七夕情人节表白网页❤烂漫的空中散落的花瓣3D相册❤ HTML+CSS+JS 求婚 html生日快乐祝福代码网页 520情人节告白代码 程序员表白源码 3D旋转相册 js烟花代码 css爱心表 ...

  7. HTML5七夕情人节表白网页(情人节满屏爱心HTML5特效) HTML+CSS+JS 求婚 html生日快乐祝福代码网页 520情人节告白代码 程序员表白源码 抖音3D旋转相册 js烟花代码

    HTML5七夕情人节表白网页❤情人节满屏爱心HTML5特效❤ HTML+CSS+JS 求婚 html生日快乐祝福代码网页 520情人节告白代码 程序员表白源码 抖音3D旋转相册 js烟花代码 css爱 ...

  8. 一键下载75款常用的jquery特效前端网页代码

    最近"杜圃"对IT的web前端开发特别感兴趣,于是就在搜索网页特效代码,发现jquery这个框架非常好使,于是就迷上了jquery特效,不断的收集jquery的一些简单的网页常用的 ...

  9. 网页特效php代码,html网页特效代码有哪些

    html网页特效代码有:1.字体加粗[xx]:2.字体斜体[xx]:3.字体控制大小[ xx ]:4.换帖子背景[]:5.贴图[ 本教程操作环境:windows7系统.html5版,DELL G3电脑 ...

  10. html网页蒲公英特效代码,代码实现网页左下角添加蒲公英飘动特效

    网页左下角有一个蒲公英飘动特效,相信很多站长都见过,为此,橘子君也做了一番研究,实现蒲公英飘动特效还是比较简单.只需在网页中加入以下代码即可实现.如果是想全站展示,建议将特效代码添加到footer文件 ...

最新文章

  1. ORACLE导入Excel数据
  2. 解决ubuntu开机进入grub界面的问题
  3. 关于在Webservice里使用LinqToSQL遇到一对多关系的父子表中子表需要ToList输出泛型而产生循环引用错误的解决办法!(转)...
  4. 我的Go语言学习之旅六:做一个WIN的简单弹窗
  5. SAP UI5 初学者教程之五:视图控制器初探 试读版
  6. Python爬虫自学之第(零)篇——爬虫思路和request模块使用
  7. 软件设计师考c语言,软件设计师教程考点精讲之C语言三大定律
  8. 【信号与系统|吴大正】2:连续系统的时域分析
  9. 大数据+人工智能:实践AI深度学习的十大惊艳案例
  10. App Store 上架审核指北【翻译】
  11. asp excel导入mysql_asp excel导入数据库
  12. 51单片机 外部中断
  13. 如何制作APP-微信小程序
  14. C语言:输入字符并将它们输出
  15. 很抱歉,OneDrive服务器出现问题,请稍后重试。(错误代码:0x8004def5)
  16. 【解决】Menu XXX/XXX/XXX can‘t be checked because doesn‘t exist
  17. 关于img标签的相对路径和绝对路径以及a标签的一些属性问题
  18. FLTK学习-2-新手入门参考
  19. 韩国NF 数字功放芯片 - NTP8808性能概述
  20. 洛蒙德湖风景mac动态壁纸

热门文章

  1. Spyder单步调试
  2. 关于el-dialog中@close事件和取消确认按钮并用,会触发两次关闭表单的操作(!表单为子组件时)
  3. JAVA集成腾讯云即时通讯IM服务端
  4. 淮北农村生活污水处理设备——十四五生态环境保护规划
  5. 速轩三维 - 手持式激光三维扫描仪
  6. 怎么用Excel公式计算百分比?教你三种计算方法
  7. 微信直播王者荣耀设置教程(微信教程)
  8. C++语法(五)数据类型
  9. Rust_lings
  10. IT大败局----第七章 企业并购的陷阱