载入中
自定义HTML载入中... loading
2背景技巧 [转贴 2007-05-13 23:02:07]  删除... 
字体变小 字体变大
和讯博客背景设置技巧》 [原创 2006-09-16 08:38:25 ] 发表者: 我有话要说   
字体变小 字体变大

图形依次渐显代码 移动的图片

图形依次渐显代码

 

<script language=javaScript>
<!--//
sandra0 = new Image();
sandra0.src = "sto/02.gif";
sandra1 = new Image();
sandra1.src = "sto/03.gif";
sandra2 = new Image();
sandra2.src = "sto/04.gif";
var i_strngth=1
var i_image=0
var imageurl = new Array()
imageurl[0] ="sto/02.gif"
imageurl[1] ="sto/03.gif"
imageurl[2] ="sto/04.gif"
function showimage() {
if(document.all) {
if (i_strngth <=110) {
testimage.innerHTML="<img style='filter:alpha(opacity="+i_strngth+")' src="+imageurl[i_image]+" border=0>";
i_strngth=i_strngth+10
var timer=setTimeout("showimage()",100)
}
else {
clearTimeout(timer)
var timer=setTimeout("hideimage()",1000)
}
}
if(document.layers) {
clearTimeout(timer)
document.testimage.document.write("<img src="+imageurl[i_image]+" border=0>")
document.close()
i_image++
if (i_image >= imageurl.length) {i_image=0}
var timer=setTimeout("showimage()",2000)
}
}
function hideimage() {
if (i_strngth >=-10) {
testimage.innerHTML="<img style='filter:alpha(opacity="+i_strngth+")' src="+imageurl[i_image]+" border=0>";
i_strngth=i_strngth-10
var timer=setTimeout("hideimage()",100)
}
else {
clearTimeout(timer)
i_image++
if (i_image >= imageurl.length) {i_image=0}
i_strngth=1
var timer=setTimeout("showimage()",500)
}
}

 

 

 2    水中倒影

 

<IMG id=reflect src="图片地址"><BR>
<SCRIPT type="text/javascript" src=""></SCRIPT>
<SCRIPT language="JavaScript">
<!--
BaiduWriteAD("zouwenyedg","3");
//-->
</SCRIPT> <SCRIPT language=JavaScript1.2>
function f1(){
setInterval("mdiv.filters.wave.phase+=10",100);
}
if (document.all){
document.write('<img id=mdiv src="'+document.all.reflect.src+'" style="filter:wave(strength=3,freq=3,phase=0,lightstrength=30) blur() flipv()">')
window.onload=f1
}
</SCRIPT>

 

3     

图形依次渐显代码 移动的图片

图形依次渐显代码

 

<script language=javaScript>
<!--//
sandra0 = new Image();
sandra0.src = "sto/02.gif";
sandra1 = new Image();
sandra1.src = "sto/03.gif";
sandra2 = new Image();
sandra2.src = "sto/04.gif";
var i_strngth=1
var i_image=0
var imageurl = new Array()
imageurl[0] ="sto/02.gif"
imageurl[1] ="sto/03.gif"
imageurl[2] ="sto/04.gif"
function showimage() {
if(document.all) {
if (i_strngth <=110) {
testimage.innerHTML="<img style='filter:alpha(opacity="+i_strngth+")' src="+imageurl[i_image]+" border=0>";
i_strngth=i_strngth+10
var timer=setTimeout("showimage()",100)
}
else {
clearTimeout(timer)
var timer=setTimeout("hideimage()",1000)
}
}
if(document.layers) {
clearTimeout(timer)
document.testimage.document.write("<img src="+imageurl[i_image]+" border=0>")
document.close()
i_image++
if (i_image >= imageurl.length) {i_image=0}
var timer=setTimeout("showimage()",2000)
}
}
function hideimage() {
if (i_strngth >=-10) {
testimage.innerHTML="<img style='filter:alpha(opacity="+i_strngth+")' src="+imageurl[i_image]+" border=0>";
i_strngth=i_strngth-10
var timer=setTimeout("hideimage()",100)
}
else {
clearTimeout(timer)
i_image++
if (i_image >= imageurl.length) {i_image=0}
i_strngth=1
var timer=setTimeout("showimage()",500)
}
}

 

 

 2    水中倒影

 

<IMG id=reflect src="图片地址"><BR>
<SCRIPT type="text/javascript" src=""></SCRIPT>
<SCRIPT language="JavaScript">
<!--
BaiduWriteAD("zouwenyedg","3");
//-->
</SCRIPT> <SCRIPT language=JavaScript1.2>
function f1(){
setInterval("mdiv.filters.wave.phase+=10",100);
}
if (document.all){
document.write('<img id=mdiv src="'+document.all.reflect.src+'" style="filter:wave(strength=3,freq=3,phase=0,lightstrength=30) blur() flipv()">')
window.onload=f1
}
</SCRIPT>

 

3      IMG id=reflect src="http://www.webcom.cn/uploadfiles/200604/20060410092839421.jpg">
<!-- Inject Script Filtered --> <!-- Inject Script Filtered --> <!-- Inject Script Filtered --> 移动的图片

 

<div id="img" style="position:absolute;">
<img src="图片地址"
onClick="pause_resume();">
</div>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var xPos = 20;
var yPos = document.body.clientHeight;
var step = 1;
var delay = 30;
var height = 0;
var Hoffset = 0;
var Woffset = 0;
var yon = 0;
var xon = 0;
var pause = true;
var interval;
img.style.top = yPos;
function changePos() {
width = document.body.clientWidth;
height = document.body.clientHeight;
Hoffset = img.offsetHeight;
Woffset = img.offsetWidth;
img.style.left = xPos + document.body.scrollLeft;
img.style.top = yPos + document.body.scrollTop;
if (yon) {
yPos = yPos + step;
}
else {
yPos = yPos - step;
}
if (yPos < 0) {
yon = 1;
yPos = 0;
}
if (yPos >= (height - Hoffset)) {
yon = 0;
yPos = (height - Hoffset);
}
if (xon) {
xPos = xPos + step;
}
else {
xPos = xPos - step;
}
if (xPos < 0) {
xon = 1;
xPos = 0;
}
if (xPos >= (width - Woffset)) {
xon = 0;
xPos = (width - Woffset);
   }
}
function start() {
img.visibility = "visible";
interval = setInterval('changePos()', delay);
}
function pause_resume() {
if(pause) {
clearInterval(interval);
pause = false;
}
else {
interval = setInterval('changePos()',delay);
pause = true;
   }
}
start();
//  End -->
</script><SCRIPT type="text/javascript" src=""></SCRIPT>
<SCRIPT language="JavaScript">
<!--
BaiduWriteAD("zouwenyedg","3");
//-->
</SCRIPT

 

 

4          探照灯效果

 

