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 相关文章推荐
innerhtml用法 innertext用法 以及innerHTML与innertext的区别
Oct 26 Javascript
js 无提示关闭浏览器页面的代码
Mar 09 Javascript
jQuery 的全选(全非选)即取得被选中的值使用介绍
Nov 12 Javascript
在JS中如何调用JSP中的变量
Jan 22 Javascript
jQuery oLoader实现的加载图片和页面效果
Mar 14 Javascript
jquery计算鼠标和指定元素之间距离的方法
Jun 26 Javascript
浅谈js函数中的实例对象、类对象、局部变量(局部函数)
Nov 20 Javascript
常用的 JS 排序算法 整理版
Apr 05 Javascript
AngularJS与BootStrap模仿百度分页的示例代码
May 23 Javascript
浅谈针对Vue相同路由不同参数的刷新问题
Sep 29 Javascript
详解Puppeteer前端自动化测试实践
Feb 21 Javascript
微信小程序基于movable-view实现滑动删除效果
Jan 08 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
Discuz 模板引擎的封装类代码
2008/07/18 PHP
php使用codebase生成随机数
2014/03/25 PHP
浅谈php错误提示及查错方法
2015/07/14 PHP
PHP实现转盘抽奖算法分享
2020/04/15 PHP
如何在PHP中使用数组
2020/06/09 PHP
如何将一个String和多个String值进行比较思路分析
2013/04/22 Javascript
Javascript基础教程之函数对象和属性
2015/01/18 Javascript
JQuery简单实现锚点链接的平滑滚动
2015/05/03 Javascript
JavaScript的History API使搜索引擎抓取AJAX内容
2015/12/07 Javascript
常见的javascript跨域通信方法
2015/12/31 Javascript
JS中用childNodes获取子元素换行会产生一个子元素
2016/12/08 Javascript
Vue.js 2.0和Cordova开发webApp环境搭建方法
2018/02/26 Javascript
Vue中对iframe实现keep alive无刷新的方法
2019/07/23 Javascript
d3.js实现图形缩放平移
2019/12/19 Javascript
微信小程序用canvas画图并分享
2020/03/09 Javascript
react实现复选框全选和反选组件效果
2020/08/25 Javascript
Python 执行字符串表达式函数(eval exec execfile)
2014/08/11 Python
python实用代码片段收集贴
2015/06/03 Python
Python文件和流(实例讲解)
2017/09/12 Python
PyTorch CNN实战之MNIST手写数字识别示例
2018/05/29 Python
对python Tkinter Text的用法详解
2018/10/11 Python
python-opencv颜色提取分割方法
2018/12/08 Python
Python3按一定数据位数格式处理bin文件的方法
2019/01/24 Python
python3.8与pyinstaller冲突问题的快速解决方法
2020/01/16 Python
django models里数据表插入数据id自增操作
2020/07/15 Python
Python 利用OpenCV给照片换底色的示例代码
2020/08/03 Python
西班牙Polo衫品牌:Polo Club
2020/08/09 全球购物
体育纪念品、亲笔签名的体育收藏品:Steiner Sports
2020/07/31 全球购物
使用索引有什么好处
2016/07/27 面试题
extern是什么意思
2016/03/10 面试题
JAVA程序员面试题
2012/10/03 面试题
入党申请书自我鉴定
2013/10/12 职场文书
给酒店员工的表扬信
2014/01/11 职场文书
2014年党务公开方案
2014/05/08 职场文书
祝福语集锦:给妹妹结婚的祝福语
2019/12/18 职场文书
CSS3 制作的悬停缩放特效
2021/04/13 HTML / CSS