js 新浪的一个图片播放图片轮换效果代码


Posted in Javascript onJuly 15, 2008

js 新浪的一个图片播放图片轮换效果代码
核心代码

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.noscript = function() { 
    $html = "\n"; 
    for (i=0; i < this.slides.length; i++) { 
      slide = this.slides[i]; 
      $html += '<P>'; 
      if (slide.link) { 
        $html += '<a href="' + slide.link + '">'; 
      } 
      $html += '<img src="' + slide.src + '" ALT="slideshow image">'; 
      if (slide.link) { 
        $html += "<\/a>"; 
      } 
      if (slide.text) { 
        $html += "<BR>\n" + slide.text; 
      } 
      $html += "<\/P>" + "\n\n"; 
    } 
    $html = $html.replace(/\&/g, "&" ); 
    $html = $html.replace(/</g, "<" ); 
    $html = $html.replace(/>/g, ">" ); 
    return('<pre>' + $html + '</pre>'); 
  } 
  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(); 
  } 
}

新浪图片播放器在线演示
新浪图片播放器打包下载
Javascript 相关文章推荐
文本框根据输入内容自适应高度的代码
Oct 24 Javascript
javascript中的作用域和上下文使用简要概述
Dec 05 Javascript
js触发onchange事件的方法说明
Mar 08 Javascript
JavaScript 面向对象与原型
Apr 10 Javascript
javascript实现在网页任意处点左键弹出隐藏菜单的方法
May 13 Javascript
轻松实现javascript数据双向绑定
Nov 11 Javascript
JavaScript文本框脚本编写的注意事项
Jan 25 Javascript
jQuery实现手机上输入后隐藏键盘功能
Jan 04 Javascript
jquery获取下拉框中的循环值
Feb 08 Javascript
Material(包括Material Icon)在Angular2中的使用详解
Feb 11 Javascript
微信小程序自定义prompt组件步骤详解
Jun 12 Javascript
jQuery使用jsonp实现百度搜索的示例代码
Jul 08 jQuery
纯js实现的论坛常用的运行代码的效果
Jul 15 #Javascript
点图片上一页下一页翻页效果
Jul 09 #Javascript
JS的数组的扩展实例代码
Jul 09 #Javascript
JS location几个方法小姐
Jul 09 #Javascript
非常不错的功能强大代码简单的管理菜单美化版
Jul 09 #Javascript
javascript jQuery $.post $.ajax用法
Jul 09 #Javascript
javascript同步Import,同步调用外部js的方法
Jul 08 #Javascript
You might like
php5数字型字符串加解密代码
2008/04/24 PHP
PHP 万年历实现代码
2012/10/18 PHP
基于Discuz security.inc.php代码的深入分析
2013/06/03 PHP
ajax返回值中有回车换行、空格的解决方法分享
2013/10/24 PHP
PHP使用fopen与file_get_contents读取文件实例分享
2016/03/04 PHP
Yii框架常见缓存应用实例小结
2019/09/09 PHP
javascript Excel操作知识点
2009/04/24 Javascript
javascript时间自动刷新实现原理与步骤
2013/01/06 Javascript
jQuery实用基础超详细介绍
2013/04/11 Javascript
AngularJs 60分钟入门基础教程
2016/04/03 Javascript
Bootstrap中的表单验证插件bootstrapValidator使用方法整理(推荐)
2016/06/21 Javascript
WebView启动支付宝客户端支付失败的问题小结
2017/01/11 Javascript
jQuery实现的form转json经典示例
2017/10/10 jQuery
KOA+egg.js集成kafka消息队列的示例
2018/11/09 Javascript
jQuery实现的上拉刷新功能组件示例
2020/05/01 jQuery
简单的通用表达式求10乘阶示例
2014/03/03 Python
Python实现屏幕截图的代码及函数详解
2016/10/01 Python
Pandas中Series和DataFrame的索引实现
2019/06/27 Python
django框架forms组件用法实例详解
2019/12/10 Python
python__new__内置静态方法使用解析
2020/01/07 Python
python 在右键菜单中加入复制目标文件的有效存放路径(单斜杠或者双反斜杠)
2020/04/08 Python
PyCharm中如何直接使用Anaconda已安装的库
2020/05/28 Python
python GUI模拟实现计算器
2020/06/22 Python
python 提高开发效率的5个小技巧
2020/10/19 Python
浅谈CSS3 box-sizing 属性 有趣的盒模型
2019/04/02 HTML / CSS
前端H5 Video常见使用场景简介
2020/08/21 HTML / CSS
军用级手机壳,专为冒险而建:Zizo Wireless
2019/08/07 全球购物
研究生自我鉴定范文
2013/10/30 职场文书
高中班级口号
2014/06/09 职场文书
2015年创先争优活动总结
2015/03/27 职场文书
2015年护理工作总结范文
2015/04/03 职场文书
结婚十年感言
2015/07/31 职场文书
2015年物业管理员工工作总结
2015/10/15 职场文书
《金色的草地》教学反思
2016/02/17 职场文书
Win11无法访问设备和打印机 如何解决页面空白
2022/04/09 数码科技
浅谈css清除浮动(clearfix和clear)的用法
2023/05/21 HTML / CSS