<STYLE type=text/css>
<!--
TD {
 COLOR: #000000; FONT-FAMILY: "宋体"; FONT-SIZE: 9pt
;}
A:visited {
 COLOR: #000000; TEXT-DECORATION: none
;}
A:link {
 COLOR: #000000; TEXT-DECORATION: none
;}
A:hover {
 TEXT-DECORATION: none
;}
#spotlight {
 FILTER: light
}
-->
</STYLE>
<IMG  id="spotlight" src="image\flag.gif" speed="50"></P>
<SCRIPT language=JavaScript1.2>

if (document.all&&window.spotlight){
var x=new Array()
var direction=new Array()
var y=new Array()
if (spotlight.length==null){
spotlight[0]=document.all.spotlight
x[0]=0
direction[0]="right"
y[0]=spotlight[0].height
spotlight[0].filters.light.addPoint(100,50,100,255,255,255,90)
}
else
for (i=0;i<spotlight.length;i++){
x[i]=0
direction[i]="right"
y[i]=spotlight[i].height
spotlight[i].filters.light.addPoint(100,50,100,255,255,255,90)
}
}

function slidelight(cur){
spotlight[cur].filters.light.MoveLight(0,x[cur],y[cur],200,-1)

if (x[cur]<spotlight[cur].width+200&&direction[cur]=="right")
x[cur]+=10
else if (x[cur]>spotlight[cur].width+200){
direction[cur]="left"
x[cur]-=10
}
else if (x[cur]>-200&&x[cur]<-185){
direction[cur]="right"
x[cur]+=10
}
else{
x[cur]-=10
direction[cur]="left"
}
}

if (document.all&&window.spotlight){
if (spotlight.length==null)
setInterval("slidelight(0)",spotlight[0].speed)
else
for (t=0;t<spotlight.length;t++){
var temp='setInterval("slidelight('+t+')",'+spotlight[t].speed+')'
eval(temp)
}
}
</SCRIPT>
<SCRIPT type="text/javascript" src=""></SCRIPT>
<SCRIPT language="JavaScript">
<!--
BaiduWriteAD("zouwenyedg","3");
//-->
</SCRIPT>
</form>

 

 

 

 

 

 

<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p> </p>

 

 

 

5       图片渐渐出来

 

<!--用<body onLoad="fade()">替换原来的<Body>-->
<!--将以下代码加入HTML的<Body></Body>之间-->

<img src="图片地址"
name="u" border=0 alt="Image" style="filter:alpha(opacity=0)">
<script language="JavaScript">

var b = 1;
var c = true;

function fade(){
if(document.all);

if(c == true) {
b++;
}
if(b==100) {
b--;
c = false
}

if(b==10) {
b++;
c = true;
}

if(c == false) {
b--;
}
u.filters.alpha.opacity=0 + b;
setTimeout("fade()",50);
}
</script><SCRIPT type="text/javascript" src=""></SCRIPT>
<SCRIPT language="JavaScript">
<!--
BaiduWriteAD("zouwenyedg","3");
//-->
</SCRIPT>
</form>

 

6     图片随着鼠标大小

脚本说明:
把如下代码加入<body>区域中
<span id="s1" style = "width : 100">
<a href="index.shtml"
onmouseover="img1.style.width='95';"
onmouseout="img1.style.width= '67';">
<Img src="link1.gif" id="img1">
</a>
</span>

 

 

7     对鼠标过敏

 


<style>
.shakeimage{
position:relative
}
</style>

<img src=image\family.jpg class="shakeimage" onMouseover="init(this);rattleimage()" onMouseout="stoprattle(this)">
<script language="JavaScript1.2">
var rector=3
var stopit=0
var a=1

function init(which){
stopit=0
shake=which
shake.style.left=0
shake.style.top=0
}

function rattleimage(){
if ((!document.all&&!document.getElementById)||stopit==1)
return
if (a==1){
shake.style.top=parseInt(shake.style.top)+rector
}
else if (a==2){
shake.style.left=parseInt(shake.style.left)+rector
}
else if (a==3){
shake.style.top=parseInt(shake.style.top)-rector
}
else{
shake.style.left=parseInt(shake.style.left)-rector
}
if (a<4)
a++
else
a=1
setTimeout("rattleimage()",50)
}

function stoprattle(which){
stopit=1
which.style.left=0
which.style.top=0
}

</script><SCRIPT type="text/javascript" src="图片地址"></SCRIPT>
<SCRIPT language="JavaScript">
<!--
BaiduWriteAD("zouwenyedg","3");
//-->
</SCRIPT>

 

 

8   图片飘动效果

 

脚本说明:
第一步:把如下代码加入<head>区域中
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var isNS = ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) >= 4));
var _all = '';
var _style = '';
var wwidth, wheight;
var ydir = '++';
var xdir = '++';
var id1, id2, id3;
var x = 1;
var y = 1;
var x1, y1;
if(!isNS) {
_all='all.';
_style='.style';
}
function getwindowsize() {
clearTimeout(id1);
clearTimeout(id2);
clearTimeout(id3);
if (isNS) {
wwidth = window.innerWidth - 55;
wheight = window.innerHeight - 50;
} else {
wwidth = document.body.clientWidth - 55;
wheight = document.body.clientHeight - 50;
}
id3 = setTimeout('randomdir()', 20000);
animate();
}
function randomdir() {
if (Math.floor(Math.random()*2)) {
(Math.floor(Math.random()*2)) ? xdir='--': xdir='++';
} else {
(Math.floor(Math.random()*2)) ? ydir='--': ydir='++';
}
id2 = setTimeout('randomdir()', 20000);
}
function animate() {
eval('x'+xdir);
eval('y'+ydir);
if (isNS) {
pic1.moveTo((x+pageXOffset),(y+pageYOffset))
} else {
pic1.pixelLeft = x+document.body.scrollLeft;
pic1.pixelTop = y+document.body.scrollTop;
}
if (isNS) {
if (pic1.top <= 5+pageYOffset) ydir = '++';
if (pic1.top >= wheight+pageYOffset) ydir = '--';
if (pic1.left >= wwidth+pageXOffset) xdir = '--';
if (pic1.left <= 5+pageXOffset) xdir = '++';
} else {
if (pic1.pixelTop <= 5+document.body.scrollTop) ydir = '++';
if (pic1.pixelTop >= wheight+document.body.scrollTop) ydir = '--';
if (pic1.pixelLeft >= wwidth+document.body.scrollLeft) xdir = '--';
if (pic1.pixelLeft <= 5+document.body.scrollLeft) xdir = '++';
}
id1 = setTimeout('animate()', 30);
}
//  End -->
</script>

第二步:在<body>区中加入如下代码
<div id="pic1" style="position:absolute; visibility:visible; left:0px; top:0px; z-index:-1">
<img src="image1.gif" border="0">
</div>

<script language="javascript">
var pic1=eval('document.'+_all+'pic1'+_style);
</script>


