两级联动菜单

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>js二级联动菜单</title>
<style type="text/css">
ul,li,dl,dd {
padding:0;
margin:0;
list-style-type:none;
}
.menu1{
width:182px;
border:1px solid #feb951;
background:#fef4ea;
padding-top:3px;
font-size:12px;
}
.lbox_bot {
height:4px;
overflow:hidden;
background:url(../images/lbox_bot.gif) 0 0 no-repeat;
}
.area li{
height:22px;
line-height:22px;
text-align:left;
position:relative;
}
.area li a {
display:block;
padding-left:20px;
}
.area li dl {
width:180px;
overflow:hidden;
display:none;
position:absolute;
top:-1px;
right:-182px;
z-index:35533;
border:1px solid #feb951;
background:#fef4ea;
padding:5px 0;
}
.area li dl a:hover {
border:1px solid #feb951;
background:#fff;
margin:0 5px;
padding-left:14px;
}
.area li.lion {
height:20px;
line-height:20px;
text-align:left;
border-top:1px solid #ffb850;
border-bottom:1px solid #ffb850;
background:#ffe7cc;
}
.area li.lion dl {display:block;}
</style>
</head>
<body>
<div id="rtab2_box" class="menu1">
<ul id="area" class="area">
   <li><a href="/a_01/">安徽省</a>
   <dl>
   <dd><a href="/a_010100/">安庆市</a></dd>
   <dd><a href="/a_010200/">蚌埠市</a></dd>
   <dd><a href="/a_010300/">亳州市</a></dd>
   <dd><a href="/a_010400/">巢湖市</a></dd>
   <dd><a href="/a_010500/">滁州市</a></dd>
   <dd><a href="/a_010600/">阜阳市</a></dd>
   <dd><a href="/a_010700/">合肥市</a></dd>
   <dd><a href="/a_010800/">淮北市</a></dd>
   <dd><a href="/a_010900/">淮南市</a></dd>
   <dd><a href="/a_011000/">黄山市</a></dd>
   <dd><a href="/a_011100/">六安市</a></dd>
   <dd><a href="/a_011200/">马鞍山市</a></dd>
   <dd><a href="/a_011300/">宿州市</a></dd>
   <dd><a href="/a_011400/">太湖市</a></dd>
   <dd><a href="/a_011500/">芜湖市</a></dd>
   <dd><a href="/a_011600/">歙县</a></dd>
   <dd><a href="/a_011700/">宣城市</a></dd>
   <dd><a href="/a_011800/">池城市</a></dd>
   <dd><a href="/a_011900/">铜陵市</a></dd>
   </dl>
   </li>
   <li><a href="/a_02/">北京</a>
   <dl>
   <dd><a href="/a_020100/">昌平区</a></dd>
   <dd><a href="/a_020200/">朝阳区</a></dd>
   <dd><a href="/a_020300/">崇文区</a></dd>
   <dd><a href="/a_020400/">大兴区</a></dd>
   <dd><a href="/a_020500/">东城区</a></dd>
   <dd><a href="/a_020600/">房山区</a></dd>
   <dd><a href="/a_020700/">丰台区</a></dd>
   <dd><a href="/a_020800/">海淀区</a></dd>

   <dd><a href="/a_020900/">怀柔区</a></dd>
   <dd><a href="/a_021000/">门头沟区</a></dd>
   <dd><a href="/a_021100/">密云县</a></dd>
   <dd><a href="/a_021200/">平谷区</a></dd>
   <dd><a href="/a_021300/">石景山区</a></dd>
   <dd><a href="/a_021400/">顺义区</a></dd>
   <dd><a href="/a_021500/">通州区</a></dd>
   <dd><a href="/a_021600/">西城区</a></dd>
   <dd><a href="/a_021700/">宣武区</a></dd>
   <dd><a href="/a_021800/">延庆县</a></dd>
   <dd><a href="/a_021900/">燕山区</a></dd>
   </dl>
   </li>
   <li><a href="/a_03/">重庆</a>
   <dl>
   <dd><a href="/a_030100/">巴南区</a></dd>
   <dd><a href="/a_030200/">北碚区</a></dd>
   <dd><a href="/a_030300/">璧山县</a></dd>
   <dd><a href="/a_030400/">长寿区</a></dd>
   <dd><a href="/a_030500/">城口县</a></dd>
   <dd><a href="/a_030600/">大足县</a></dd>
   <dd><a href="/a_030700/">垫江县</a></dd>
   <dd><a href="/a_030800/">渡口区</a></dd>
   <dd><a href="/a_030900/">丰都县</a></dd>
   <dd><a href="/a_031000/">奉节县</a></dd>
   <dd><a href="/a_031100/">涪陵区</a></dd>
   <dd><a href="/a_031200/">涪陵市</a></dd>
   <dd><a href="/a_031300/">合川市</a></dd>
   <dd><a href="/a_031400/">江北区</a></dd>
   <dd><a href="/a_031500/">江津市</a></dd>
   <dd><a href="/a_031600/">九龙坡区</a></dd>
   <dd><a href="/a_031700/">开县</a></dd>
   <dd><a href="/a_031800/">梁平县</a></dd>
   <dd><a href="/a_031900/">南岸区</a></dd>
   <dd><a href="/a_032000/">南川市</a></dd>
   <dd><a href="/a_032100/">彭水</a></dd>
   <dd><a href="/a_032200/">綦江县</a></dd>
   <dd><a href="/a_032300/">黔江区</a></dd>
   <dd><a href="/a_032400/">荣昌县</a></dd>
   <dd><a href="/a_032500/">沙坪坝区</a></dd>
   <dd><a href="/a_032600/">石柱</a></dd>
   <dd><a href="/a_032700/">双桥区</a></dd>
   <dd><a href="/a_032800/">铜梁县</a></dd>
   <dd><a href="/a_032900/">潼南县</a></dd>
   <dd><a href="/a_033000/">万盛区</a></dd>
   <dd><a href="/a_033100/">万县市</a></dd>
   <dd><a href="/a_033200/">万州区</a></dd>
   <dd><a href="/a_033300/">巫山县</a></dd>
   <dd><a href="/a_033400/">巫溪县</a></dd>
   <dd><a href="/a_033500/">武隆县</a></dd>
   <dd><a href="/a_033600/">秀山</a></dd>
   <dd><a href="/a_033700/">永川市</a></dd>
   <dd><a href="/a_033800/">酉阳</a></dd>
   <dd><a href="/a_033900/">渝北区</a></dd>
   <dd><a href="/a_034000/">云阳县</a></dd>
   <dd><a href="/a_034100/">忠县</a></dd>
   <dd><a href="/a_034200/">渝中区</a></dd>
   </dl>
   </li>
   <li><a href="/a_04/">福建省</a>
   <dl>
   <dd><a href="/a_040100/">福州市</a></dd>
   <dd><a href="/a_040200/">龙岩市</a></dd>
   <dd><a href="/a_040300/">南平市</a></dd>
   <dd><a href="/a_040400/">宁德市</a></dd>
   <dd><a href="/a_040500/">莆田市</a></dd>
   <dd><a href="/a_040600/">泉州市</a></dd>
   <dd><a href="/a_040700/">三明市</a></dd>
   <dd><a href="/a_040800/">邵武市</a></dd>
   <dd><a href="/a_040900/">石狮市</a></dd>
   <dd><a href="/a_041000/">厦门市</a></dd>
   <dd><a href="/a_041100/">永安市</a></dd>
   <dd><a href="/a_041200/">漳州市</a></dd>
   </dl>
   </li>
   <li><a href="/a_05/">甘肃省</a>
   <dl>
   <dd><a href="/a_050100/">白银市</a></dd>
   <dd><a href="/a_050200/">定西市</a></dd>
   <dd><a href="/a_050300/">甘南</a></dd>
   <dd><a href="/a_050400/">嘉峪关市</a></dd>
   <dd><a href="/a_050500/">金昌市</a></dd>
   <dd><a href="/a_050600/">酒泉市</a></dd>
   <dd><a href="/a_050700/">兰州市</a></dd>
   <dd><a href="/a_050800/">临夏市</a></dd>
   <dd><a href="/a_050900/">陇南市</a></dd>
   <dd><a href="/a_051000/">平凉市</a></dd>
   <dd><a href="/a_051100/">庆阳市</a></dd>
   <dd><a href="/a_051200/">天水市</a></dd>
   <dd><a href="/a_051300/">武威市</a></dd>
   <dd><a href="/a_051400/">西峰市</a></dd>
   <dd><a href="/a_051500/">玉门市</a></dd>
   <dd><a href="/a_051600/">张掖市</a></dd>
   </dl>
   </li>
   <li><a href="/a_06/">广东省</a>
   <dl>
   <dd><a href="/a_060100/">潮州市</a></dd>
   <dd><a href="/a_060200/">潮阳市</a></dd>
   <dd><a href="/a_060300/">东莞市</a></dd>
   <dd><a href="/a_060400/">佛山市</a></dd>
   <dd><a href="/a_060500/">广州市</a></dd>
   <dd><a href="/a_060600/">河源市</a></dd>
   <dd><a href="/a_060700/">惠州市</a></dd>
   <dd><a href="/a_060800/">江门市</a></dd>
   <dd><a href="/a_060900/">揭阳</a></dd>
   <dd><a href="/a_061000/">茂名市</a></dd>
   <dd><a href="/a_061100/">梅州市</a></dd>
   <dd><a href="/a_061200/">清远市</a></dd>
   <dd><a href="/a_061300/">汕头市</a></dd>
   <dd><a href="/a_061400/">汕尾市</a></dd>
   <dd><a href="/a_061500/">韶关市</a></dd>
   <dd><a href="/a_061600/">深圳市</a></dd>
   <dd><a href="/a_061700/">顺德</a></dd>
   <dd><a href="/a_061800/">阳江市</a></dd>
   <dd><a href="/a_061900/">云浮</a></dd>
   <dd><a href="/a_062000/">湛江市</a></dd>
   <dd><a href="/a_062100/">肇庆市</a></dd>
   <dd><a href="/a_062200/">中山市</a></dd>
   <dd><a href="/a_062300/">珠海</a></dd>
   <dd><a href="/a_062400/">恩平市</a></dd>
   </dl>
   </li>
   <li><a href="/a_07/">广西省</a>
   <dl>
   <dd><a href="/a_070100/">百色市</a></dd>
   <dd><a href="/a_070200/">北海市</a></dd>
   <dd><a href="/a_070300/">崇左市</a></dd>
   <dd><a href="/a_070400/">防城港市</a></dd>
   <dd><a href="/a_070500/">贵港市</a></dd>
   <dd><a href="/a_070600/">桂林市</a></dd>
   <dd><a href="/a_070700/">合山市</a></dd>
   <dd><a href="/a_070800/">河池市</a></dd>
   <dd><a href="/a_070900/">贺州市</a></dd>
   <dd><a href="/a_071000/">来宾市</a></dd>
   <dd><a href="/a_071100/">柳州市</a></dd>
   <dd><a href="/a_071200/">南宁市</a></dd>
   <dd><a href="/a_071300/">凭祥市</a></dd>
   <dd><a href="/a_071400/">钦州市</a></dd>
   <dd><a href="/a_071500/">梧州市</a></dd>
   <dd><a href="/a_071600/">玉林市</a></dd>
   </dl>
   </li>
   <li><a href="/a_08/">贵州省</a>
   <dl>
   <dd><a href="/a_080100/">安顺市</a></dd>
   <dd><a href="/a_080200/">毕节市</a></dd>
   <dd><a href="/a_080300/">赤水市</a></dd>
   <dd><a href="/a_080400/">都匀市</a></dd>
   <dd><a href="/a_080500/">贵阳市</a></dd>
   <dd><a href="/a_080600/">凯里市</a></dd>
   <dd><a href="/a_080700/">六盘水市</a></dd>
   <dd><a href="/a_080800/">铜仁市</a></dd>
   <dd><a href="/a_080900/">兴义市</a></dd>
   <dd><a href="/a_081000/">遵义市</a></dd>
   </dl>
   </li>
   <li><a href="/a_09/">海南省</a>
   <dl>
   <dd><a href="/a_090100/">白沙</a></dd>
   <dd><a href="/a_090200/">保亭</a></dd>
   <dd><a href="/a_090300/">昌江</a></dd>
   <dd><a href="/a_090400/">澄迈县</a></dd>
   <dd><a href="/a_090500/">儋州市</a></dd>
   <dd><a href="/a_090600/">定安县</a></dd>
   <dd><a href="/a_090700/">东方</a></dd>
   <dd><a href="/a_090800/">海口市</a></dd>
   <dd><a href="/a_090900/">乐东</a></dd>
   <dd><a href="/a_091000/">临高县</a></dd>
   <dd><a href="/a_091100/">陵水</a></dd>
   <dd><a href="/a_091200/">琼海</a></dd>
   <dd><a href="/a_091300/">琼中</a></dd>
   <dd><a href="/a_091400/">三亚市</a></dd>
   <dd><a href="/a_091500/">通什市</a></dd>
   <dd><a href="/a_091600/">屯昌县</a></dd>
   <dd><a href="/a_091700/">万宁</a></dd>
   <dd><a href="/a_091800/">文昌</a></dd>
   <dd><a href="/a_091900/">五指山</a></dd>
   </dl>
   </li>
   <li><a href="/a_10/">河北省</a>
   <dl>
   <dd><a href="/a_100100/">保定市</a></dd>
   <dd><a href="/a_100200/">泊头市</a></dd>
   <dd><a href="/a_100300/">沧州市</a></dd>
   <dd><a href="/a_100400/">承德市</a></dd>
   <dd><a href="/a_100500/">定州市</a></dd>
   <dd><a href="/a_100600/">邯郸市</a></dd>
   <dd><a href="/a_100700/">衡水市</a></dd>
   <dd><a href="/a_100800/">廊坊市</a></dd>
   <dd><a href="/a_100900/">南宫市</a></dd>
   <dd><a href="/a_101000/">秦皇岛市</a></dd>
   <dd><a href="/a_101100/">任丘市</a></dd>
   <dd><a href="/a_101200/">沙河市</a></dd>
   <dd><a href="/a_101300/">石家庄市</a></dd>
   <dd><a href="/a_101400/">唐山市</a></dd>
   <dd><a href="/a_101500/">辛集市</a></dd>
   <dd><a href="/a_101600/">邢台市</a></dd>
   <dd><a href="/a_101700/">张家口市</a></dd>
   <dd><a href="/a_101800/">涿州市</a></dd>
   </dl>
   </li>
   <li><a href="/a_11/">河南省</a>
   <dl>
   <dd><a href="/a_110100/">安阳市</a></dd>
   <dd><a href="/a_110200/">鹤壁市</a></dd>
   <dd><a href="/a_110300/">济源</a></dd>
   <dd><a href="/a_110400/">焦作市</a></dd>
   <dd><a href="/a_110500/">开封市</a></dd>
   <dd><a href="/a_110600/">漯河市</a></dd>
   <dd><a href="/a_110700/">洛阳市</a></dd>
   <dd><a href="/a_110800/">南阳市</a></dd>
   <dd><a href="/a_110900/">平顶山市</a></dd>
   <dd><a href="/a_111000/">濮阳市</a></dd>
   <dd><a href="/a_111100/">三门峡市</a></dd>
   <dd><a href="/a_111200/">商丘市</a></dd>
   <dd><a href="/a_111300/">新乡市</a></dd>
   <dd><a href="/a_111400/">信阳市</a></dd>
   <dd><a href="/a_111500/">许昌市</a></dd>
   <dd><a href="/a_111600/">义马市</a></dd>
   <dd><a href="/a_111700/">郑州市</a></dd>
   <dd><a href="/a_111800/">周口市</a></dd>
   <dd><a href="/a_111900/">驻马店市</a></dd>
   </dl>
   </li>
   <li><a href="/a_12/">黑龙江省</a>
   <dl>
   <dd><a href="/a_120100/">阿城市</a></dd>
   <dd><a href="/a_120200/">北安市</a></dd>
   <dd><a href="/a_120300/">大庆市</a></dd>
   <dd><a href="/a_120400/">大兴安岭</a></dd>
   <dd><a href="/a_120500/">哈尔滨市</a></dd>
   <dd><a href="/a_120600/">鹤岗市</a></dd>
   <dd><a href="/a_120700/">黑河市</a></dd>
   <dd><a href="/a_120800/">鸡西市</a></dd>
   <dd><a href="/a_120900/">佳木斯市</a></dd>
   <dd><a href="/a_121000/">牡丹江市</a></dd>
   <dd><a href="/a_121100/">七台河市</a></dd>
   <dd><a href="/a_121200/">齐齐哈尔市</a></dd>
   <dd><a href="/a_121300/">双鸭山市</a></dd>
   <dd><a href="/a_121400/">绥汾河市</a></dd>
   <dd><a href="/a_121500/">绥化市</a></dd>
   <dd><a href="/a_121600/">同江市</a></dd>
   <dd><a href="/a_121700/">五大连池市</a></dd>
   <dd><a href="/a_121800/">伊春市</a></dd>
   <dd><a href="/a_121900/">肇东市</a></dd>
   </dl>
   </li>

