• 贡献一个新浪的幻灯片(javascript) (转)


    <style type="text/css">
    <!--

    body,ul,ol,li,p,form,fieldset,table,td
    {font-family:"宋体";}
    body
    {background:#fff;color:#000;text-align:center; margin-top:5px;}
    td,p,li,select,input,textarea,div
    {font-size:12px;}

    ul
    {list-style-type:none;}
    select,input
    {vertical-align:middle;}

    .f14
    {font-size:14px;}
    .lh20
    {line-height:20px;}

    a
    {text-decoration:underline;}
    a:link
    {color:#009;}
    a:visited
    {color:#800080;}
    a:hover,a:active,a:focus
    {color:#f00;}

    .clearit
    {clear:both;}

    /* 列表 */
    /* 14px加点列表 */
    .link14listStyle li
    {text-align:left;line-height:23px;font-size:14px;padding:0 0 0 9px;background:url() no-repeat 0 50%;}
    /* 14px无点列表 */
    .link14list li
    {text-align:left;line-height:23px;font-size:14px;padding:0;}
    /* 12px加点列表 */
    .link12listStyle li
    {text-align:left;line-height:20px;font-size:12px;padding:0 0 0 9px;background:url() no-repeat 0 45%;}
    /* 12px无点列表 */
    .link12list li
    {text-align:left;line-height:20px;font-size:12px;padding:0;}

    /* 主容器 */
    #wrap
    {width:750px;margin:0 auto;text-align:left;}


    /* 导航 */
    #nav
    {width:750px; height:27px; overflow:hidden; clear:both; margin:0 0 3px 0; background:url() repeat-x;}
    #nav #navlogo
    {float:left; width:247px;}
    #nav ul
    {padding-right:18px; width:485px; float:right;}
    html* #nav ul
    {width:503px;}
    #nav li
    {float:right; width:48px; text-align:center; line-height:27px; height:27px; color:#039;}
    #nav a
    {text-decoration:none;}
    #nav a:link,#nav a:visited
    {color:#039;}
    #nav a:hover,#nav a:active,#nav a:focus
    {color:#f00;}

    /* banner */
    .banner
    {height:100px;background:url([img]http://image2.sina.com.cn/dy/deco/2007/0208/top100_i_ws_003.jpg[/img]) no-repeat;}
    .banner h1{font-weight:normal;font-size:36px;color:#fff;font-family:"黑体";text-align:center;line-height:100px;}

    /* 主容器 */
    #wrap
    {width:750px;margin:0 auto;text-align:left;}

    /* 播放器样式(部分) */
    .itemOff
    {width:16px; height:14px; line-height:14px; background:#cfe6ff; border:1px #5673a8 solid; margin:0 5px 5px 0; float:left; cursor:pointer; color:#008; text-align:center;}
    .itemOn
    {width:16px; height:14px; line-height:14px; background:#fff; border:1px #5673a8 solid; margin:0 5px 5px 0; float:left; cursor:pointer; color:#008; text-align:center;}
    .PListImg
    {line-height:18px; color:#000; margin-top:15px;}
    .PListImg a
    {text-decoration:underline;}
    .PListImg a:link,.PListImg a:visited
    {color:#000;}
    .PListImg a:hover,.PListImg a:active
    {color:#f00;}
    .PListImg .PLDiv
    {width:115px; height:95px; border:1px #acacac solid; background:#fff;}
    .PListImg img
    {width:105px; height:85px; margin:5px;}
    -->
    </style>

    <div style="padding:3px; background:#fff; border:1px #7c97c6 solid; margin-top:5px; 450px; overflow:hidden;">
    <!-- 图片播放器 begin -->
    <script type="text/javascript">
    <!--
    function slide(src,link,text,target,attr,desc) {
      
    this.desc = desc
      
    this.src = src;
      
    this.link = link;
      
    this.text = text;
      
    this.target = target;
      
    this.attr = attr;
      
    if (document.images) {
        
    this.image = new Image();
      }
      
    this.loaded = false;
      
    this.load = function() {
        
    if (!document.images) { return; }

        
    if (!this.loaded) {
          
    this.image.src = this.src;
          
    this.loaded = true;
        }
      }
      
    this.hotlink = function() {
        
    var mywindow;
        
    if (!this.link) return;
        
    if (this.target) {
          
    if (this.attr) {
            mywindow 
    = window.open(this.link, this.target, this.attr);
      
          } 
    else {
            mywindow 
    = window.open(this.link, this.target);
          }
          
    if (mywindow && mywindow.focus) mywindow.focus();

        } 
    else {
          location.href 
    = this.link;
        }
      }
    }
    function slideshow( slideshowname ) {
      
    this.name = slideshowname;
      
    this.repeat = true;
      
    this.prefetch = -1;
      
    this.image;
      
    this.textid;
      
    this.textarea;
      
    this.timeout = 5000;
      
    this.slides = new Array();
      
    this.current = 0;
      
    this.timeoutid = 0;
      
    this.add_slide = function(slide) {
        
    var i = this.slides.length;
        
    if (this.prefetch == -1) {
          slide.load();
        }

        
    this.slides[i] = slide;
      }
      
    this.play = function(timeout) {
        
    this.pause();
        
    if (timeout) {
          
    this.timeout = timeout;
        }
        
    if (typeof this.slides[ this.current ].timeout != 'undefined') {
          timeout 
    = this.slides[ this.current ].timeout;
        } 
    else {
          timeout 
    = this.timeout;
        }
        
    this.timeoutid = setTimeout( this.name + ".loop()", timeout);
      }
      
    this.pause = function() {
        
    if (this.timeoutid != 0) {

          clearTimeout(
    this.timeoutid);
          
    this.timeoutid = 0;

        }
      }
      
    this.update = function() {
        
    if (! this.valid_image()) { return; }
        
    if (typeof this.pre_update_hook == 'function') {
          
    this.pre_update_hook();
        }
        
    var slide = this.slides[ this.current ];
        
    var dofilter = false;
        
    if (this.image &&
            
    typeof this.image.filters != 'undefined' &&
            
    typeof this.image.filters[0!= 'undefined') {
          dofilter 
    = true;

        }
        slide.load();
        
    if (dofilter) {
          
    if (slide.filter &&
              
    this.image.style &&
              
    this.image.style.filter) {
            
    this.image.style.filter = slide.filter;
          }
          
    this.image.filters[0].Apply();
        }
        
    this.image.src = slide.image.src;
        
    if (dofilter) {
          
    this.image.filters[0].Play();
        }
        
    this.display_text();
        
    if (typeof this.post_update_hook == 'function') {
          
    this.post_update_hook();
        }
        
    if (this.prefetch > 0) {

          
    var next, prev, count;
          next 
    = this.current;
          prev 
    = this.current;
          count 
    = 0;
          
    do {
            
    if (++next >= this.slides.length) next = 0;
            
    if (--prev < 0) prev = this.slides.length - 1;
            
    this.slides[next].load();
            
    this.slides[prev].load();
          } 
    while (++count < this.prefetch);
        }
      }
      
    this.goto_slide = function(n) {
        
    if (n == -1) {
          n 
    = this.slides.length - 1;
        }
        
    if (n < this.slides.length && n >= 0) {
          
    this.current = n;
        }
        
    this.update();
      }
      
    this.goto_random_slide = function(include_current) {
        
    var i;
        
    if (this.slides.length > 1) {
          
    do {
            i 
    = Math.floor(Math.random()*this.slides.length);
          } 
    while (i == this.current);
          
    this.goto_slide(i);
        }
      }
      
    this.next = function() {
        
    if (this.current < this.slides.length - 1) {
          
    this.current++;
        } 
    else if (this.repeat) {
          
    this.current = 0;
        }
        
    this.update();
      }
      
    this.previous = function() {
        
    if (this.current > 0) {
          
    this.current--;
        } 
    else if (this.repeat) {
          
    this.current = this.slides.length - 1;
        }
        
    this.update();
      }
      
    this.shuffle = function() {
        
    var i, i2, slides_copy, slides_randomized;
        slides_copy 
    = new Array();
        
    for (i = 0; i < this.slides.length; i++) {
          slides_copy[i] 
    = this.slides[i];
        }
        slides_randomized 
    = new Array();
        
    do {
          i 
    = Math.floor(Math.random()*slides_copy.length);
          slides_randomized[ slides_randomized.length ] 
    =
            slides_copy[i];
          
    for (i2 = i + 1; i2 < slides_copy.length; i2++) {
            slides_copy[i2 
    - 1= slides_copy[i2];
          }
          slides_copy.length
    --;
        } 
    while (slides_copy.length);
        
    this.slides = slides_randomized;
      }
      
    this.get_text = function() {
        
    return(this.slides[ this.current ].text);
      }
      
    this.get_all_text = function(before_slide, after_slide) {
        all_text 
    = "";
        
    for (i=0; i < this.slides.length; i++) {
          slide 
    = this.slides[i];
          
    if (slide.text) {
            all_text 
    += before_slide + slide.text + after_slide;
          }
        }
        
    return(all_text);
      }
      
    this.display_text = function(text) {
        
    if (!text) {
          text 
    = this.slides[ this.current ].text;
        }
        
    if (this.textarea && typeof this.textarea.value != 'undefined') {
          
    this.textarea.value = text;
        }
        
    if (this.textid) {
          r 
    = this.getElementById(this.textid);
          
    if (!r) { return false; }
          
    if (typeof r.innerHTML == 'undefined') { return false; }
          r.innerHTML 
    = text;
        }
      }
      
    this.hotlink = function() {
        
    this.slides[ this.current ].hotlink();
      }
      
    this.save_position = function(cookiename) {
        
    if (!cookiename) {
          cookiename 
    = this.name + '_slideshow';
        }
        document.cookie 
    = cookiename + '=' + this.current;
      }
      
    this.restore_position = function(cookiename) {
        
    if (!cookiename) {
          cookiename 
    = this.name + '_slideshow';
        }
        
    var search = cookiename + "=";
        
    if (document.cookie.length > 0) {
          offset 
    = document.cookie.indexOf(search);
          
    if (offset != -1) { 
            offset 
    += search.length;
            end 
    = document.cookie.indexOf(";", offset);
            
    if (end == -1) end = document.cookie.length;
            
    this.current = parseInt(unescape(document.cookie.substring(offset, end)));
            }
         }
      }
      
    this.loop = function() {
        
    if (this.current < this.slides.length - 1) {
          next_slide 
    = this.slides[this.current + 1];
          
    if (next_slide.image.complete == null || next_slide.image.complete) {
            
    this.next();
          }
        } 
    else {
          
    this.next();
        }
        
    this.play( );
      }
      
    this.valid_image = function() {
        
    if (!this.image){
          
    return false;
        }
        
    else {
          
    return true;
        }
      }
      
    this.getElementById = function(element_id) {
        
    if (document.getElementById) {
          
    return document.getElementById(element_id);
        }
        
    else if (document.all) {
          
    return document.all[element_id];
        }
        
    else if (document.layers) {
          
    return document.layers[element_id];
        } 
    else {
          
    return undefined;
        }
      }
      
    this.set_image = function(imageobject) {
        
    if (!document.images)
          
    return;
        
    this.image = imageobject;
      }
      
    this.set_textarea = function(textareaobject) {
        
    this.textarea = textareaobject;
        
    this.display_text();
      }
      
    this.set_textid = function(textidstr) {
        
    this.textid = textidstr;
        
    this.display_text();
      }
    }
    //-->
    </script>
    <script type="text/javascript">
    <!--
    ss 
    = new slideshow("ss");
    ss.prefetch 
    = 1;
    ss.sizelmt 
    = true;
    ss.repeat 
    = true;


            s 
    = new slide();
            s.src 
    = "http://image2.sina.com.cn/dy/photo/360/2007/0418/U1473P1T360D28F8101DT20070418084634.JPG";
            s.title 
    = "弗吉尼亚理工大学充满悲痛";
            s.link 
    = "http://news.sina.com.cn/w/p/2007-04-18/055512804495.shtml";
            s.desc 
    = "";
            ss.add_slide(s);
            
            s 
    = new slide();
            s.src 
    = "http://image2.sina.com.cn/dy/photo/360/2007/0418/U1473P1T360D28F8112DT20070418084634.JPG";
            s.title 
    = "学生自发在约翰斯顿宿舍楼前献花";
            s.link 
    = "http://news.sina.com.cn/w/p/2007-04-18/055512804491.shtml";
            s.desc 
    = "";
            ss.add_slide(s);
            
            s 
    = new slide();
            s.src 
    = "http://image2.sina.com.cn/dy/photo/360/2007/0418/U1473P1T360D28F8114DT20070418084634.JPG";
            s.title 
    = "学生自发树立VT纪念碑";
            s.link 
    = "http://news.sina.com.cn/w/p/2007-04-18/055412804487.shtml";
            s.desc 
    = "";
            ss.add_slide(s);
            
            s 
    = new slide();
            s.src 
    = "http://image2.sina.com.cn/dy/photo/360/2007/0418/U1473P1T360D28F8115DT20070418084634.JPG";
            s.title 
    = "万人追思枪案死难者";
            s.link 
    = "http://news.sina.com.cn/w/p/2007-04-18/053812804344.shtml";
            s.desc 
    = "";
            ss.add_slide(s);
            
            s 
    = new slide();
            s.src 
    = "http://image2.sina.com.cn/dy/photo/360/2007/0418/U1473P1T360D28F8116DT20070418084634.JPG";
            s.title 
    = "万人追思弗吉尼亚理工大学枪案死难者";
            s.link 
    = "http://news.sina.com.cn/w/p/2007-04-18/053812804341.shtml";
            s.desc 
    = "";
            ss.add_slide(s);
            
            s 
    = new slide();
            s.src 
    = "http://image2.sina.com.cn/dy/photo/360/2007/0418/U1473P1T360D28F8117DT20070418084634.JPG";
            s.title 
    = "弗吉尼亚工学院学生为遇难同学守夜";
            s.link 
    = "http://news.sina.com.cn/w/p/2007-04-17/224112801948.shtml";
            s.desc 
    = "";
            ss.add_slide(s);
            
            s 
    = new slide();
            s.src 
    = "http://image2.sina.com.cn/dy/photo/360/2007/0418/U1473P1T360D28F8118DT20070418084634.JPG";
            s.title 
    = "弗吉尼亚工学院学生为遇难同学守夜";
            s.link 
    = "http://news.sina.com.cn/w/p/2007-04-17/224012801946.shtml";
            s.desc 
    = "";
            ss.add_slide(s);
            
            s 
    = new slide();
            s.src 
    = "http://image2.sina.com.cn/dy/photo/360/2007/0418/U1473P1T360D28F8119DT20070418084634.JPG";
            s.title 
    = "学生高举标牌表达对死难者的悼念";
            s.link 
    = "http://news.sina.com.cn/w/p/2007-04-18/055512804489.shtml";
            s.desc 
    = "";
            ss.add_slide(s);
            
            s 
    = new slide();
            s.src 
    = "http://image2.sina.com.cn/dy/photo/360/2007/0418/U1473P1T360D28F8120DT20070418084634.JPG";
            s.title 
    = "数百名记者云集校园";
            s.link 
    = "http://news.sina.com.cn/w/p/2007-04-18/055512804492.shtml";
            s.desc 
    = "";
            ss.add_slide(s);
            
            s 
    = new slide();
            s.src 
    = "http://image2.sina.com.cn/dy/photo/360/2007/0418/U1473P1T360D28F8102DT20070418084634.JPG";
            s.title 
    = "发生第一起枪击案的约翰斯顿宿舍楼";
            s.link 
    = "http://news.sina.com.cn/w/p/2007-04-18/055512804494.shtml";
            s.desc 
    = "";
            ss.add_slide(s);
            
        
    for (var i=0; i < ss.slides.length; i++) {
        s 
    = ss.slides[i];
        s.target 
    = "_blank";
    }
    //-->
    </script>


    <table width="438" cellspacing="0">
    <tr valign="top">
    <td width="448" style="background:url() no-repeat 14px 17px #dedede;">

        
    <!-- 播放器主体 bgein -->
        
    <div id="ss_img_div" style="406px; height:302px; margin:26px 0 0 23px; clear:both;"><href="javascript:ss.hotlink();"><img id="ss_img" style="FILTER: blendTrans (Duration=1)" width="406" height="302" src="http://image2.sina.com.cn/dy/photo/360/2007/0418/U1473P1T360D28F8101DT20070418084634.JPG" alt=""/></a></div>
        
    <div style="margin:15px 0 17px 0; text-align:center; font-weight:bold; clear:both;" id="tt">弗吉尼亚理工大学充满悲痛</div>
        
    <table width="448" cellspacing="0" style="background:#ededed;">
        
    <tr valign="middle" align="left">
        
    <td width="15" height="50"></td>
        
    <td width="220">
            
    <div class="itemOff" id="imbtn0" onClick="ss.goto_slide(0)">1</div>
    <div class="itemOff" id="imbtn1" onClick="ss.goto_slide(1)">2</div>
    <div class="itemOff" id="imbtn2" onClick="ss.goto_slide(2)">3</div>
    <div class="itemOff" id="imbtn3" onClick="ss.goto_slide(3)">4</div>
    <div class="itemOff" id="imbtn4" onClick="ss.goto_slide(4)">5</div>
    <div class="itemOff" id="imbtn5" onClick="ss.goto_slide(5)">6</div>
    <div class="itemOff" id="imbtn6" onClick="ss.goto_slide(6)">7</div>
    <div class="itemOff" id="imbtn7" onClick="ss.goto_slide(7)">8</div>
    <div class="itemOff" id="imbtn8" onClick="ss.goto_slide(8)">9</div>
    <div class="itemOff" id="imbtn9" onClick="ss.goto_slide(9)">10</div>

        
    </td>
        
    <td width="83" style="color:#008;">
    速度 
    <select name="select" style="45px;">
    <option selected="selected" id="iter_5" onChange="javascript:document.ss_form.sp1[0].click();ss.timeout=5000" name="sp1">5秒</option>
    <option onChange="javascript:document.ss_form.sp1[1].click();ss.timeout=10000" name="sp1">10秒</option>
    </select>
        
    </td>
        
    <td width="130">
            
    <table cellspacing="0">
            
    <tr align="left">
            
    <td width="29"><href="javascript:ss.previous()"><img src="http://image2.sina.com.cn/dy/deco/2007/0208/hdtj_ws_002.gif" width="23" height="18" alt="上一张" border="0" /></a></td>
            
    <td width="29"><href="javascript:ss.next();ss.play()"><img src="http://image2.sina.com.cn/dy/deco/2007/0208/hdtj_ws_003.gif" width="23" height="18" alt="播放" border="0" /></a></td>
            
    <td width="29"><href="javascript:ss.pause()"><img src="http://image2.sina.com.cn/dy/deco/2007/0208/hdtj_ws_004.gif" width="23" height="18" alt="暂停" border="0" /></a></td>
            
    <td width="29"><href="javascript:ss.next()"><img src="http://image2.sina.com.cn/dy/deco/2007/0208/hdtj_ws_005.gif" width="23" height="18" alt="下一张" border="0" /></a></td>
            
    </tr>
            
    </table>
        
    </td>
        
    </tr>
        
    </table>
        
    <!-- 播放器主体 end -->
    </td>
    </tr>
    </table>
    <script type="text/javascript">
    <!--
    ss.pre_update_hook 
    = function() {
        sid 
    = ss.current;
        title 
    = ss.slides[sid].title;
        linkurl 
    = ss.slides[sid].link;
        totals 
    = ss.slides.length;
        sdesc 
    = ss.slides[sid].desc;
        tempid 
    = parseInt(sid) + 1;
        document.getElementById(
    "tt").innerHTML = title;
        
    for (var i = 0;i < 10;i++){
            document.getElementById(
    "imbtn"+i).className = "itemOff";
        }
        document.getElementById(
    "imbtn"+sid).className = "itemOn";
      
    return;
    }
    if (document.images) {
        ss.image 
    = document.images.ss_img;
        ss.update();
        ss.play();
    }
    //-->
    </script>
    <!-- 图片播放器 end -->
    </div>

  • 相关阅读:
    ssh端口转发
    linux git命令安装
    linux git命令
    linux cpio命令
    linux 抓包工具
    js 深拷贝 ,浅拷贝
    vue $router 打开新窗口
    excel常用操作
    Kafka Topic的增删改查操作
    linux上删除文件名乱码的文件
  • 原文地址:https://www.cnblogs.com/jackxia/p/1150986.html
Copyright © 2020-2023  润新知