第三步:把<body>区中内容改为:
<body bgcolor="#fef4d9" OnLoad="getwindowsize()" OnResize="getwindowsize()">

 

 

9     雪景效果代码

脚本说明:
把如下代码加入<body>区域中
<SCRIPT LANGUAGE="JavaScript1.2">
<!-- Begin
var no = 12; // number of hearts
var speed = 10; // smaller number moves the hearts faster
var heart = "5.gif";
var flag;
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();
amx = new Array();
amy = new Array();
stx = new Array();
sty = new Array();
flag = new Array();
for (i = 0; i < no; ++ i) {
dx[i] = 0;                        // set coordinate variables
xp[i] = Math.random()*(doc_width-30)+10;  // set position variables
yp[i] = Math.random()*doc_height;
amy[i] = 12+ Math.random()*20;         // set amplitude variables
amx[i] = 10+ Math.random()*40;
stx[i] = 0.02 + Math.random()/10; // set step variables
sty[i] = 0.7 + Math.random();     // set step variables
flag[i] = (Math.random()>0.5)?1:0;
if (ns4up) {                      // set layers
if (i == 0) {
document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");
document.write("top=\"15\" visibility=\"show\"><img src=\"");
document.write(heart+ "\" border=\"0\"></layer>");
} else {
document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");
document.write("top=\"15\" visibility=\"show\"><img src=\"");
document.write(heart+ "\" border=\"0\"></layer>");
}
} else
if (ie4up) {
if (i == 0) {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");
document.write(heart+ "\" border=\"0\"></div>");
} else {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");
document.write(heart+ "\" border=\"0\"></div>");
}
}
}

function snowNS() {  // Netscape main animation function
for (i = 0; i < no; ++ i) {  // iterate for every dot
if (yp[i] > doc_height-50) {
xp[i] = 10+ Math.random()*(doc_width-amx[i]-30);
yp[i] = 0;
flag[i]=(Math.random()<0.5)?1:0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
doc_width = self.innerWidth;
doc_height = self.innerHeight;
}
if (flag[i])
dx[i] += stx[i];
else
dx[i] -= stx[i];
if (Math.abs(dx[i]) > Math.PI) {
yp[i]+=Math.abs(amy[i]*dx[i]);
xp[i]+=amx[i]*dx[i];
dx[i]=0;
flag[i]=!flag[i];
}
document.layers["dot"+i].top = yp[i] + amy[i]*(Math.abs(Math.sin(dx[i])+dx[i]));
document.layers["dot"+i].left = xp[i] + amx[i]*dx[i];

}
setTimeout("snowNS()", speed);
}