</ul>
</div>
<script type=text/javascript>
function onload() {
    try{
var lies = document.getElementById("area").getElementsByTagName("li");
for (var i=0; i< lies.length; i++) {
    lies[i].onmouseover= function() {
    this.className="lion";
    }
    lies[i].onmouseout= function() {
    this.className="";
    }
}
}
catch(e){}
}
onload();
</script>
</body>
</html>

仿淘宝字母分类

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Untitled Document</title>
<style type="text/css">
body{font-size:12px;position:relative;font-family:Verdana, Geneva, sans-serif;}
a{color:blue;}
ul{margin:0;padding:0;list-style:none;}
#navigation{height:26px;}
#navigation li{float:left;}
#navigation li.show .content{display:block;}
#navigation li a,#navigation li span{display:inline-block;border:solid 1px #fff;border-bottom:none;height:26px;padding:0 6px;line-height:20px;overflow:hidden}
#navigation li a:hover,#navigation li.show a.index{background:#DBF3FE;border-color:#0a0;position:relative;top:0px;z-index:2;}
#container{position:relative;width:800px;margin:50px;}
#navigation li .content{position:absolute;left:0;top:26px;background:#DBF3FE;border:solid 1px #0a0;width:760px;padding:20px;display:none;}
#navigation li .content ul li{margin-right:10px;float:none;display:inline;}
#navigation li .content ul li a{border:none;}
#navigation li .content ul li{width:120px;}
#navigation li .content ul li h3{clear:both;text-align:left;}
</style>
</head>
<body>
<div id="container">
    <ul id="navigation">
        <li><span>拼音索引</span></li>
        <li>
            <a href="#" class="index">A</a>
            <div class="content">
                <h3>阿里山</h3>
                <ul>
                    <li><a href="#">阿里山</a></li>
                    <li><a href="#">阿里山</a></li>
                    <li><a href="#">阿里山</a></li>
                    <li><a href="#">阿里山</a></li>
                    <li><a href="#">阿里山</a></li>
                    <li><a href="#">阿里山</a></li>
                </ul>
                <h3>阿里山</h3>
                <ul>
                    <li><a href="#">阿里山</a></li>
                    <li><a href="#">阿里山</a></li>
                    <li><a href="#">阿里山</a></li>
                    <li><a href="#">阿里山</a></li>
                </ul>
            </div>
        </li>
        <li>
            <a href="#" class="index">B</a>
            <div class="content">
                <h3>棒棒糖</h3>
                <ul>
                    <li><a href="#">棒棒糖</a></li>
                    <li><a href="#">棒棒糖</a></li>
                    <li><a href="#">棒棒糖</a></li>
                    <li><a href="#">棒棒糖</a></li>
                    <li><a href="#">棒棒糖</a></li>
                    <li><a href="#">棒棒糖</a></li>
                </ul>
                <h3>棒棒糖</h3>
                <ul>
                    <li><a href="#">棒棒糖</a></li>
                    <li><a href="#">棒棒糖</a></li>
                    <li><a href="#">棒棒糖</a></li>
                    <li><a href="#">棒棒糖</a></li>
                </ul>
            </div>
        </li>
        <li><a href="#" class="index">C</a><div class="content">C</div></li>
        <li><a href="#" class="index">D</a><div class="content">D</div></li>
        <li><a href="#" class="index">E</a><div class="content">E</div></li>
        <li><a href="#" class="index">F</a><div class="content">F</div></li>
        <li><a href="#" class="index">G</a><div class="content">G</div></li>
        <li><a href="#" class="index">H</a><div class="content">H</div></li>
        <li><a href="#" class="index">I</a><div class="content">I</div></li>
        <li><a href="#" class="index">J</a><div class="content">J</div></li>
        <li><a href="#" class="index">K</a><div class="content">K</div></li>
        <li><a href="#" class="index">L</a><div class="content">L</div></li>
        <li><a href="#" class="index">M</a><div class="content">M</div></li>
        <li><a href="#" class="index">N</a><div class="content">N</div></li>
        <li><a href="#" class="index">O</a><div class="content">O</div></li>
        <li><a href="#" class="index">P</a><div class="content">P</div></li>
        <li><a href="#" class="index">Q</a><div class="content">Q</div></li>
        <li><a href="#" class="index">R</a><div class="content">R</div></li>
        <li><a href="#" class="index">S[sh]</a><div class="content">S</div></li>
        <li><a href="#" class="index">T</a><div class="content">T</div></li>
        <li><a href="#" class="index">U</a><div class="content">U</div></li>
        <li><a href="#" class="index">V</a><div class="content">V</div></li>
        <li><a href="#" class="index">W</a><div class="content">W</div></li>
        <li><a href="#" class="index">X</a><div class="content">X</div></li>
        <li><a href="#" class="index">Y</a><div class="content">Y</div></li>
        <li><a href="#" class="index">Z[zh]</a><div class="content">Z</div></li>
    </ul>
