百叶窗的特效代码

晨曦 · 发表于 2006-9-17 12:59:30

百叶窗的特效代码

代码如下：

<TABLE cellSpacing=0 cellPadding=0 width="70%" align=center border=0>
<TBODY>
<TR>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 direction=right width=120><IMG src="照片地址"></MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 width=120><IMG src="照片地址"></MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 direction=right width=120><IMG src="照片地址"></MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 width=120><IMG src="照片地址"></MARQUEE></TD></TR></TBODY></TABLE>

调整scrollDelay=XX可以调整滑动速度

晨曦 · 发表于 2006-9-17 13:01:46

推荐一个很神奇的渐显照片的代码

照片是朦胧效果，只有把鼠标点到照片上去，照片才会清晰，大家试试，是不是很神奇哟

代码如下：

<head>

<script language="Javascript1.2">
function makevisible(cur,which){
if (which==0)
cur.filters.alpha.opacity=100
else
cur.filters.alpha.opacity=20
}
</script></head>
<body><img src="照片地址" style="filter:alpha(opacity=20)" onMouseOver="makevisible(this,0)" onMouseOut="makevisible(this,1)"></body>

晨曦 · 发表于 2006-9-17 13:03:32

又一个照片特效代码：可以自动变换的照片

拷贝以下代码：

<head><script language=javascript>
<!--//
sandra0 = new Image();
sandra0.src = "image1.gif";
sandra1 = new Image();
sandra1.src = "image2.gif";
sandra2 = new Image();
sandra2.src = "image3.gif";
var i_strngth=1
var i_image=0
var imageurl = new Array()
imageurl[0] ="

http://bb.muqin.com.cn/user/6390/乐16.jpg"
imageurl[1] ="

http://bb.muqin.com.cn/user/6390/乐17.jpg"
imageurl[2] ="

http://bb.muqin.com.cn/user/6390/乐18.jpg"
imageurl[3] ="

http://bb.muqin.com.cn/user/6390/乐19.jpg"
imageurl[4] ="

http://bb.muqin.com.cn/user/6390/乐20.jpg"

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)
}
}
//-->
</script></head>
<body onLoad="showimage()"><span id="testimage" > </span></body>

晨曦 · 发表于 2006-9-17 13:07:05

<html>
<head>
<title>无忧建站-网页特效-窗口特效-页面加载百叶窗效果</title>
<meta http-equiv=content-Type content="text/html;charset=gb2312">

<style>

</style>
</head>
<body>

<div id="i1" class="intro"></div><div id="i2" class="intro"></div><div id="i3"
class="intro"></div><div id="i4" class="intro"></div><div id="i5" class="intro"></div><div
id="i6" class="intro"></div><div id="i7" class="intro"></div><div id="i8" class="intro"></div>
<script language="JavaScript1.2">
var ns4=document.layers?1:0
var ie4=document.all?1:0
var ns6=document.getElementById&&!document.all?1:0
var speed=20
var temp=new Array()
var temp2=new Array()
if (ns4){
for (i=1;i<=8;i++){
temp=eval("document.i"+i+".clip")
temp2=eval("document.i"+i)
temp.width=window.innerWidth
temp.height=window.innerHeight/8
temp2.top=(i-1)*temp.height
}
}
else if (ie4||ns6){
var clipright=ns6?window.innerWidth:document.body.clientWidth
clipleft=0
for (i=1;i<=8;i++){
temp=ns6?document.getElementById("i"+i).style:eval("document.all.i"+i+".style")
temp.width=ns6?window.innerWidth-15:document.body.clientWidth
temp.height=ns6?window.innerHeight/8:document.body.offsetHeight/8
temp.top=(i-1)*parseInt(temp.height)
}
}
function openit(){
window.scrollTo(0,0)
if (ns4){
for (i=1;i<=8;i=i+2)
temp.right-=speed
for (i=2;i<=8;i=i+2)
temp.left+=speed
if (temp[2].left>window.innerWidth)
clearInterval(stopit)
}
else if (ie4||ns6){
clipright-=speed
for (i=1;i<=8;i=i+2){
temp.clip="rect(0 "+clipright+" auto 0)"
}
clipleft+=speed
for (i=2;i<=8;i=i+2){
temp.clip="rect(0 auto auto "+clipleft+")"
}
if (clipright<=0){
if (ns6){
for (i=1;i<=8;i++)
temp.display="none"
}
clearInterval(stopit)
}
}
}
function gogo(){
stopit=setInterval("openit()",100)
}
gogo()
</script>
</body>
</html>