function snowIE() {  // IE main animation function
for (i = 0; i < no; ++ i) {  // iterate for every dot
if (yp[i] > doc_height-50) {
xp[i] = 10+ Math.random()*(doc_width-amx[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
flag[i]=(Math.random()<0.5)?1:0;
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}
if (flag[i])
dx[i] += stx[i];
else
dx[i] -= stx[i];
if (Math.abs(dx[i]) > Math.PI) {
yp[i]+=Math.abs(amy[i]*dx[i]);
xp[i]+=amx[i]*dx[i];
dx[i]=0;
flag[i]=!flag[i];
}

document.all["dot"+i].style.pixelTop = yp[i] + amy[i]*(Math.abs(Math.sin(dx[i])+dx[i]));
document.all["dot"+i].style.pixelLeft = xp[i] + amx[i]*dx[i];
}
setTimeout("snowIE()", speed);
}

if (ns4up) {
snowNS();
} else if (ie4up) {
snowIE();
}
// End -->
</script>

 

10   图片循环播放

 

脚本说明:
第一步:把如下代码加入<body>区域中
<img src="image1.gif" name="u" border=0
alt="Image" style="filter:alpha(opacity=0)">
<script language="JavaScript">

var b = 1;
var c = true;

function fade(){
if(document.all);

if(c == true) {
b++;
}
if(b==100) {
b--;
c = false
}

if(b==10) {
b++;
c = true;
}

if(c == false) {
b--;
}
u.filters.alpha.opacity=0 + b;
setTimeout("fade()",50);
}
</script>


第二步:把<body>区域改为
<body bgcolor="#fef4d9" onLoad="fade()">

 

 

 

11            图片依次移动

 

<MARQUEE id=info onmouseover=info.stop()
                              onmouseout=info.start() scrollAmount=3
                              scrollDelay=8 class="textarea1"><a href="http://www.7stk.com/">
                              <IMG height=16
                              src="store/index/dog.gif" width=19>
                             
                             
                               <a target="_blank"   href="http://www.hao123.com">
                             <IMG height=30
                              src="store/link/logo_84_34.gif" width=90>
                             
                             
                             
                             
                               
                             <a target="_blank"   href="http://www.baidulink.com">
                             <IMG height=30
                              src="store/link/baidu88_31_1.gif" width=90>

                             

                             
                             
                               
                             <a target="_blank"   href="http://www.jiaoyudaohang.com">
                             <IMG height=30
                              src="store/link/jiaoyulogo.jpg" width=90>
                             
                             
                               <a target="_blank"   href="http://www.okeaa.com">
                             <IMG height=30
                              src="store/link/logo_88x31.gif" width=90>
                             


                             
                             
                             <a target="_blank"   href="http://www.50bang.com">
                             <IMG height=30
                              src="store/link/50banglogo.gif" width=90>
                             
                             
                                <a target="_blank"   href="http://www.518edu.cn/">
                             <IMG height=30
                              src="store/link/logo_study.gif" width=90>
                             
                             
                                <a target="_blank"   href="http://www.aqclub.com/">
                             <IMG height=30
                              src="store/link/aqclub.gif" width=90>
                             
                             
                               <a target="_blank"   href="http://home.icpcn.com">
                             <IMG height=30
                              src="store/link/icpcn.gif" width=90>
                             
                             
 <a target="_blank"   href="http://www.3322.org">
                             <IMG height=30
                              src="store/link/3322.gif" width=95>
                             
                             
 <a target="_blank"   href="http://www.anyp.cn/">
                             <IMG height=30
                              src="store/link/anyp.gif" width=95>
                             
     
   
   
   
   </marquee>

 

12          多张图片依次移动循环代码

 

<script language="javascript">
imgArr=new Array()
imgArr[0]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/001.jpg border=0></a>"
imgArr[1]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/002.jpg border=0></a>"
imgArr[2]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/003.jpg border=0></a>"
imgArr[3]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/004.jpg border=0></a>"
imgArr[4]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/005.jpg border=0></a>"
imgArr[5]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/006.jpg border=0></a>"
imgArr[6]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/007.jpg border=0></a>"
imgArr[7]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/008.jpg border=0></a>"
imgArr[8]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/009.jpg border=0></a>"
imgArr[9]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/0010.jpg border=0></a>"
imgArr[10]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/0011.jpg border=0></a>"
var moveStep=4        //步长,单位:pixel
var moveRelax=100    //移动时间间隔,单位:ms

ns4=(document.layers)?true:false

var displayImgAmount=4    //视区窗口可显示个数
var divWidth=150    //每块图片占位宽
var divHeight=200    //每块图片占位高

var startDnum=0
var nextDnum=startDnum+displayImgAmount
var timeID
var outHover=false

var startDivClipLeft
var nextDivClipRight

function initDivPlace(){
    if (ns4){
        for (i=0;i<displayImgAmount;i++){
            eval("document.divOuter.document.divAds"+i+".left="+divWidth*i)
        }
        for (i=displayImgAmount;i<imgArr.length;i++){
            eval("document.divOuter.document.divAds"+i+".left="+divWidth*displayImgAmount)
        }
    }else{
        for (i=0;i<displayImgAmount;i++){
            eval("document.all.divAds"+i+".style.left="+divWidth*i)
        }
        for (i=displayImgAmount;i<imgArr.length;i++){
            eval("document.all.divAds"+i+".style.left="+divWidth*displayImgAmount)
        }
    }
}

function mvStart(){
    timeID=setTimeout(moveLeftDiv,moveRelax)
}

function mvStop(){
    clearTimeout(timeID)
}

function moveLeftDiv(){
    if (ns4){
        for (i=0;i<=displayImgAmount;i++){
            eval("document.divOuter.document.divAds"+parseInt((startDnum+i)%imgArr.length)+".left=document.divOuter.document.divAds"+parseInt((startDnum+i)%imgArr.length)+".left-moveStep")
        }

        startDivClipLeft=parseInt(eval("document.divOuter.document.divAds"+startDnum+".clip.left"))
        nextDivClipRight=parseInt(eval("document.divOuter.document.divAds"+nextDnum+".clip.right"))

        if (startDivClipLeft+moveStep>divWidth){
            eval("document.divOuter.document.divAds"+nextDnum+".clip.right="+divWidth)
           
            eval("document.divOuter.document.divAds"+startDnum+".left="+divWidth*displayImgAmount)
            eval("document.divOuter.document.divAds"+parseInt((nextDnum+1)%imgArr.length)+".left=document.divOuter.document.divAds"+nextDnum+".left+"+divWidth)
            eval("document.divOuter.document.divAds"+parseInt((nextDnum+1)%imgArr.length)+".clip.left=0")
           
           
            startDnum=(++startDnum)%imgArr.length
            nextDnum=(startDnum+displayImgAmount)%imgArr.length
           
            startDivClipLeft=moveStep-(divWidth-startDivClipLeft)
            nextDivClipRight=moveStep-(divWidth-nextDivClipRight)
        }else{
            eval("document.divOuter.document.divAds"+nextDnum+".clip.left=0")
            startDivClipLeft+=moveStep
            nextDivClipRight+=moveStep
        }
        eval("document.divOuter.document.divAds"+startDnum+".clip.left="+startDivClipLeft)
        eval("document.divOuter.document.divAds"+nextDnum+".clip.right="+nextDivClipRight)
    }else{
        for (i=0;i<=displayImgAmount;i++){
            eval("document.all.divAds"+parseInt((startDnum+i)%imgArr.length)+".style.left=document.all.divAds"+parseInt((startDnum+i)%imgArr.length)+".style.pixelLeft-moveStep")
        }
   
        startDivClipLeft=parseInt(eval("document.all.divAds"+startDnum+".currentStyle.clipLeft"))
        nextDivClipRight=parseInt(eval("document.all.divAds"+nextDnum+".currentStyle.clipRight"))
   
        if (startDivClipLeft+moveStep>divWidth){
            eval("document.all.divAds"+nextDnum+".style.clip='rect(0,"+divWidth+","+divHeight+",0"+")'")
           
            eval("document.all.divAds"+startDnum+".style.left="+divWidth*displayImgAmount)
            eval("document.all.divAds"+parseInt((nextDnum+1)%imgArr.length)+".style.left=document.all.divAds"+nextDnum+".style.pixelLeft+"+divWidth)
           
            startDnum=(++startDnum)%imgArr.length
            nextDnum=(startDnum+displayImgAmount)%imgArr.length
           
            startDivClipLeft=moveStep-(divWidth-startDivClipLeft)
            nextDivClipRight=moveStep-(divWidth-nextDivClipRight)
        }else{
            startDivClipLeft+=moveStep
            nextDivClipRight+=moveStep
        }
        eval("document.all.divAds"+startDnum+".style.clip='rect(0,"+divWidth+","+divHeight+","+startDivClipLeft+")'")
        eval("document.all.divAds"+nextDnum+".style.clip='rect(0,"+nextDivClipRight+","+divHeight+",0)'")
    }

    if (outHover){
        mvStop()
    }else{
        mvStart()
    }
   
   
}

function writeDivs(){
    if (ns4){
        document.write("<ilayer name=divOuter width=750 height="+divHeight+">")
       
        for (i=0;i<imgArr.length;i++){
            document.write("<layer name=divAds"+i+">")
            document.write(imgArr[i]+" ")
            document.write("</layer>")
        }
        document.write("</ilayer>")
        document.close()
        for (i=displayImgAmount;i<imgArr.length;i++){
            eval("document.divOuter.document.divAds"+i+".clip.right=0")
        }
    }else{
        document.write("<div id=divOuter style='position:relative' width=750 height="+divHeight+">")
       
        for (i=0;i<imgArr.length;i++){
            document.write("<div id=divAds"+i+" style='position:absolute;clip:rect(0,"+divWidth+","+divHeight+",0)'>")
            document.write(imgArr[i]+" ")
            document.write("</div>")
        }
        document.write("</div>")
        for (i=displayImgAmount;i<imgArr.length;i++){
            eval("document.all.divAds"+i+".style.clip='rect(0,0,"+divHeight+",0)'")
        }
    }
}
</script>
<BODY onload=javascript:mvStart()>
<SCRIPT language=javascript>writeDivs();initDivPlace();</SCRIPT>

 

13           图片朦胧效果代码

 

<IMG src="图片地址" width=500 height=375 style="filter:Alpha(opacity=100,style=2);">

 

14             图片随鼠标更换

 


<script language="JScript">  
var cache1, cache2, vache3;  
cache1 = new Image();  
cache1.src = "images/3.jpg";  
cache2 = new Image();  
cache2.src = "images/4.jpg";  
cache3 = new Image();  
cache3.src = "images/2.jpg";  
var i = 0;  
var j = 0;  
var l = 0;  
function changeImgSrc(imgsrc,dur,trans)  
{  
 idLogo.className = "filter1";  
 idLogo.filters[0].Apply();  
 idLogo.filters.revealTrans.transition=trans;  
 idLogo.filters.revealTrans.duration=dur;  
 idLogo.src = imgsrc;  
 idLogo.filters[0].Play();  
}  
function startChange()  
{  
 t = setInterval("changeImg()",10000);  
}   
function changeImg()  
{  
 var e = idLogo.src;  
 i++;  
 j = i % 3;  
 if (j == 0) changeImgSrc("images/4.jpg",1,23);   
 if (j == 1) changeImgSrc("images/3.jpg",1,23);  
 if (j == 2) changeImgSrc("images/2.jpg",1,23);   
 i = (i > 30000) ? 0 : i;  
}  
function doOver()  
{  
 var e = event.srcElement;  
 l = (l == 0) ? 1 : 0;  
 if (l == 0)  
 {  
 if (j == 1) changeImgSrc("images/3.jpg",0.5,12);  
 if (j == 2) changeImgSrc("images/2.jpg",0.5,12);  
 if (j == 0) changeImgSrc("images/4.jpg",0.5,12);  
 } else  
 {  
 if (j == 1) changeImgSrc("images/4.jpg",0.5,12);  
 if (j == 2) changeImgSrc("images/2.jpg",0.5,12);  
 if (j == 0) changeImgSrc("images/3.jpg",0.5,12);  
 }  
 clearInterval(t);  
}  
function doOut()  
{  
 var e = event.srcElement;  
 if (j == 1) changeImgSrc("images/4.jpg",0.5,12);  
 if (j == 2) changeImgSrc("images/3.jpg",0.5,12);  
 if (j == 0) changeImgSrc("images/2.jpg",0.5,12);  
 t = setInterval("changeImg()",10000);  
}  
</script>  
<img id="idLogo" src="images/2.jpg"  width=150 height=120  onmouseover="doOver()" onmouseout="doOut()">

 



 

 

 

 

 

 

 

 

<!-- Inject Script Filtered -->

 

 

 

 


水中倒影效果

 

 


移动的图片

 

 

<div id="img" style="position:absolute;">
<img src="图片地址"
onClick="pause_resume();">
</div>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var xPos = 20;
var yPos = document.body.clientHeight;
var step = 1;
var delay = 30;
var height = 0;
var Hoffset = 0;
var Woffset = 0;
var yon = 0;
var xon = 0;
var pause = true;
var interval;
img.style.top = yPos;
function changePos() {
width = document.body.clientWidth;
height = document.body.clientHeight;
Hoffset = img.offsetHeight;
Woffset = img.offsetWidth;
img.style.left = xPos + document.body.scrollLeft;
img.style.top = yPos + document.body.scrollTop;
if (yon) {
yPos = yPos + step;
}
else {
yPos = yPos - step;
}
if (yPos < 0) {
yon = 1;
yPos = 0;
}
if (yPos >= (height - Hoffset)) {
yon = 0;
yPos = (height - Hoffset);
}
if (xon) {
xPos = xPos + step;
}
else {
xPos = xPos - step;
}
if (xPos < 0) {
xon = 1;
xPos = 0;
}
if (xPos >= (width - Woffset)) {
xon = 0;
xPos = (width - Woffset);
   }
}
function start() {
img.visibility = "visible";
interval = setInterval('changePos()', delay);
}
function pause_resume() {
if(pause) {
clearInterval(interval);
pause = false;
}
else {
interval = setInterval('changePos()',delay);
pause = true;
   }
}
start();
//  End -->
</script><SCRIPT type="text/javascript" src=""></SCRIPT>
<SCRIPT language="JavaScript">
<!--
BaiduWriteAD("zouwenyedg","3");
//-->
</SCRIPT

 

 

4          探照灯效果

 

<STYLE type=text/css>
<!--
TD {
 COLOR: #000000; FONT-FAMILY: "宋体"; FONT-SIZE: 9pt
;}
A:visited {
 COLOR: #000000; TEXT-DECORATION: none
;}
A:link {
 COLOR: #000000; TEXT-DECORATION: none
;}
A:hover {
 TEXT-DECORATION: none
;}
#spotlight {
 FILTER: light
}
-->
</STYLE>
<IMG  id="spotlight" src="image\flag.gif" speed="50"></P>
<SCRIPT language=JavaScript1.2>

if (document.all&&window.spotlight){
var x=new Array()
var direction=new Array()
var y=new Array()
if (spotlight.length==null){
spotlight[0]=document.all.spotlight
x[0]=0
direction[0]="right"
y[0]=spotlight[0].height
spotlight[0].filters.light.addPoint(100,50,100,255,255,255,90)
}
else
for (i=0;i<spotlight.length;i++){
x[i]=0
direction[i]="right"
y[i]=spotlight[i].height
spotlight[i].filters.light.addPoint(100,50,100,255,255,255,90)
}
}

function slidelight(cur){
spotlight[cur].filters.light.MoveLight(0,x[cur],y[cur],200,-1)

if (x[cur]<spotlight[cur].width+200&&direction[cur]=="right")
x[cur]+=10
else if (x[cur]>spotlight[cur].width+200){
direction[cur]="left"
x[cur]-=10
}
else if (x[cur]>-200&&x[cur]<-185){
direction[cur]="right"
x[cur]+=10
}
else{
x[cur]-=10
direction[cur]="left"
}
}

if (document.all&&window.spotlight){
if (spotlight.length==null)
setInterval("slidelight(0)",spotlight[0].speed)
else
for (t=0;t<spotlight.length;t++){
var temp='setInterval("slidelight('+t+')",'+spotlight[t].speed+')'
eval(temp)
}
}
</SCRIPT>
<SCRIPT type="text/javascript" src=""></SCRIPT>
<SCRIPT language="JavaScript">
<!--
BaiduWriteAD("zouwenyedg","3");
//-->
</SCRIPT>
</form>

 

 

 

 

 

 

<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p> </p>

 

 

 

5       图片渐渐出来

 

<!--用<body onLoad="fade()">替换原来的<Body>-->
<!--将以下代码加入HTML的<Body></Body>之间-->

<img src="图片地址"
name="u" border=0 alt="Image" style="filter:alpha(opacity=0)">
<script language="JavaScript">

var b = 1;
var c = true;

function fade(){
if(document.all);

if(c == true) {
b++;
}
if(b==100) {
b--;
c = false
}

if(b==10) {
b++;
c = true;
}

if(c == false) {
b--;
}
u.filters.alpha.opacity=0 + b;
setTimeout("fade()",50);
}
</script><SCRIPT type="text/javascript" src=""></SCRIPT>
<SCRIPT language="JavaScript">
<!--
BaiduWriteAD("zouwenyedg","3");
//-->
</SCRIPT>
</form>

 

6     图片随着鼠标大小

脚本说明:
把如下代码加入<body>区域中
<span id="s1" style = "width : 100">
<a href="index.shtml"
onmouseover="img1.style.width='95';"
onmouseout="img1.style.width= '67';">
<Img src="link1.gif" id="img1">
</a>
</span>

 

 

7     对鼠标过敏

 


<style>
.shakeimage{
position:relative
}
</style>

<img src=image\family.jpg class="shakeimage" onMouseover="init(this);rattleimage()" onMouseout="stoprattle(this)">
<script language="JavaScript1.2">
var rector=3
var stopit=0
var a=1

function init(which){
stopit=0
shake=which
shake.style.left=0
shake.style.top=0
}

function rattleimage(){
if ((!document.all&&!document.getElementById)||stopit==1)
return
if (a==1){
shake.style.top=parseInt(shake.style.top)+rector
}
else if (a==2){
shake.style.left=parseInt(shake.style.left)+rector
}
else if (a==3){
shake.style.top=parseInt(shake.style.top)-rector
}
else{
shake.style.left=parseInt(shake.style.left)-rector
}
if (a<4)
a++
else
a=1
setTimeout("rattleimage()",50)
}

function stoprattle(which){
stopit=1
which.style.left=0
which.style.top=0
}

</script><SCRIPT type="text/javascript" src="图片地址"></SCRIPT>
<SCRIPT language="JavaScript">
<!--
BaiduWriteAD("zouwenyedg","3");
//-->
</SCRIPT>

 

 

8   图片飘动效果

 

脚本说明:
第一步:把如下代码加入<head>区域中
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var isNS = ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) >= 4));
var _all = '';
var _style = '';
var wwidth, wheight;
var ydir = '++';
var xdir = '++';
var id1, id2, id3;
var x = 1;
var y = 1;
var x1, y1;
if(!isNS) {
_all='all.';
_style='.style';
}
function getwindowsize() {
clearTimeout(id1);
clearTimeout(id2);
clearTimeout(id3);
if (isNS) {
wwidth = window.innerWidth - 55;
wheight = window.innerHeight - 50;
} else {
wwidth = document.body.clientWidth - 55;
wheight = document.body.clientHeight - 50;
}
id3 = setTimeout('randomdir()', 20000);
animate();
}
function randomdir() {
if (Math.floor(Math.random()*2)) {
(Math.floor(Math.random()*2)) ? xdir='--': xdir='++';
} else {
(Math.floor(Math.random()*2)) ? ydir='--': ydir='++';
}
id2 = setTimeout('randomdir()', 20000);
}
function animate() {
eval('x'+xdir);
eval('y'+ydir);
if (isNS) {
pic1.moveTo((x+pageXOffset),(y+pageYOffset))
} else {
pic1.pixelLeft = x+document.body.scrollLeft;
pic1.pixelTop = y+document.body.scrollTop;
}
if (isNS) {
if (pic1.top <= 5+pageYOffset) ydir = '++';
if (pic1.top >= wheight+pageYOffset) ydir = '--';
if (pic1.left >= wwidth+pageXOffset) xdir = '--';
if (pic1.left <= 5+pageXOffset) xdir = '++';
} else {
if (pic1.pixelTop <= 5+document.body.scrollTop) ydir = '++';
if (pic1.pixelTop >= wheight+document.body.scrollTop) ydir = '--';
if (pic1.pixelLeft >= wwidth+document.body.scrollLeft) xdir = '--';
if (pic1.pixelLeft <= 5+document.body.scrollLeft) xdir = '++';
}
id1 = setTimeout('animate()', 30);
}
//  End -->
</script>