</div>
</body>
</html>
<script type="text/javascript">
function showAjaxContent(){
    var obj=document.getElementById("navigation");
    var liObj=obj.getElementsByTagName("li");
    var length=liObj.length;
    var currentLiObj;
    for(var i=0;i<length;i++){
        currentLiObj=liObj[i];
        if(currentLiObj.parentNode!=obj){continue;}
        //然后循环添加事件
        currentLiObj.onmouseover=function(){
            if(this.className.indexOf("show")<0){
                this.className+=" show";
            }
            clearStyle(this);
        }        
        currentLiObj.onmouseout=function(){
            this.className=this.className.replace("show","");
            clearStyle(this);
        }
    }
    function clearStyle(obj){
        for(var i=0;i<length;i++){
            currentLiObj=liObj[i];
            if(obj!=currentLiObj){
                currentLiObj.className=currentLiObj.className.replace("show","");
            }
        }
    }
}
showAjaxContent();
</script>

mailto的用法

如果要使用mailto同时实现多个功能的话,第一个功能必须以“?”开头,后面的每一个功能都以“&”开头;另外,cc后为抄送地址,bcc后为暗送地址,subject后为邮件的主题,body后为邮件的内容。

注册按钮在倒计时后才可以点击的效果

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>注册按钮在倒计时后才可以点击的效果</title>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
<input type="submit" name="Submit" value="同意" />
</form>
<script language="javascript">
document.form1.Submit.disabled = true;
var speed = 1000; //速度
var wait = 10; //停留时间
function updateinfo(){
if(wait == 0){
    document.form1.Submit.value = "我同意";
    document.form1.Submit.disabled = false;
}
else{
    document.form1.Submit.value = "阅读条款"+wait;
    wait–;
    window.setTimeout("updateinfo()",speed);
}
}
updateinfo();
</script>
</body>