晨曦 · 发表于 2006-9-17 13:08:42

<html>
<head>
<title>无忧建站-网页特效-图形图像-CSS制作半透明图片</title>
<meta http-equiv=content-Type content="text/html;charset=gb2312">

<style>
body{ font-size:12px;}
#top{position:absolute;}
#top a img{-moz-opacity:0.5; filter:alpha(opacity=50);border:0px;}
#top a:hover{font-size:9px;}
#top a:hover img{-moz-opacity:0.5; filter:alpha(opacity=80);cursor:hand;}
</style>
</head>
<body>

<div>
<div id="top">
<a href="http://www.51jz.org" target="_blank"><img src="http://www.51jz.org/effect/files/qqgirl.jpg" /></a>
</div>
这里是文字部分
</div>
</body>
</html>

晨曦 · 发表于 2006-9-17 13:09:13

<html>
<head>
<title>无忧建站-网页特效-图形图像-不停闪烁的图片</title>
<meta http-equiv=content-Type content="text/html;charset=gb2312">
</head>

<body onload="soccerOnload()">

<DIV ID="soccer" STYLE="position:absolute;left:150;top:0"><a href="http://www.51jz.org" target="_blank"><IMG SRC="http://www.51jz.org/effect/files/huandeng1.jpg" border="0"></a></DIV>
<SCRIPT LANGUAGE="JavaScript">
var msecs = 500; //改变时间得到不同的闪烁间隔；
var counter = 0;
function soccerOnload() {
setTimeout("blink()", msecs);
}
function blink() {
soccer.style.visibility =
(soccer.style.visibility == "hidden") ? "visible" : "hidden";
counter +=1;
setTimeout("blink()", msecs);
}
</SCRIPT>
</body>
</html>

晨曦 · 发表于 2006-9-17 13:10:59

<html>
<head>
<title>无忧建站-网页特效-一个简单的图片查看器</title>
<meta http-equiv=content-Type content="text/html;charset=gb2312">
</head>
<body>

请选择图片：<select id="sel" name="pic" onChange="selpic(this.options[this.options.selectedIndex].value)">
</select><br>
<img src="http://www.51jz.org/effect/files/huandeng1.jpg" id="preview">
<script language="javascript">
var oImage=new Array()
for(i=1;i<6;i++)
{
oImage=new Image()
oImage.src="http://www.51jz.org/effect/files/huandeng"+i+".jpg"
document.getElementById('sel').options.add(new Option(i,i))
}
function selpic(n)
{
preview.src=oImage[n].src
}
</script>
</body>
</html>

晨曦 · 发表于 2006-9-17 13:13:53

<html>
<head>
<title>无忧建站-网页特效-多种图像过渡显示特效</title>
<meta http-equiv=content-Type content="text/html;charset=gb2312">

<script language="JavaScript">

</script>
</head>

<body onclick="Clicked()">
单击鼠标观察效果！

<center>
<div id="Layer2" style="position:absolute; left:482px; top:56px; width:158px; height:323px; z-index:2">
</div>
<script>

</script>
<div id="image"><div id="text1"></div>
<dd align="center">
<img height="200" id="image1" src="http://www.51jz.org/example/images/huandeng1.jpg" style="FILTER: revealTrans(Duration=3.0,Transition=1); VISIBILITY: hidden" width="150">
<img height="200" id="image2" src="http://www.51jz.org/example/images/huandeng2.jpg" style="FILTER: revealTrans(Duration=3.0,Transition=1); VISIBILITY: hidden" width="150"> </dd>
</div><div id="text2" style="width: 624; height: 22"><div align="center"><center>
</center></div></div>
</center>
</body>
</html>

晨曦 · 发表于 2006-9-17 20:05:23

<html>
<head>
<title>无忧建站-网页特效-图片循环显隐</title>
<meta http-equiv=content-Type content="text/html;charset=gb2312">
</head>

<body onLoad="fade()">

<img src="http://www.51jz.org/effect/files/flag.gif" name="u" border=0 alt="Image" style="filter:alpha(opacity=0)" width="85" height="55">
<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>
</html>

晨曦 · 发表于 2006-9-17 20:05:55

