- 让网页靓起来 常见网页特效使用方法
- Javascript网页特效：闪现的礼花背景
- 链接中的JS 特效功能代码大放送
- [图文] 特效：在网页中显示可拖动的月历
- 特效：CSS+Javascript实现表格背景变色
- [图文] CSS 制作的三级菜单特效代码
- 特效：一个可以用来做招牌字的特效
- 特效：亥客帝国的经典效果
- 特效：显示可移动的层并可关闭
- 特效：页面内容在设定时间后消失
- 网页特效：一个在页面上蠕动的怪圈
- 网页特效：制作有立体感的表格
- 网页特效：滚动条的彩色显示
- 特效：类似于marquee文字向左运动
- [组图] 网页特效：一段实用的图片滚动显示代码
- 网页特效实例：用js获取单选按钮的数据
- [组图] Javascript特效：随机显示图片的源代码
- 网页特效：CSS + JS 构建的图片查看器
- [组图] FrontPage基础教程 特效按钮的制作
- [组图] 精彩新思路：Frontpage XP玩特效
<!-- 要实现此效果需要 1 个步骤： -->
<!-- 第 1 步： -->
<!-- 把下面的代码加到<BODY></BODY>区域中： -->
<SCRIPT LANGUAGE="JavaScript1.2">
<!--
var intervals=2000
var sparksOn = true;
var speed = 40;
var power = 3;
//Dont change these values-------
var documentWidth=documentHeight=randomx=randomy=leftcorner=topcorner=0
var ns=(document.layers);
var ie=(document.all);
var ns6=(document.getElementById&&!document.all);
var sparksAflyin = false;
var allDivs = new Array(10);
var totalSparks = 0;
//-------------------------------
function initAll(){
if(!ns && !ie &&!ns6){
sparksOn = false;
return;
}
setInterval("firework()",intervals)
if (ns)
document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE);
for(dNum=0; dNum<7; ++dNum){
if(ie)
allDivs[dNum]=eval('document.all.sDiv'+dNum+'.style');
else if (ns6)
allDivs[dNum]=document.getElementById('sDiv'+dNum).style;
else
allDivs[dNum]=eval('document.layers["sDiv'+dNum+'"]');
}
}
function firework(){
//below code detects the browser dimenions
if (ie){
documentWidth=document.body.clientWidth
documentHeight=document.body.clientHeight
leftcorner=document.body.scrollLeft
topcorner=document.body.scrollTop
}
else if (ns||ns6){
documentWidth=window.innerWidth
documentHeight=window.innerHeight
leftcorner=pageXOffset
topcorner=pageYOffset
}
//below code randomly generates a set of coordinates that fall within the dimension
randomx=leftcorner+Math.floor(Math.random()*documentWidth)
randomy=topcorner+Math.floor(Math.random()*documentHeight)
if(sparksOn){
if(!sparksAflyin){
sparksAflyin=true;
totalSparks=0;
for(var spark=0;spark<=6;spark++){
dx=Math.round(Math.random()*50);
dy=Math.round(Math.random()*50);
moveTo(spark,randomx,randomy,dx,dy);
}
}
}
}
function moveTo(i,tempx,tempy,dx,dy){
if(ie){
if(tempy+80>(document.body.offsetHeight+document.body.scrollTop))
tempy=document.body.offsetHeight+document.body.scrollTop-80;
if(tempx+80>(document.body.offsetWidth+document.body.scrollLeft))
tempx=document.body.offsetWidth+document.body.scrollLeft-80;
}
else if(ns6){
if(tempy+80>(window.innerHeight+pageYOffset))
tempy=window.innerHeight+pageYOffset-80;
if(tempx+80>(window.innerWidth+pageXOffset))
tempx=window.innerWidth+pageXOffset-80;
}
if(tempx>-50&&tempy>-50){
tempx+=dx;tempy+=dy;
allDivs[i].left=tempx;
allDivs[i].top=tempy;
dx-=power;dy-=power;
setTimeout("moveTo("+i+","+tempx+","+tempy+","+dx+","+dy+")",speed)
}
else
++totalSparks
if(totalSparks==7){
sparksAflyin=false;
totalSparks=0;
}
}
window.onload=initAll
//End-->
</script>
<style>
#sDiv0 {position:absolute; height:1; width:1; font-family:arial black; font-size:15px; color:Aqua; z-index:9;}
#sDiv1 {position:absolute; height:1; width:1; font-family:arial black; font-size:15px; color:red; z-index:10;}
#sDiv2 {position:absolute; height:1; width:1; font-family:arial black; font-size:15px; color:blue; z-index:11;}
#sDiv3 {position:absolute; height:1; width:1; font-family:arial black; font-size:15px; color:orange; z-index:12;}
#sDiv4 {position:absolute; height:1; width:1; font-family:arial black; font-size:15px; color:yellow; z-index:13;}
#sDiv5 {position:absolute; height:1; width:1; font-family:arial black; font-size:15px; color:lightgreen; z-index:14;}
#sDiv6 {position:absolute; height:1; width:1; font-family:arial black; font-size:15px; color:silver; z-index:15;}
</style>
<div id="sDiv0">*</div>
<div id="sDiv1">*</div>
<div id="sDiv2">*</div>
<div id="sDiv3">*</div>
<div id="sDiv4">*</div>
<div id="sDiv5">*</div>
<div id="sDiv6">*</div>
[编辑：百家电脑学院] [返回学院首页] [返回上一页] []
·上一篇：特效：亥客帝国的经典效果 · 下一篇：特效：一个可以用来做招牌字的特效