</html>

屏蔽按键

//屏蔽按键
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<noscript><meta http-equiv="refresh" content="0;url=about:noscript"></noscript>
<title>屏蔽鼠标右键、Ctrl+N、Shift+F10、Alt+F4、F11、F5刷新、退格键</title>
</head>
<body>
<script language="Javascript">
//屏蔽鼠标右键、Ctrl+N、Shift+F10、F11、F5刷新、退格键
//Author: meizz(梅花雨) 2002-6-18
function document.oncontextmenu(){event.returnValue=false;}//屏蔽鼠标右键
function window.onhelp(){return false} //屏蔽F1帮助
function document.onkeydown()
{
if ((window.event.altKey)&&
      ((window.event.keyCode==37)||   //屏蔽 Alt+ 方向键 ←
       (window.event.keyCode==39)))   //屏蔽 Alt+ 方向键 →
{
     alert("不准你使用ALT+方向键前进或后退网页!");
     event.returnValue=false;
}
     /* 注:这还不是真正地屏蔽 Alt+ 方向键,
     因为 Alt+ 方向键弹出警告框时,按住 Alt 键不放,
     用鼠标点掉警告框,这种屏蔽方法就失效了。以后若
     有哪位高手有真正屏蔽 Alt 键的方法,请告知。*/
if ((event.keyCode==8) ||                 //屏蔽退格删除键
      (event.keyCode==116)||                 //屏蔽 F5 刷新键
      (event.ctrlKey && event.keyCode==82)){ //Ctrl + R
     event.keyCode=0;
     event.returnValue=false;
     }
if (event.keyCode==122){event.keyCode=0;event.returnValue=false;} //屏蔽F11
if (event.ctrlKey && event.keyCode==78) event.returnValue=false;   //屏蔽 Ctrl+n
if (event.shiftKey && event.keyCode==121)event.returnValue=false; //屏蔽 shift+F10
if (window.event.srcElement.tagName == "A" && window.event.shiftKey)
      window.event.returnValue = false;             //屏蔽 shift 加鼠标左键新开一网页
if ((window.event.altKey)&&(window.event.keyCode==115))             //屏蔽Alt+F4
{
      window.showModelessDialog("about:blank","","dialogWidth:1px;dialogheight:1px");
      return false;
}
}
</script>
屏蔽鼠标右键、Ctrl+N、Shift+F10、Alt+F4、F11、F5刷新、退格键
</body>
</html>
//屏蔽打印
<style>
@media print{ * {display:none}
}
</style>

js图片轮播