<html>
<head>
<title>无忧建站-网页特效-幻影图片效果</title>
<meta http-equiv=content-Type content="text/html;charset=gb2312">

<style>
#test{
filter:progid:DXImageTransform.Microsoft.MotionBlur(Strength=30,Direction=90)
}
</style>
</head>
<body>

<img src="http://www.51jz.org/effect/files/flag.gif" id="test">
</body>
</html>

晨曦 · 发表于 2006-9-17 20:06:32

<html>
<head>
<title>无忧建站-网页特效-CSS滤镜实现的多种图片显示效果</title>
<meta http-equiv=content-Type content="text/html;charset=gb2312">
</head>
<body>
重新刷新试试！<br>

<script for=window event=onLoad language=vbscript>
image1.filters.item(0).apply()
image1.filters.item(0).transition = 10
image1.Style.visibility = ""
image1.filters(0).play(2.0)
image2.filters.item(0).apply()
image2.filters.item(0).transition = 11
image2.Style.visibility = ""
image2.filters(0).play(2.0)
image3.filters.item(0).apply()
image3.filters.item(0).transition = 12
image3.Style.visibility = ""
image3.filters(0).play(2.0)
image4.filters.item(0).apply()
image4.filters.item(0).transition = 13
image4.Style.visibility = ""
image4.filters(0).play(2.0)
image5.filters.item(0).apply()
image5.filters.item(0).transition = 14
image5.Style.visibility = ""
image5.filters(0).play(2.0)
image6.filters.item(0).apply()
image6.filters.item(0).transition = 15
image6.Style.visibility = ""
image6.filters(0).play(2.0)
</script>
<img src="http://www.51jz.org/example/images/huandeng1.jpg" border=0 id="image1" style="visibility:hidden; FILTER:revealTrans(Duration=4.0, Transition=23);" width="150" height="200">
      <br>
      <img src="http://www.51jz.org/example/images/huandeng2.jpg" border=0 id="image2" style="visibility:hidden; FILTER:revealTrans(Duration=4.0, Transition=22);" width="150" height="200">
      <br> <img src="http://www.51jz.org/example/images/huandeng3.jpg" border=0 id="image3" style="visibility:hidden; FILTER:revealTrans(Duration=4.0, Transition=23);" width="150" height="200">
      <br>
      <img src="http://www.51jz.org/example/images/huandeng4.jpg" border=0 id="image4" style="visibility:hidden; FILTER:revealTrans(Duration=4.0, Transition=22);" width="150" height="200">
      <br> <img src="images/e.jpg" border=0 id="image5" style="visibility:hidden; FILTER:revealTrans(Duration=4.0, Transition=22);" width="150" height="200">
      <br>
      <img src="http://www.51jz.org/example/images/huandeng5.jpg" border=0 id="image6" style="visibility:hidden; FILTER:revealTrans(Duration=4.0, Transition=22);" width="150" height="200">
</body>
</html>

客人 *发表于 2010-9-29 14:21:20* · 发表于 2010-9-29 14:21:20

请问这一段代码如果我要放多张图片应该怎么修改，如果愿意请加我QQ1030851471

客人 *发表于 2010-9-29 14:23:22* · 发表于 2010-9-29 14:23:22

以下是引用晨曦在2006-9-17 13:13:53的发言：

<html>
<head>
<title>无忧建站-网页特效-多种图像过渡显示特效</title>
<meta http-equiv=content-Type content="text/html;charset=gb2312">

<script language="JavaScript">

</script>
</head>

<body onclick="Clicked()">
单击鼠标观察效果！

<center>
<div id="Layer2" style="position:absolute; left:482px; top:56px; width:158px; height:323px; z-index:2">
</div>
<script>

</script>
<div id="image"><div id="text1"></div>
<dd align="center">
<img height="200" id="image1" src="http://www.51jz.org/example/images/huandeng1.jpg" style="FILTER: revealTrans(Duration=3.0,Transition=1); VISIBILITY: hidden" width="150">
<img height="200" id="image2" src="http://www.51jz.org/example/images/huandeng2.jpg" style="FILTER: revealTrans(Duration=3.0,Transition=1); VISIBILITY: hidden" width="150"> </dd>
</div><div id="text2" style="width: 624; height: 22"><div align="center"><center>
</center></div></div>
</center>
</body>
</html>

请问这段代码如果要放多张图片应该怎么修改

		自动登录	找回密码
密码			立即注册