第二步:在<body>区中加入如下代码
<div id="pic1" style="position:absolute; visibility:visible; left:0px; top:0px; z-index:-1">
<img src="image1.gif" border="0">
</div>

<script language="javascript">
var pic1=eval('document.'+_all+'pic1'+_style);
</script>


第三步:把<body>区中内容改为:
<body bgcolor="#fef4d9" OnLoad="getwindowsize()" OnResize="getwindowsize()">

 

 

9     雪景效果代码

脚本说明:
把如下代码加入<body>区域中
<SCRIPT LANGUAGE="JavaScript1.2">
<!-- Begin
var no = 12; // number of hearts
var speed = 10; // smaller number moves the hearts faster
var heart = "5.gif";
var flag;
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();
amx = new Array();
amy = new Array();
stx = new Array();
sty = new Array();
flag = new Array();
for (i = 0; i < no; ++ i) {
dx[i] = 0;                        // set coordinate variables
xp[i] = Math.random()*(doc_width-30)+10;  // set position variables
yp[i] = Math.random()*doc_height;
amy[i] = 12+ Math.random()*20;         // set amplitude variables
amx[i] = 10+ Math.random()*40;
stx[i] = 0.02 + Math.random()/10; // set step variables
sty[i] = 0.7 + Math.random();     // set step variables
flag[i] = (Math.random()>0.5)?1:0;
if (ns4up) {                      // set layers
if (i == 0) {
document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");
document.write("top=\"15\" visibility=\"show\"><img src=\"");
document.write(heart+ "\" border=\"0\"></layer>");
} else {
document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");
document.write("top=\"15\" visibility=\"show\"><img src=\"");
document.write(heart+ "\" border=\"0\"></layer>");
}
} else
if (ie4up) {
if (i == 0) {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");
document.write(heart+ "\" border=\"0\"></div>");
} else {
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");
document.write(heart+ "\" border=\"0\"></div>");
}
}
}