<html>
<body>
<script>
/**************************************************
名称: 图片轮播类
创建时间: 2007-11-12
示例:
页面中已经存在名为imgPlayer(或者别的ID也行)的节点.
PImgPlayer.addItem( "test", "http://www.pomoho.com", "http://static.pomoho.com/static/samesong/images/logo5.jpg");
PImgPlayer.addItem( "test2", "http://www.pomoho.com.cn", "http://static.pomoho.com/static/samesong/images/logo4.jpg");
PImgPlayer.addItem( "test3", "http://www.pomoho.com.cn", "http://static.pomoho.com/static/samesong/images/logo3.jpg");
PImgPlayer.init( "imgPlayer", 200, 230 );
备注:
适用于一个页面只有一个图片轮播的地方.
***************************************************/
var PImgPlayer = {
_timer : null,
_items : [],
_container : null,
_index : 0,
_imgs : [],
intervalTime : 5000, //轮播间隔时间
init : function( objID, w, h, time ){
this.intervalTime = time || this.intervalTime;
this._container = document.getElementById( objID );
this._container.style.display = "block";
this._container.style.width = w + "px";
this._container.style.height = h + "px";
this._container.style.position = "relative";
this._container.style.overflow = "hidden";
//this._container.style.border = "1px solid #fff";
var linkStyle = "display: block; TEXT-DECORATION: none;";
if( document.all ){
   linkStyle += "FILTER:";
   linkStyle += "progid:DXImageTransform.Microsoft.Barn(duration=0.5, motion=’out’, orientation=’vertical’) ";
   linkStyle += "progid:DXImageTransform.Microsoft.Barn ( duration=0.5,motion=’out’,orientation=’horizontal’) ";
   linkStyle += "progid:DXImageTransform.Microsoft.Blinds ( duration=0.5,bands=10,Direction=’down’ )";
   linkStyle += "progid:DXImageTransform.Microsoft.CheckerBoard()";
   linkStyle += "progid:DXImageTransform.Microsoft.Fade(duration=0.5,overlap=0)";
   linkStyle += "progid:DXImageTransform.Microsoft.GradientWipe ( duration=1,gradientSize=1.0,motion=’reverse’ )";
   linkStyle += "progid:DXImageTransform.Microsoft.Inset ()";
   linkStyle += "progid:DXImageTransform.Microsoft.Iris ( duration=1,irisStyle=PLUS,motion=out )";
   linkStyle += "progid:DXImageTransform.Microsoft.Iris ( duration=1,irisStyle=PLUS,motion=in )";
   linkStyle += "progid:DXImageTransform.Microsoft.Iris ( duration=1,irisStyle=DIAMOND,motion=in )";
   linkStyle += "progid:DXImageTransform.Microsoft.Iris ( duration=1,irisStyle=SQUARE,motion=in )";
   linkStyle += "progid:DXImageTransform.Microsoft.Iris ( duration=0.5,irisStyle=STAR,motion=in )";
   linkStyle += "progid:DXImageTransform.Microsoft.RadialWipe ( duration=0.5,wipeStyle=CLOCK )";
   linkStyle += "progid:DXImageTransform.Microsoft.RadialWipe ( duration=0.5,wipeStyle=WEDGE )";
   linkStyle += "progid:DXImageTransform.Microsoft.RandomBars ( duration=0.5,orientation=horizontal )";
   linkStyle += "progid:DXImageTransform.Microsoft.RandomBars ( duration=0.5,orientation=vertical )";
   linkStyle += "progid:DXImageTransform.Microsoft.RandomDissolve ()";
   linkStyle += "progid:DXImageTransform.Microsoft.Spiral ( duration=0.5,gridSizeX=16,gridSizeY=16 )";
   linkStyle += "progid:DXImageTransform.Microsoft.Stretch ( duration=0.5,stretchStyle=PUSH )";
   linkStyle += "progid:DXImageTransform.Microsoft.Strips ( duration=0.5,motion=rightdown )";
   linkStyle += "progid:DXImageTransform.Microsoft.Wheel ( duration=0.5,spokes=8 )";
   linkStyle += "progid:DXImageTransform.Microsoft.Zigzag ( duration=0.5,gridSizeX=4,gridSizeY=40 ); width: 100%; height: 100%";
}
//
var ulStyle = "margin:0;width:"+w+"px;position:absolute;z-index:999;right:5px;FILTER:Alpha(Opacity=30,FinishOpacity=90, Style=1);overflow: hidden;bottom:-1px;height:16px; border-right:1px solid #fff;";
//
var liStyle = "margin:0;list-style-type: none; margin:0;padding:0; float:right;";
//
var baseSpacStyle = "clear:both; display:block; width:23px;line-height:18px; font-size:12px; FONT-FAMILY:’宋体';opacity: 0.6;";
baseSpacStyle += "border:1px solid #fff;border-right:0;border-bottom:0;";
baseSpacStyle += "color:#fff;text-align:center; cursor:pointer; ";
//
var ulHTML = "";
for(var i = this._items.length -1; i >= 0; i–){
   var spanStyle = "";
   if( i==this._index ){
    spanStyle = baseSpacStyle + "background:#ff0000;";
   } else {   
    spanStyle = baseSpacStyle + "background:#000;";
   }
   ulHTML += "<li style=\""+liStyle+"\">";
   ulHTML += "<span onmouseover=\"PImgPlayer.mouseOver(this);\" onmouseout=\"PImgPlayer.mouseOut(this);\" style=\""+spanStyle+"\" onclick=\"PImgPlayer.play("+i+");return false;\" herf=\"javascript:;\" title=\"" + this._items[i].title + "\">" + (i+1) + "</span>";
   ulHTML += "</li>";
}
//
var html = "<a href=\""+this._items[this._index].link+"\" title=\""+this._items[this._index].title+"\" target=\"_blank\" style=\""+linkStyle+"\"></a><ul style=\""+ulStyle+"\">"+ulHTML+"</ul>";
this._container.innerHTML = html;
var link = this._container.getElementsByTagName("A")[0];
link.style.width = w + "px";
link.style.height = h + "px";
link.style.background = ‘url(‘ + this._items[0].img + ‘) no-repeat center center';
//
this._timer = setInterval( "PImgPlayer.play()", this.intervalTime );
},
addItem : function( _title, _link, _imgURL ){
this._items.push ( {title:_title, link:_link, img:_imgURL } );
var img = new Image();
img.src = _imgURL;
this._imgs.push( img );
},
play : function( index ){
if( index!=null ){
   this._index = index;
   clearInterval( this._timer );
   this._timer = setInterval( "PImgPlayer.play()", this.intervalTime );
} else {
   this._index = this._index<this._items.length-1 ? this._index+1 : 0;
}
var link = this._container.getElementsByTagName("A")[0];
if(link.filters){
   var ren = Math.floor(Math.random()*(link.filters.length));
   link.filters[ren].Apply();
   link.filters[ren].play();
}
link.href = this._items[this._index].link;
link.title = this._items[this._index].title;
link.style.background = ‘url(‘ + this._items[this._index].img + ‘) no-repeat center center';
//
var liStyle = "margin:0;list-style-type: none; margin:0;padding:0; float:right;";
var baseSpacStyle = "clear:both; display:block; width:23px;line-height:18px; font-size:12px; FONT-FAMILY:’宋体'; opacity: 0.6;";
baseSpacStyle += "border:1px solid #fff;border-right:0;border-bottom:0;";
baseSpacStyle += "color:#fff;text-align:center; cursor:pointer; ";
var ulHTML = "";
for(var i = this._items.length -1; i >= 0; i–){
   var spanStyle = "";
   if( i==this._index ){
    spanStyle = baseSpacStyle + "background:#ff0000;";
   } else {   
    spanStyle = baseSpacStyle + "background:#000;";
   }
   ulHTML += "<li style=\""+liStyle+"\">";
   ulHTML += "<span onmouseover=\"PImgPlayer.mouseOver(this);\" onmouseout=\"PImgPlayer.mouseOut(this);\" style=\""+spanStyle+"\" onclick=\"PImgPlayer.play("+i+");return false;\" herf=\"javascript:;\" title=\"" + this._items[i].title + "\">" + (i+1) + "</span>";
   ulHTML += "</li>";
}
this._container.getElementsByTagName("UL")[0].innerHTML = ulHTML;
},
mouseOver : function(obj){
var i = parseInt( obj.innerHTML );
if( this._index!=i-1){
   obj.style.color = "#ff0000";
}
},
mouseOut : function(obj){
obj.style.color = "#fff";
}
}
</script>
<div id="imgADPlayer"></div>
<script>
PImgPlayer.addItem( "test", "http://www.pomoho.com", "http://static.pomoho.com/static/samesong/images/logo5.jpg");
PImgPlayer.addItem( "test2", "http://www.pomoho.com", "http://static.pomoho.com/static/samesong/images/logo4.jpg");
PImgPlayer.addItem( "test3", "http://www.pomoho.com", "http://static.pomoho.com/static/samesong/images/logo3.jpg");
PImgPlayer.init( "imgADPlayer", 200, 230 );
</script>
</body>
</html>

