zoukankan      html  css  js  c++  java
  • 迅雷的flash图片幻灯片代码

    <!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" />
    <title>无标题文档</title>
    <style>
    .flashNews, .smallBox {position:relative;float:left;304px;margin-bottom:12px;overflow:hidden;border:1px solid #B6CAE3;}
    .firstNews, .mediumBox {position:relative;float:right;434px;margin-bottom:12px;overflow:hidden;border:1px solid #B6CAE3;}
     
    .flashNews, .smallBox {position:relative;float:left;304px;margin-bottom:12px;overflow:hidden;border:1px solid #B6CAE3;}
     
     
    .flashNews, .firstNews {height:270px;}
    .flashNews .bg {position:absolute;left:0;bottom:0;304px;height:73px;background:#000000;filter:alpha(opacity=39);-moz-opacity:0.39;opacity:0.39;}
    .flashNews h3 {position:absolute;left:10px;top:200px;284px;height:35px;line-height:35px;z-index:2;}
    .flashNews h3 a {font-size:20px;font-family:"黑体";font-weight:normal;color:#FFFFFF;}
    .flashNews h3 a:hover {color:#F20000;}
    .flashNews p {position:absolute;left:10px;top:230px;284px;height:20px;line-height:20px;;z-index:2;}
    .flashNews p a {color:#FFFFFF;}
    .flashNews p a:hover {color:#F20000;}
    .flashNews ul {position:absolute;right:0;bottom:0;padding-left:47px;_padding-left:46px;background:url(../img/flashPage_bg.png) 0 0 no-repeat;z-index:2;_background:none;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/flashPage_bg.png',sizingMethod='crop')}
    .flashNews ul li {float:left;15px;height:18px;line-height:18px;text-align:center;margin-left:1px;background:#000000;}
    .flashNews ul li a {display:block;15px;height:18px;font-size:10px;font-family:Tahoma;font-weight:bold;color:#FFFFFF;}
    .flashNews ul li a:hover, .flashNews ul li a.sel {color:#F20000;}
           
    .firstNews h3 {432px;height:27px;line-height:27px;text-indent:14px;font-size:12px;border:1px solid #FFFFFF;background:#F2F6FB;}
    .firstNews p {position:absolute;top:5px;right:5px;}
    .firstNews p a {font-size:12px;}
    .firstNews h4 {410px;height:25px;margin:0 auto;overflow:hidden;padding-top:12px;line-height:25px;font-weight:normal;font-size:18px;font-family:"黑体";}
    .firstNews ul {410px;height:auto;overflow:hidden;_zoom:1;margin:0 0 0 12px;}
    .firstNews ul li {position:relative;410px;height:22px;line-height:22px;overflow:hidden;text-indent:10px;font-size:14px;background:url(../img/pic_new.gif) -298px -141px no-repeat;}
     
     
    </style>
    <script>
     
    var MaxScreen = 4 ;
    var CurScreen = 1 ;
     
     
    function switchPic(screen) {
        if (screen > MaxScreen) {
            screen = 1 ;
        }
       
        for (i=1;i<=MaxScreen;i++) {
            //alert(i);
            document.getElementById("Switch_"+i).style.display = "none" ;
        }
        document.getElementById("Switch_"+screen).style.display = "block" ;
        showSwitchNav(screen);
        showSwitchTitle(screen);
        //Effect.Appear("Switch_"+screen);
               
        //switchLittlePic(screen);
        //showSwitchTitles(screen);
        CurScreen = screen  ;
    }
    function showSwitchNav(screen) {
        var NavStr = "" ;
        for (i=1;i<=MaxScreen;i++) {
            if (i == screen) {
                NavStr += '<li onmouseover="pauseSwitch();" onmouseout="goonSwitch();"><a href="javascript://" target="_self" class="sel">'+i+'</a></li>' ;
            }
            else {
                NavStr += '<li onmouseover="pauseSwitch();" onmouseout="goonSwitch();" onclick="goManSwitch('+i+');"><a href="javascript://" target="_self">'+i+'</a></li>' ;
            }
           
        }
        document.getElementById("SwitchNav").innerHTML = NavStr ;
    }
    function showSwitchTitle(screen) {
        var titlestr = "" ;
        titlestr = '<h3><a href="'+Switcher[screen]['link']+'" target="_blank">'+Switcher[screen]['title']+'</a></h3><p><a href="'+Switcher[screen]['link']+'" target="_blank">'+Switcher[screen]['stitle']+'</a></p>' ;
        document.getElementById("SwitchTitle").innerHTML = titlestr ;
    }
    function reSwitchPic() {
        refreshSwitchTimer = null;
        switchPic(CurScreen+1);
        refreshSwitchTimer = setTimeout('reSwitchPic();', 3000);
    }
    function pauseSwitch() {
        clearTimeout(refreshSwitchTimer);
    }
    function goonSwitch() {
        clearTimeout(refreshSwitchTimer);
        refreshSwitchTimer = setTimeout('reSwitchPic();', 3000);
    }
    function goManSwitch(index) {
        clearTimeout(refreshSwitchTimer);
       
        CurScreen = index - 1 ;
        reSwitchPic();
    }
    </script>
    </head>
     
    <body>
     
     
    <div class="flashNews">
                <div id="Switch_1">
                    <a  href="http://ent.xunlei.com/star/contents/f0/376591.shtml" blockid="1121">
                        <img src="file:///F:/webpage_prog/qinghai/index/img/1.jpg" alt="陈绮贞首度红馆开唱" onmouseover="pauseSwitch();"  onmouseout="goonSwitch();"/></a>
                 </div>
     
                 <div id="Switch_2" style="display:none;">
                     <a  href="http://ent.xunlei.com/star/contents/99/376648.shtml" blockid="1121">
                    <img src="file:///F:/webpage_prog/qinghai/index/img/2.gif" alt="皮特茱莉亮相红毯" onmouseover="pauseSwitch();"  onmouseout="goonSwitch();"/></a>
                 </div>
                <div id="Switch_3" style="display:none;">
                    <a  href="http://ent.xunlei.com/star/contents/f9/376406.shtml" blockid="1121">
                    <img src="file:///F:/webpage_prog/qinghai/index/img/3.gif" alt="李冰冰宣传新书获力挺" onmouseover="pauseSwitch();"  onmouseout="goonSwitch();"/>                                    </a>
                </div>
               
                <div id="Switch_4" style="display:none;">
                    <a  href="http://movie.xunlei.com/" blockid="1121">
                    <img src="file:///F:/webpage_prog/qinghai/index/img/4.gif" alt="《七龙珠》周润发变龟仙人" onmouseover="pauseSwitch();"  onmouseout="goonSwitch();"/>
                        </a>
                </div>
     
     
     
                <div id="SwitchTitle" onmouseover="pauseSwitch();"  onmouseout="goonSwitch();"></div>
                <ul id="SwitchNav">
                </ul>
                <div class="bg" onmouseover="pauseSwitch();"  onmouseout="goonSwitch();"></div>
            </div>
           
           
                    <script type="text/javascript">
            var Switcher = new Array();
    Switcher[1] = Array() ;
    Switcher[1]['title'] = "陈绮贞首度红馆开唱" ;
    Switcher[1]['stitle'] = "四度安可不够过瘾" ;
    Switcher[1]['link'] = "http://ent.xunlei.com/star/contents/f0/376591.shtml" ;
    Switcher[2] = Array() ;
    Switcher[2]['title'] = "皮特茱莉亮相红毯" ;
    Switcher[2]['stitle'] = "亲密携手恩爱惹艳羡" ;
    Switcher[2]['link'] = "http://ent.xunlei.com/star/contents/99/376648.shtml" ;
    Switcher[3] = Array() ;
    Switcher[3]['title'] = "李冰冰宣传新书获力挺" ;
    Switcher[3]['stitle'] = "清新装扮亮相青岛" ;
    Switcher[3]['link'] = "http://ent.xunlei.com/star/contents/f9/376406.shtml" ;
    Switcher[4] = Array() ;
    Switcher[4]['title'] = "《七龙珠》周润发变龟仙人" ;
    Switcher[4]['stitle'] = "神龙现身张牙舞爪 剧照火爆惊人" ;
    Switcher[4]['link'] = "http://movie.xunlei.com/" ;
     
     
            var refreshSwitchTimer = null;
            switchPic(CurScreen);
            refreshSwitchTimer = setTimeout('reSwitchPic();', 3000);
            </script>
     
    </body>
    </html>

  • 相关阅读:
    html5css练习 旋转
    html5 css练习 画廊 元素旋转
    html5 渐变按钮练习
    html5 旋转导航练习
    html5 javascript 表单练习案例
    html5 p1练习1,移动页面,标准标签布局
    pyqt5desinger的安装即配置
    python 文件操作
    openGL 大作业之n星变换
    openGL 蓝天白云
  • 原文地址:https://www.cnblogs.com/jifeng/p/1707535.html
Copyright © 2011-2022 走看看