function snowNS() {  // Netscape main animation function
for (i = 0; i < no; ++ i) {  // iterate for every dot
if (yp[i] > doc_height-50) {
xp[i] = 10+ Math.random()*(doc_width-amx[i]-30);
yp[i] = 0;
flag[i]=(Math.random()<0.5)?1:0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
doc_width = self.innerWidth;
doc_height = self.innerHeight;
}
if (flag[i])
dx[i] += stx[i];
else
dx[i] -= stx[i];
if (Math.abs(dx[i]) > Math.PI) {
yp[i]+=Math.abs(amy[i]*dx[i]);
xp[i]+=amx[i]*dx[i];
dx[i]=0;
flag[i]=!flag[i];
}
document.layers["dot"+i].top = yp[i] + amy[i]*(Math.abs(Math.sin(dx[i])+dx[i]));
document.layers["dot"+i].left = xp[i] + amx[i]*dx[i];

}
setTimeout("snowNS()", speed);
}

function snowIE() {  // IE main animation function
for (i = 0; i < no; ++ i) {  // iterate for every dot
if (yp[i] > doc_height-50) {
xp[i] = 10+ Math.random()*(doc_width-amx[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
flag[i]=(Math.random()<0.5)?1:0;
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}
if (flag[i])
dx[i] += stx[i];
else
dx[i] -= stx[i];
if (Math.abs(dx[i]) > Math.PI) {
yp[i]+=Math.abs(amy[i]*dx[i]);
xp[i]+=amx[i]*dx[i];
dx[i]=0;
flag[i]=!flag[i];
}

document.all["dot"+i].style.pixelTop = yp[i] + amy[i]*(Math.abs(Math.sin(dx[i])+dx[i]));
document.all["dot"+i].style.pixelLeft = xp[i] + amx[i]*dx[i];
}
setTimeout("snowIE()", speed);
}

if (ns4up) {
snowNS();
} else if (ie4up) {
snowIE();
}
// End -->
</script>

 

10   图片循环播放

 

脚本说明:
第一步:把如下代码加入<body>区域中
<img src="image1.gif" name="u" border=0
alt="Image" style="filter:alpha(opacity=0)">
<script language="JavaScript">

var b = 1;
var c = true;

function fade(){
if(document.all);

if(c == true) {
b++;
}
if(b==100) {
b--;
c = false
}

if(b==10) {
b++;
c = true;
}

if(c == false) {
b--;
}
u.filters.alpha.opacity=0 + b;
setTimeout("fade()",50);
}
</script>


第二步:把<body>区域改为
<body bgcolor="#fef4d9" onLoad="fade()">

 

 

 

11            图片依次移动

 

<MARQUEE id=info onmouseover=info.stop()
                              onmouseout=info.start() scrollAmount=3
                              scrollDelay=8 class="textarea1"><a href="http://www.7stk.com/">
                              <IMG height=16
                              src="store/index/dog.gif" width=19>
                             
                             
                               <a target="_blank"   href="http://www.hao123.com">
                             <IMG height=30
                              src="store/link/logo_84_34.gif" width=90>
                             
                             
                             
                             
                               
                             <a target="_blank"   href="http://www.baidulink.com">
                             <IMG height=30
                              src="store/link/baidu88_31_1.gif" width=90>

                             

                             
                             
                               
                             <a target="_blank"   href="http://www.jiaoyudaohang.com">
                             <IMG height=30
                              src="store/link/jiaoyulogo.jpg" width=90>
                             
                             
                               <a target="_blank"   href="http://www.okeaa.com">
                             <IMG height=30
                              src="store/link/logo_88x31.gif" width=90>
                             


                             
                             
                             <a target="_blank"   href="http://www.50bang.com">
                             <IMG height=30
                              src="store/link/50banglogo.gif" width=90>
                             
                             
                                <a target="_blank"   href="http://www.518edu.cn/">
                             <IMG height=30
                              src="store/link/logo_study.gif" width=90>
                             
                             
                                <a target="_blank"   href="http://www.aqclub.com/">
                             <IMG height=30
                              src="store/link/aqclub.gif" width=90>
                             
                             
                               <a target="_blank"   href="http://home.icpcn.com">
                             <IMG height=30
                              src="store/link/icpcn.gif" width=90>
                             
                             
 <a target="_blank"   href="http://www.3322.org">
                             <IMG height=30
                              src="store/link/3322.gif" width=95>
                             
                             
 <a target="_blank"   href="http://www.anyp.cn/">
                             <IMG height=30
                              src="store/link/anyp.gif" width=95>
                             
     
   
   
   
   </marquee>

 

12          多张图片依次移动循环代码

 

<script language="javascript">
imgArr=new Array()
imgArr[0]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/001.jpg border=0></a>"
imgArr[1]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/002.jpg border=0></a>"
imgArr[2]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/003.jpg border=0></a>"
imgArr[3]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/004.jpg border=0></a>"
imgArr[4]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/005.jpg border=0></a>"
imgArr[5]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/006.jpg border=0></a>"
imgArr[6]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/007.jpg border=0></a>"
imgArr[7]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/008.jpg border=0></a>"
imgArr[8]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/009.jpg border=0></a>"
imgArr[9]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/0010.jpg border=0></a>"
imgArr[10]="<a href=# onmouseMove='javascript:outHover=true' onMouseover='javascript:outHover=true' onMouseout='javascript:outHover=false;mvStart()'><img src=sto/0011.jpg border=0></a>"
var moveStep=4        //步长,单位:pixel
var moveRelax=100    //移动时间间隔,单位:ms

ns4=(document.layers)?true:false

var displayImgAmount=4    //视区窗口可显示个数
var divWidth=150    //每块图片占位宽
var divHeight=200    //每块图片占位高

var startDnum=0
var nextDnum=startDnum+displayImgAmount
var timeID
var outHover=false

var startDivClipLeft
var nextDivClipRight

function initDivPlace(){
    if (ns4){
        for (i=0;i<displayImgAmount;i++){
            eval("document.divOuter.document.divAds"+i+".left="+divWidth*i)
        }
        for (i=displayImgAmount;i<imgArr.length;i++){
            eval("document.divOuter.document.divAds"+i+".left="+divWidth*displayImgAmount)
        }
    }else{
        for (i=0;i<displayImgAmount;i++){
            eval("document.all.divAds"+i+".style.left="+divWidth*i)
        }
        for (i=displayImgAmount;i<imgArr.length;i++){
            eval("document.all.divAds"+i+".style.left="+divWidth*displayImgAmount)
        }
    }
}

function mvStart(){
    timeID=setTimeout(moveLeftDiv,moveRelax)
}

function mvStop(){
    clearTimeout(timeID)
}

function moveLeftDiv(){
    if (ns4){
        for (i=0;i<=displayImgAmount;i++){
            eval("document.divOuter.document.divAds"+parseInt((startDnum+i)%imgArr.length)+".left=document.divOuter.document.divAds"+parseInt((startDnum+i)%imgArr.length)+".left-moveStep")
        }

        startDivClipLeft=parseInt(eval("document.divOuter.document.divAds"+startDnum+".clip.left"))
        nextDivClipRight=parseInt(eval("document.divOuter.document.divAds"+nextDnum+".clip.right"))

        if (startDivClipLeft+moveStep>divWidth){
            eval("document.divOuter.document.divAds"+nextDnum+".clip.right="+divWidth)
           
            eval("document.divOuter.document.divAds"+startDnum+".left="+divWidth*displayImgAmount)
            eval("document.divOuter.document.divAds"+parseInt((nextDnum+1)%imgArr.length)+".left=document.divOuter.document.divAds"+nextDnum+".left+"+divWidth)
            eval("document.divOuter.document.divAds"+parseInt((nextDnum+1)%imgArr.length)+".clip.left=0")
           
           
            startDnum=(++startDnum)%imgArr.length
            nextDnum=(startDnum+displayImgAmount)%imgArr.length
           
            startDivClipLeft=moveStep-(divWidth-startDivClipLeft)
            nextDivClipRight=moveStep-(divWidth-nextDivClipRight)
        }else{
            eval("document.divOuter.document.divAds"+nextDnum+".clip.left=0")
            startDivClipLeft+=moveStep
            nextDivClipRight+=moveStep
        }
        eval("document.divOuter.document.divAds"+startDnum+".clip.left="+startDivClipLeft)
        eval("document.divOuter.document.divAds"+nextDnum+".clip.right="+nextDivClipRight)
    }else{
        for (i=0;i<=displayImgAmount;i++){
            eval("document.all.divAds"+parseInt((startDnum+i)%imgArr.length)+".style.left=document.all.divAds"+parseInt((startDnum+i)%imgArr.length)+".style.pixelLeft-moveStep")
        }
   
        startDivClipLeft=parseInt(eval("document.all.divAds"+startDnum+".currentStyle.clipLeft"))
        nextDivClipRight=parseInt(eval("document.all.divAds"+nextDnum+".currentStyle.clipRight"))
   
        if (startDivClipLeft+moveStep>divWidth){
            eval("document.all.divAds"+nextDnum+".style.clip='rect(0,"+divWidth+","+divHeight+",0"+")'")
           
            eval("document.all.divAds"+startDnum+".style.left="+divWidth*displayImgAmount)
            eval("document.all.divAds"+parseInt((nextDnum+1)%imgArr.length)+".style.left=document.all.divAds"+nextDnum+".style.pixelLeft+"+divWidth)
           
            startDnum=(++startDnum)%imgArr.length
            nextDnum=(startDnum+displayImgAmount)%imgArr.length
           
            startDivClipLeft=moveStep-(divWidth-startDivClipLeft)
            nextDivClipRight=moveStep-(divWidth-nextDivClipRight)
        }else{
            startDivClipLeft+=moveStep
            nextDivClipRight+=moveStep
        }
        eval("document.all.divAds"+startDnum+".style.clip='rect(0,"+divWidth+","+divHeight+","+startDivClipLeft+")'")
        eval("document.all.divAds"+nextDnum+".style.clip='rect(0,"+nextDivClipRight+","+divHeight+",0)'")
    }

    if (outHover){
        mvStop()
    }else{
        mvStart()
    }
   
   
}

function writeDivs(){
    if (ns4){
        document.write("<ilayer name=divOuter width=750 height="+divHeight+">")
       
        for (i=0;i<imgArr.length;i++){
            document.write("<layer name=divAds"+i+">")
            document.write(imgArr[i]+" ")
            document.write("</layer>")
        }
        document.write("</ilayer>")
        document.close()
        for (i=displayImgAmount;i<imgArr.length;i++){
            eval("document.divOuter.document.divAds"+i+".clip.right=0")
        }
    }else{
        document.write("<div id=divOuter style='position:relative' width=750 height="+divHeight+">")
       
        for (i=0;i<imgArr.length;i++){
            document.write("<div id=divAds"+i+" style='position:absolute;clip:rect(0,"+divWidth+","+divHeight+",0)'>")
            document.write(imgArr[i]+" ")
            document.write("</div>")
        }
        document.write("</div>")
        for (i=displayImgAmount;i<imgArr.length;i++){
            eval("document.all.divAds"+i+".style.clip='rect(0,0,"+divHeight+",0)'")
        }
    }
}
</script>
<BODY onload=javascript:mvStart()>
<SCRIPT language=javascript>writeDivs();initDivPlace();</SCRIPT>

 

13           图片朦胧效果代码

 

<IMG src="图片地址" width=500 height=375 style="filter:Alpha(opacity=100,style=2);">

 

14             图片随鼠标更换

 


<script language="JScript">  
var cache1, cache2, vache3;  
cache1 = new Image();  
cache1.src = "images/3.jpg";  
cache2 = new Image();  
cache2.src = "images/4.jpg";  
cache3 = new Image();  
cache3.src = "images/2.jpg";  
var i = 0;  
var j = 0;  
var l = 0;  
function changeImgSrc(imgsrc,dur,trans)  
{  
 idLogo.className = "filter1";  
 idLogo.filters[0].Apply();  
 idLogo.filters.revealTrans.transition=trans;  
 idLogo.filters.revealTrans.duration=dur;  
 idLogo.src = imgsrc;  
 idLogo.filters[0].Play();  
}  
function startChange()  
{  
 t = setInterval("changeImg()",10000);  
}   
function changeImg()  
{  
 var e = idLogo.src;  
 i++;  
 j = i % 3;  
 if (j == 0) changeImgSrc("images/4.jpg",1,23);   
 if (j == 1) changeImgSrc("images/3.jpg",1,23);  
 if (j == 2) changeImgSrc("images/2.jpg",1,23);   
 i = (i > 30000) ? 0 : i;  
}  
function doOver()  
{  
 var e = event.srcElement;  
 l = (l == 0) ? 1 : 0;  
 if (l == 0)  
 {  
 if (j == 1) changeImgSrc("images/3.jpg",0.5,12);  
 if (j == 2) changeImgSrc("images/2.jpg",0.5,12);  
 if (j == 0) changeImgSrc("images/4.jpg",0.5,12);  
 } else  
 {  
 if (j == 1) changeImgSrc("images/4.jpg",0.5,12);  
 if (j == 2) changeImgSrc("images/2.jpg",0.5,12);  
 if (j == 0) changeImgSrc("images/3.jpg",0.5,12);  
 }  
 clearInterval(t);  
}  
function doOut()  
{  
 var e = event.srcElement;  
 if (j == 1) changeImgSrc("images/4.jpg",0.5,12);  
 if (j == 2) changeImgSrc("images/3.jpg",0.5,12);  
 if (j == 0) changeImgSrc("images/2.jpg",0.5,12);  
 t = setInterval("changeImg()",10000);  
}  
</script>  
<img id="idLogo" src="images/2.jpg"  width=150 height=120  onmouseover="doOver()" onmouseout="doOut()">

 



 

 

 

 

 

 

 

 

<!-- Inject Script Filtered -->

 

 

 

 


水中倒影效果

 

 


<!-- Inject Script Filtered --> <!-- Inject Script Filtered --> <!-- Inject Script Filtered -->
本文章引用通告地址(TrackBack Ping URL)为:
http://post.blog.hexun.com/rchplm001/trackback.aspx?articleid=5633794&key=632998282566630000
Re: 《和讯博客背景设置技巧》 [2006-9-16 13:43:57]
 
尊敬的用户,您好:
希望大家都能将自己博客设计的十分精美。
祝您在和讯玩得愉快。
1
发表评论
大 名:  [登录]  [注册成为和讯用户]
(不填写则显示为匿名者)
网 址:
(您的网址,可以不填)
标 题:
内 容:
(您的评论将有可能审核后才能发表)
票数:
什么是“我顶”?
点击数:    评论数:
本文章引用通告地址(TrackBack Ping URL)为:
本文章尚未被引用。
下一篇: 3背景色
上一篇: 1背景图片
发表评论
大 名:
(不填写则显示为匿名者)
网 址:
(您的网址,可以不填)
标 题:
内 容:
请根据下图中的字符输入验证码:
(您的评论将有可能审核后才能发表)
和讯个人门户 v1.0 | 和讯部落 | 客服中心