单选框复选框

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css" media="all">
label{
cursor:pointer;
font-size:12px;
margin:0px 2px 0px 0px;
color:#2B86BD;
}
.d0{
margin-bottom:30px;
}
.d0 input{
cursor:pointer;
margin:0px;
padding:0px 2px;
}
</style>
<script language="javascript" type="text/javascript">
var dr=document.getElementsByTagName("div"),i,t="";
function submit1(num,type){
t="";
var dri=dr[num].getElementsByTagName("input");
for(i=0;i<dri.length;i++){
if(dri[i].checked){
if(type==0){
alert(dri[i].value);
break;
}else{
t=t+dri[i].value+";";
}
}
}
if(type==1) alert(t);
}
//ChangeSelect
submit1.allselect=function(){
var drc=dr[1].getElementsByTagName("input");
for(i=0;i<drc.length;i++){
drc[i].checked=true;
}
}
//allNot
submit1.allNot=function(){
var drc=dr[1].getElementsByTagName("input");
for(i=0;i<drc.length;i++){
drc[i].checked=false;
}
}
//reverse
submit1.reverseSelect=function(){
var drc=dr[1].getElementsByTagName("input");
for(i=0;i<drc.length;i++){
if(drc[i].checked){
drc[i].checked=false;
}else{
drc[i].checked=true;
}
}
}
</script>
<title>js获取单选框、复选框的值及操作</title>
</head>
<body>
<div class="d0">
<input type="radio" name="day" id="r0" value="前天"/><label for="r0">前天</label>
<input type="radio" name="day" id="r1" value="昨天"/><label for="r1">昨天</label>
<input type="radio" name="day" id="r2" checked="checked" value="今天"/><label for="r2">今天</label>
<input type="radio" name="day" id="r3" value="明天"/><label for="r3">明天</label>
<input type="radio" name="day" id="r4" value="后天"/><label for="r4">后天</label>
<button type="button" onclick="submit1(0,0)" >提交</button>
</div>
<div>
<input type="checkbox" value="前年"/><label>前年</label>
<input type="checkbox" value="去年"/><label>去年</label>
<input type="checkbox" value="今年"/><label>今年</label>
<input type="checkbox" value="明年"/><label>明年</label>
<input type="checkbox" value="后年"/><label>后年</label>
<button type="button" onclick="submit1(1,1)" >提交</button>
<button type="button" onclick="submit1.allselect()" >全选</button>
<button type="button" onclick="submit1.reverseSelect()" >反选</button>
<button type="button" onclick="submit1.allNot()" >全不选</button>
</div>
</body>
</html>

js弹出层代码

<html>
<head>
<title>LIGHTBOX EXAMPLE</title>
<style>
.black_overlay{ display: none; position: absolute; top: 0%; left: 0%; width: 100%; height: 100%; background-color: black; z-index:1001; -moz-opacity: 0.8; opacity:.80; filter: alpha(opacity=80); } .white_content { display: none; position: absolute; top: 25%; left: 25%; width: 50%; height: 50%; padding: 16px; border: 16px solid orange; background-color: white; z-index:1002; overflow: auto; } </style>
</head>
<body>
可以根据自己要求修改css样式<a href="javascript:void(0)" onclick="document.getElementById(‘light’).style.display=’block';document.getElementById(‘fade’).style.display=’block’">点击这里打开窗口</a>
<div id="light" class="white_content">
    This is the lightbox content.
    <a href="javascript:void(0)" onclick="document.getElementById(‘light’).style.display=’none';document.getElementById(‘fade’).style.display=’none’">
    Close</a></div>
<div id="fade" class="black_overlay">
</div>
</body>
</html>

模仿IE自动完成功能,读取输入框存取记录

<HTML>
<HEAD>

<title>模仿IE自动完成功能,读取输入框存取记录</title>
<style>
body,div {
font-family:verdana;
line-height:100%;
font-size:9pt;
}
input {
width:300px;
}
h1 {
text-align:center;
font-size:2.2em;
}
#divf {
margin:10px;
font-size:0.8em;
text-align:center;
}
#divc {
border:1px solid #333333;
}
.des {
width:500px;
background-color:lightyellow;
border:1px solid #333;
padding:20px;
margin-top:20px;
}
.mouseover {
color:#ffffff;
background-color:highlight;
width:100%;
cursor:default;
}
.mouseout {
color:#000000;
width:100%;
background-color:#ffffff;
cursor:default;
}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!–

// script by blueDestiny
// email : blueDestiny [at] 126 . com

// Object: jsAuto
// browser: ie, mf.
// example:

// step1 :
// create autocomplete container, return object and bind event to the object, and
///create a new jsAuto instance:
// <div id="divautocomplete"></div>
// var autocomplete = new jsAuto("autocomplete","divautocomplete")
// handle event:
// autocomplete.handleEvent(value, returnObjectID)
// <input id="rautocomplete" onkeyup="autocomplete.handleEvent(this.value,"ratocomplete",event)>

// step2 :
// add autocompete item:
// autocomplete.item(string)
// string must be a string var, you can split the string by ","
// autocomplete.item("blueDestiny,never-online,csdn,blueidea")

// http://www.never-online.com

function jsAuto(instanceName,objID)
{
this._msg = [];
this._x = null;
this._o = document.getElementById( objID );
if (!this._o) return;
this._f = null;
this._i = instanceName;
this._r = null;
this._c = 0;
this._s = false;
this._v = null;
this._o.style.visibility = "hidden";
this._o.style.position = "absolute";
this._o.style.zIndex = "9999";
this._o.style.overflow = "auto";
this._o.style.height = "50";
return this;
};

