js实现飞入星星特效代码


Posted in Javascript onOctober 17, 2014

本文实例讲述了js实现飞入星星特效代码,分享给大家供大家参考。

具体实现代码如下:

<html>

<head>

<title>星空极速飞入效果</title>

<style type="text/css">

<!--

body {

background-color: #000066;

}

-->

</style>

</head>

<body>

<script language="JavaScript">

xL=8;

xH=xW=xR=xE=xMY=xMX=xWd=xHd=0;

xF=new Array();

xY=new Array();

xX=new Array();

xS=new Array();

xA=new Array();

xB=new Array();

ini=new Array();

document.write('<div id="sdiv" style="position:absolute;top:0px;left:0px"><div style="position:relative">');

for (i=0; i < xL; i++){

 document.write('<div id="div" style="position:absolute;top:0;left:0;width:5px;height:5px;'+'font-size:10px;color:#ffffff">.</div>');

}

document.write('</div></div>');

function Set(){

 for (i=0; i < xL; i++){

  transfer(i)

  xF[i]=xW/14;

 }

}

function Assign(){

 sdiv.style.top=document.body.scrollTop;

 for (i=0; i < xL; i++){

  xF[i]-=xS[i]*25;

  if (xF[i] < 4) xF[i]=3;

  div[i].style.top =xY[i];

  div[i].style.left=xX[i];

  div[i].style.fontSize=xF[i];

 }

}

function fly(){

 xMY=window.document.body.clientHeight/2;

 xMX=window.document.body.clientWidth/2;

 xWd=Math.round(Math.random()*40+5);

 xHd=Math.round(Math.random()*30+5);

 for (i=0; i < xL; i++){

  xY[i]=xA[i]+=(xMY-xA[i])*(xS[i]);

  xX[i]=xB[i]+=(xMX-xB[i])*(xS[i]);

  if ((xX[i] > xMX-xWd) && (xX[i] < xMX+xWd) && (xY[i] > xMY-xHd) && (xY[i] < xMY+xHd)){

   transfer(i)

  }

  if ((xX[i]<0)||(xX[i]>xW)||(xY[i]<0)||(xY[i]>xH)){

    xF[i]=xW/14;

  }

 }

 Assign();

 setTimeout('fly()',1);

}

function transfer(i){

 xH=window.document.body.offsetHeight;

 xW=window.document.body.offsetWidth;

 xA[i]=Math.round(Math.random()*xH);

 xB[i]=Math.round(Math.random()*xW);

 xS[i]=Math.random()*0.05+0.05;

 xR=Math.round(Math.random()*3);

 xE=Math.round(Math.random()*50+50);

 if (xR == 3) xB[i]=-xE;

 if (xR == 2) xB[i]=xW+xE;

 if (xR == 1) xA[i]=-xE;

 if (xR == 0) xA[i]=xH;

}

Set();

fly();

</script>

</body>

</html></td>

   </tr>

 </table>

希望本文所述对大家的javascript程序设计有所帮助

Javascript 相关文章推荐
百度 popup.js 完美修正版非常的不错 脚本之家推荐
Apr 17 Javascript
js防止表单重复提交实现代码
Sep 05 Javascript
js去空格技巧分别去字符串前后、左右空格
Oct 21 Javascript
深入理解JavaScript系列(31):设计模式之代理模式详解
Mar 03 Javascript
JS实现的新浪微博大厅文字内容滚动效果代码
Nov 05 Javascript
利用Angularjs实现幻灯片效果
Sep 07 Javascript
JavaScript基于Dom操作实现查找、修改HTML元素的内容及属性的方法
Jan 20 Javascript
Vue.js常用指令的使用小结
Jun 23 Javascript
基于AngularJS的拖拽文件上传的实例代码
Jul 15 Javascript
JavaScript数据结构之栈实例用法
Jan 18 Javascript
深入学习Vue nextTick的用法及原理
Oct 08 Javascript
js 压缩图片的示例(只缩小体积,不更改图片尺寸)
Oct 21 Javascript
JavaScript sub方法入门实例(把字符串显示为下标)
Oct 17 #Javascript
JavaScript strike方法入门实例(给字符串加上删除线)
Oct 17 #Javascript
JavaScript link方法入门实例(给字符串加上超链接)
Oct 17 #Javascript
JavaScript italics方法入门实例(把字符串显示为斜体)
Oct 17 #Javascript
JavaScript fontsize方法入门实例(按照指定的尺寸来显示字符串)
Oct 17 #Javascript
JavaScript fontcolor方法入门实例(按照指定的颜色来显示字符串)
Oct 17 #Javascript
JavaScript bold方法入门实例(把指定文字显示为粗体)
Oct 17 #Javascript
You might like
php不写闭合标签的好处
2014/03/04 PHP
PHP根据传入参数合并多个JS和CSS文件的简单实现
2014/06/13 PHP
PHP PDOStatement对象bindpram()、bindvalue()和bindcolumn之间的区别
2014/11/20 PHP
PHP使用星号隐藏用户名,手机和邮箱的实现方法
2016/09/22 PHP
laravel框架中路由设置,路由参数和路由命名实例分析
2019/11/23 PHP
javascript 原型模式实现OOP的再研究
2009/04/09 Javascript
javascript 类定义的4种方法
2009/09/12 Javascript
javascript iframe编程相关代码
2009/12/28 Javascript
JS检测图片大小的实例
2013/08/21 Javascript
Javascript中的String对象详谈
2014/03/03 Javascript
JS弹出可拖拽可关闭的div层完整实例
2015/02/13 Javascript
js实现图片放大和拖拽特效代码分享
2015/09/05 Javascript
如何提高javascript加载速度
2016/12/26 Javascript
jQuery实现用户输入自动完成功能
2017/02/13 Javascript
JS鼠标滚动分页效果示例
2017/07/05 Javascript
vue-cli开发环境实现跨域请求的方法
2018/04/07 Javascript
微信小程序自定义头部导航栏(组件化)
2019/11/15 Javascript
[27:08]完美世界DOTA2联赛PWL S2 SZ vs Rebirth 第二场 11.21
2020/11/23 DOTA
Python实现的简单hangman游戏实例
2015/06/28 Python
解决Python出现_warn_unsafe_extraction问题的方法
2016/03/24 Python
Flask-WTF表单的使用方法
2019/07/12 Python
TensorFLow 数学运算的示例代码
2020/04/21 Python
浅谈Python爬虫原理与数据抓取
2020/07/21 Python
英国女装网上商店:I Saw It First
2018/10/18 全球购物
eharmony澳大利亚:网上约会服务
2020/02/29 全球购物
什么造成了Java里面的异常
2016/04/24 面试题
深圳-东方伟业笔试部分
2015/02/11 面试题
大学生职业生涯规划书模板
2014/01/03 职场文书
商场促销活动方案
2014/02/08 职场文书
广播节目策划方案
2014/05/23 职场文书
清明节主题班会
2015/08/14 职场文书
基督教追悼会答谢词
2015/09/29 职场文书
高中议论文(范文2篇)
2019/08/19 职场文书
500字作文之关于爸爸
2019/11/14 职场文书
mysql如何配置白名单访问
2021/06/30 MySQL
Python实现日志实时监测的示例详解
2022/04/06 Python