原创力文档- 1、本文档共6页，可阅读全部内容。
- 2、原创力文档（book118）网站文档一经付费（服务费），不意味着购买了该文档的版权，仅供个人/单位学习、研究之用，不得用于商业用途，未经授权，严禁复制、发行、汇编、翻译或者网络传播等，侵权必究。
- 3、本站所有内容均由合作方或网友上传，本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺！文档内容仅供研究参考，付费前请自行鉴别。如您付费，意味着您自己接受本站规则且自行承担风险，本站不退款、不进行额外附加服务；查看《如何避免下载的几个坑》。如果您已付费下载过本站文档，您可以点击 这里二次下载。
- 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等，请点击“版权申诉”（推荐），也可以打举报电话：400-050-0827(电话支持时间：9:00-18:30)。
查看更多
一些常用的网页特效.doc
阴影
<table style="filter:progid:DXImageTransform.microsoft.shadow(color=#666666,direction=135,strength=3)"><tr>
<td>
这个表格有 shadow 阴影。
</td></tr>
</table>
<br><br>
<table style="background:#eeeeee;filter:progid:DXImageTransform.microsoft.dropshadow(color=#999999,offX=2,offY=5)"><tr>
<td>
这个表格有 drop shadow阴影。
</td></tr>
</table>
图片自动切换
<title>javascript图片轮换</title>
<style type="text/css">
#album{
position:relative;
width:400px;
height:300px;
border:10px solid #EFEFDA;
overflow:hidden;
}
#album dt {
margin:0;
padding:0;
width:400px;
height:300px;
overflow:hidden;
}
#album img {
border:2px solid #000;
}
#album dd {
position:absolute;
right:0px;
bottom:10px;
}
#album a {
display:block;
float:left;
margin-right:10px;
width:15px;
height:15px;
line-height:15px;
text-align:center;
text-decoration:none;
color:#808080;
background:transparent url(/jscss/demoimg/200910/o_button.gif) no-repeat -15px 0;
}
#album a:hover ,#album a.hover{
color:#F8F8F8;
background-position:0 0;
}
</style>
<dl id="album">
<dt>
<img id="index1" alt=余秋的黄昏" src="/jscss/demoimg/wall3.jpg" />
<img id="index2" alt="美丽欧洲" src="/jscss/demoimg/wall4.jpg" />
<img id="index3" alt="巨石阵的神秘" src="/jscss/demoimg/wall5.jpg" />
</dt>
<dd>
<a href="#index1">1</a><a href="#index2">2</a><a href="#index3">3</a>
</dd>
</dl>
<script type="text/javascript">
function imageRotater(id){
var cases = "",
album = document.getElementById(id),
images = album.getElementsByTagName("img"),
links = album.getElementsByTagName("a"),
dt = album.getElementsByTagName("dt")[0],
length = images.length,
aIndex = 1,
aBefore = length;
for(var i=0;i< length;i++){
cases += images[i].id + ':"'+images[i].getAttribute("src")+'",'
}
images[0].style.cssText = "position:absolute;top:0;left:0;";//修正图片位置错误
var tip = document.createElement("dd");
文档评论（0）