jsAuto.prototype.directionKey=function() { with (this)
{
var e = _e.keyCode ? _e.keyCode : _e.which;
var l = _o.childNodes.length;
(_c>l-1 || _c<0) ? _s=false : "";

if( e==40 && _s )
{
_o.childNodes[_c].className="mouseout";
(_c >= l-1) ? _c=0 : _c ++;
_o.childNodes[_c].className="mouseover";
}
if( e==38 && _s )
{
_o.childNodes[_c].className="mouseout";
_c–<=0 ? _c = _o.childNodes.length-1 : "";
_o.childNodes[_c].className="mouseover";
}
if( e==13 )
{
if(_o.childNodes[_c] && _o.style.visibility=="visible")
{
   _r.value = _x[_c];
   _o.style.visibility = "hidden";
}
}
if( !_s )
{
_c = 0;
_o.childNodes[_c].className="mouseover";
_s = true;
}
}};

// mouseEvent.
jsAuto.prototype.domouseover=function(obj) { with (this)
{
_o.childNodes[_c].className = "mouseout";
_c = 0;
obj.tagName=="DIV" ? obj.className="mouseover" : obj.parentElement.className="mouseover";
}};
jsAuto.prototype.domouseout=function(obj)
{
obj.tagName=="DIV" ? obj.className="mouseout" : obj.parentElement.className="mouseout";
};
jsAuto.prototype.doclick=function(msg) { with (this)
{
if(_r)
{
_r.value = msg;
_o.style.visibility = "hidden";
}
else
{
alert("javascript autocomplete ERROR :nn can not get return object.");
return;
}
}};

// object method;
jsAuto.prototype.item=function(msg)
{
if( msg.indexOf(",")>0 )
{
var arrMsg=msg.split(",");
for(var i=0; i<arrMsg.length; i++)
{
   arrMsg[i] ? this._msg.push(arrMsg[i]) : "";
}
}
else
{
this._msg.push(msg);
}
this._msg.sort();
};
jsAuto.prototype.append=function(msg) { with (this)
{
_i ? "" : _i = eval(_i);
_x.push(msg);
var div = document.createElement("DIV");

//bind event to object.
div.onmouseover = function(){_i.domouseover(this)};
div.onmouseout = function(){_i.domouseout(this)};
div.onclick = function(){_i.doclick(msg)};
var re = new RegExp("(" + _v + ")","i");
div.style.lineHeight="140%";
div.className = "mouseout";
if (_v) div.innerHTML = msg.replace(re , "<strong>$1</strong>");
div.style.fontFamily = "verdana";

_o.appendChild(div);
}};
jsAuto.prototype.display=function() { with(this)
{
if(_f&&_v!="")
{
_o.style.left = _r.offsetLeft;
_o.style.width = _r.offsetWidth;
_o.style.top = _r.offsetTop + _r.offsetHeight;
_o.style.visibility = "visible";
}
else
{
_o.style.visibility="hidden";
}
}};
jsAuto.prototype.handleEvent=function(fValue,fID,event) { with (this)
{
var re;
_e = event;
var e = _e.keyCode ? _e.keyCode : _e.which;
_x = [];
_f = false;
_r = document.getElementById( fID );
_v = fValue;
_i = eval(_i);
re = new RegExp("^" + fValue + "", "i");
_o.innerHTML="";

for(var i=0; i<_msg.length; i++)
{
if(re.test(_msg[i]))
{
   _i.append(_msg[i]);
   _f = true;
}
}

_i ? _i.display() : alert("can not get instance");

if(_f)
{
if((e==38 || e==40 || e==13))
{
   _i.directionKey();
}
else
{
   _c=0;
   _o.childNodes[_c].className = "mouseover";
   _s=true;
}
}
}};
window.onerror=new Function("return true;");
//–>
</SCRIPT>
</HEAD>

<BODY>
<div id="divc">
<!–this is the autocomplete container.–>
</div>
<h1>Autocomplete Function</h1>
<div align="center">
<input onkeyup="jsAutoInstance.handleEvent(this.value,’auto’,event)" id="auto">
</div>
<div id="divf">
Power By Miracle, never-online
</div>

<SCRIPT LANGUAGE="JavaScript">
<!–
var jsAutoInstance = new jsAuto("jsAutoInstance","divc");
jsAutoInstance.item("a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start,a-start,b-start,c-start,d-start,e-start,f-start,g-start,h-start,i-start,j-start,k-start,l-start,m-start,n-start,o-start,p-start,q-start,r-start,s-start,t-start,u-start,v-start,w-start,x-start,y-start,z-start,z-start");
jsAutoInstance.item("blueDestiny");
jsAutoInstance.item("BlueMiracle,Blue");
jsAutoInstance.item("angela,geniuslau");
jsAutoInstance.item("never-online");
//–>
</SCRIPT>
<center>请随便输入一个字母看看 -_-</center>
</BODY>
</HTML>

图片切换效果

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
#Layer2 {position:absolute;width:302px;height:115px;z-index:2;top: 350px;left: 0px;}
#Layer4 {position:absolute;width:280px;height:400px;z-index:1;top: 0px;left: 9px;}
#Layer5 {position:absolute;width:200px;height:115px;z-index:2;}
#Layer6 {position:absolute;width:302px;height:488px;z-index:3;}
</style>
<link href="http://et.21cn.com/new/images/2007et.css" rel="stylesheet" type="text/css">
<link href="http://www.21cn.com/other/nav/common.css" rel="stylesheet" type="text/css" />
</head>

<body>

<table width="302" height="488" border="0" cellpadding="0" cellspacing="0" background="http://et.21cn.com/new/images/p14.gif">
          <tr>
            <td valign="top"><div id="Layer6">
                <div id="Layer4">
                  <TABLE cellSpacing=0 width=280>
                    <TBODY>
                      <TR>
                        <TD
                vAlign=top bgcolor="#000000" style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px"><SCRIPT language=javascript type=text/javascript>
      <!–
/* Data begin */
var sPicArr = new Array();
sPicArr[0] = new Array(
"http://img001.photo.21cn.com/photos/album/20080714/o/F3CA1566542B80C1B17AB9C4754EAB23.jpg",
"谢霆锋秀与柏芝甜蜜照",
"  为免相机中的私密照外泄,霆锋将电脑交助手保管,并禁止记者拍照……",
"http://et.21cn.com/star/zhuixing/gangtai/2008/07/14/4941883.shtml"
);
sPicArr[3]= new Array(
"http://img001.photo.21cn.com/photos/album/20080714/o/CD18BA12BC72B44822C6B7C0E5A965D0.jpg",
"张韶涵爆肥6公斤面目全非",
"  一向骨感的张韶涵变胖了,不仅小腹变凸、手臂变粗、就连下巴都多了一圈肉……",
"http://et.21cn.com/picture/"
);
sPicArr[1] = new Array(
"http://img001.photo.21cn.com/photos/album/20080714/o/AAF5F6F6901E77524F013A946461C087.jpg",
"魔幻片《画皮》时代背景定汉朝",
"  即将于9月28日上映的东方新魔幻电影《画皮》,日前又曝光新剧照……",
"http://et.21cn.com/movie/"
);
sPicArr[2] = new Array(
"http://img001.photo.21cn.com/photos/album/20080714/o/2B2C45247DE4DF8E08A54E2D995F2C68.jpg",
"新《红楼》湘云宝琴香菱薛蟠亮相",
"  新《红楼梦》再公布4个角色造型:香菱、薛蟠、大小薛宝琴、大小史湘云……",
"http://et.21cn.com/tv/"
);
sPicArr[4]= new Array(
"http://img001.photo.21cn.com/photos/album/20080714/o/878C85EA8AB7CA406E87756891D5FF0C.jpg",
"勇敢“出柜”的同性恋明星",
"  “出柜”是同性恋圈子中的专有名词,意思是向公众公开自己的同性恋取向……",
"http://et.21cn.com/show/"
);
/* Data end */
function GetObj(objName){
if(document.getElementById){
return eval(‘document.getElementById("’ + objName + ‘")’);
}else if(document.layers){
return eval("document.layers[‘" + objName +"’]");
}else{
return eval(‘document.all.’ + objName);
}
}
var plPic = new Image();
var gIndex = 0;
function SlidePic(index){
gIndex = index;
//patch by dorian 1017
if (‘Microsoft Internet Explorer’ == navigator.appName)
{
document.images["slidePic"].filters.item(0).Apply();
}
document.images["slidePic"].src = sPicArr[index][0];
document.images["slidePic"].alt = sPicArr[index][1];
GetObj("slidePicLink").href = sPicArr[index][3];
GetObj("slideTitle").innerHTML = sPicArr[index][1];
GetObj("slideDesc").innerHTML = sPicArr[index][2];
GetObj("slideLink").innerHTML = "[<a href=’"+sPicArr[index][3]+"’ target=_blank class=underline2 title=’全文’>全文</a>]";
if((index+1)<sPicArr.length) plPic.src = sPicArr[index+1][0];//preload;
for(var i=0;i<sPicArr.length;i++){
GetObj("item"+i).className = "itemOff";
GetObj("item"+i).onmouseover = function(){return false;}
GetObj("item"+i).onmouseout = function(){return false;}
}
GetObj("item"+index).className = "itemOn";
if (‘Microsoft Internet Explorer’ == navigator.appName)
{
document.images["slidePic"].filters.item(0).play();
}
}
function NextPic(){
gIndex = ((gIndex+1)>=sPicArr.length?0:(gIndex+1));
SlidePic(gIndex);
}
function PrevPic(){
//alert(gIndex);
gIndex = ((gIndex-1)<0?(sPicArr.length-1):(gIndex-1));
//alert(gIndex);
SlidePic(gIndex);
}
var sid;
function inislide()
{
if(sid==null) sid = setInterval(‘NextPic()’, 3000);//fixed by AmourGUO, 051017
}
function pauseslide()
{
clearInterval(sid);
sid = null;
}
//–>
          </SCRIPT> </TD>
                      </TR>
                    </TBODY>
                  </TABLE>
                  <TABLE width=280 height="400" align="center" cellSpacing=0>
                    <TBODY>
                      <TR>
                        <TD height=400
                align=middle valign="top"
                style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px"><A id=slidePicLink
                  title="" href="http://et.21cn.com/"
                  target=_blank><IMG id=slidePic onmouseover=pauseslide();
      style="BORDER-RIGHT: #000000 4px solid; BORDER-TOP: #000000 3px solid; FILTER: progid:DXImageTransform.Microsoft.Wipe(GradientSize=1.0, wipeStyle=0, motion=forward); BORDER-LEFT: #000000 4px solid; BORDER-BOTTOM: #000000 4px solid"
                  onmouseout=inislide(); height=400 alt=""
                  src="#" width=272 border=0
                  name=slidePic></A> <SCRIPT>document.getElementById("slidePic").src=sPicArr[0][0];</SCRIPT>
                          <SCRIPT>document.getElementById("slidePicLink").href=sPicArr[0][3];</SCRIPT></TD>
                      </TR>
                      <TR> </TR>
                    </TBODY>
                  </TABLE>
                </div>
                <div id="Layer5">
                  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="302" height="488">
                    <param name="movie" value="http://et.21cn.com/new/images/bp.swf" />
                    <param name="quality" value="high" />
                    <param name="wmode" value="transparent">
                    <embed src="http://et.21cn.com/new/images/bp.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="302" height="488"></embed>
                  </object>
                </div>
                <div id="Layer2" >
                  <table width="270" border="0" align="center" cellpadding="0" cellspacing="0">
                    <tr>
                      <td height="24" class="link14bl3">劲爆星闻</td>
                    </tr>
                  </table>
                  <TABLE width=270 border="0" align=center cellpadding="0"
                  cellSpacing=0 onmouseover=pauseslide() onmouseout=inislide()>
                    <TR>
                      <TD align=left><IMG style="CURSOR: pointer"
                        onclick=PrevPic();pauseslide();inislide() height=17
                        alt=上一张 src="http://et.21cn.com/new/images/gw_news_img_05.gif"
                      width=7></TD>
                      <TD width=120><SCRIPT language=javascript type=text/javascript>
<!–
document.writeln("<table width=100% cellspacing=0>");
document.writeln("<tr>");
document.writeln("<td >&nbsp;</td>");
document.writeln("<td id=’item0′ width=11 height=11 class=itemOn onClick=’SlidePic(0)’>1</td>");
for(var i=1;i<sPicArr.length;i++){
document.writeln("<td>&nbsp;</td>");
document.writeln("<td id=’item"+i+"’ width=11 height=11 class=itemOff onClick=’SlidePic("+i+");’>"+(i+1)+"</td>");//fixed by AmourGUO, 051017
}
document.writeln("<td>&nbsp;</td>");
document.writeln("</tr>");
document.writeln("</table>");
//–>
            </SCRIPT></TD>
                      <TD align=left width=146><IMG style="CURSOR: pointer"
                        onclick=NextPic();pauseslide();inislide() height=17
                        alt=下一张 src="http://et.21cn.com/new/images/gw_news_img_06.gif"
                      width=7></TD>
                    </TR>
                  </TABLE>
                  <table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td height="9"></td>
                    </tr>
                  </table>
                  <TABLE width=270 align="center" cellSpacing=0>
                    <TBODY>
                    <TD class=left1 onmouseover=pauseslide(); onmouseout=inislide(); height=64><DIV class=link14w2   id=slideTitle
                  style="FONT-WEIGHT: bold">谢霆锋秀与柏芝甜蜜照</DIV>
                      <DIV class=underline3b   style="MARGIN-TOP: 7px"><SPAN
                  id=slideDesc>  为免相机中的私密照外泄,霆锋将电脑交助手保管,并禁止记者拍照……</SPAN> <SPAN
                  id=slideLink>[<A href="http://et.21cn.com/star/zhuixing/gangtai/2008/07/14/4941883.shtml"
                  target=_blank class="underline2" >全文</A>]</SPAN></DIV></TD>
                    </TR>
                  </TABLE>
                </div>
              </div></td>
          </tr>
        </table>

</body>
</html>