新浪网站的图片(相册)播放器
<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([img]http://image2.sina.com.cn/dy/legal/2006index/news_law_hz_012.gif[/img])
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([img]http://image2.sina.com.cn/dy/legal/2006index/news_law_hz_012.gif[/img])
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([img]http://image2.sina.com.cn/dy/deco/2007/0208/top100_i_ws_002.gif[/img])
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; width: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([img]http://image2.sina.com.cn/dy/deco/2007/0208/hdtj_ws_001.gif[/img])
no-repeat 14px 17px #dedede;">
<!-- 播放器主体 bgein -->
<div id="ss_img_div" style="width:406px; height:302px;
margin:26px 0 0 23px; clear:both;"><a
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="width: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"><a
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"><a
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"><a
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"><a
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>
相关推荐
【新浪图库JS图片播放器样式】是一种常见的网页图片展示技术,主要利用JavaScript语言实现动态的图片轮播效果,常用于网站的图库展示。这种技术可以为用户提供更丰富的交互体验,使图片浏览更加生动有趣。在网页设计...
新浪图库JS图片播放器样式 flash滑动焦点图代码 新浪相册首页9格FLASH图片展 千龙网JS带缩略图的5屏轮换 雅虎社区4屏焦点轮换 搜狐娱乐频道flash焦点图广告 四屏flash图片轮换代码 沪江英语网3图弹性广告展示 淘宝网...
49. jquery相册播放器插件实现无序图片列表转换成有序并播放 50. jQuery移动网页背景图浮云流水特效 51. jquery简单控制上下、左右四方向滚动的特效插件下载 52. jquery缩略图滚动特效之带小图的网页元素滚动轮播...
49. jquery相册播放器插件实现无序图片列表转换成有序并播放 50. jQuery移动网页背景图浮云流水特效 51. jquery简单控制上下、左右四方向滚动的特效插件下载 52. jquery缩略图滚动特效之带小图的网页元素滚动轮播...
49. jquery相册播放器插件实现无序图片列表转换成有序并播放 50. jQuery移动网页背景图浮云流水特效 51. jquery简单控制上下、左右四方向滚动的特效插件下载 52. jquery缩略图滚动特效之带小图的网页元素滚动轮播...
49. jquery相册播放器插件实现无序图片列表转换成有序并播放 50. jQuery移动网页背景图浮云流水特效 51. jquery简单控制上下、左右四方向滚动的特效插件下载 52. jquery缩略图滚动特效之带小图的网页元素滚动轮播...
49.jquery相册播放器插件实现无序图片列表转换成有序并播放 50.jQuery移动网页背景图浮云流水特效 51.jquery简单控制上下、左右四方向滚动的特效插件下载 52.jquery缩略图滚动特效之带小图的网页元素滚动轮播...
2. QQ邮箱编辑器:QQ邮箱的在线编辑器同样具备基本的编辑功能,特色在于集成QQ空间、腾讯相册等服务,方便用户直接插入个人的图片和日志内容。此外,它还支持实时同步通讯录,便于发送邮件给联系人。 3. 新浪博客...
楼盘图库,楼盘图片使用图库播放器查看,可以自动播放,一次性浏览各个相册的图片,支持同一楼盘下各个相册的切换,具有更好的图片阅读体验; 楼盘关联论坛,楼盘可以关联论坛的版块或帖子,关联论坛后会在楼盘头部...
32、修正后台视频审核预览flv播放器 33、修正后台地区管理 34、免责声明移植到后台管理发布 35、去除了隐身登录功能,更改为自动保存用户名密码功能 36、重新开发了在线泡币机制 37、VIP会员升级时效增加3年和5年 38...
4.怎么创建相册文章,首先写文章时选择类型为“相册”,然后勾选“显示选项”里面的“相册设置”,点击“添加图片”创建即可。 5.主题有三个小工具区域,每个区域都是假如为空时,区域是隐藏的。举个例子,假如右边...
楼盘图库,楼盘图片使用图库播放器查看,可以自动播放,一次性浏览各个相册的图片,支持同一楼盘下各个相册的切换,具有更好的图片阅读体验; 楼盘关联论坛,楼盘可以关联论坛的版块或帖子,关联论坛后会在楼盘头部...
10. Flash相册:使用Dreamweaver内置的Flash功能创建相册,设置自动翻页,添加多张图片。 11. 右键菜单:安装右键菜单插件,然后在4-右.html中调用插件,设置链接指向网易。 12. 背景音乐:在5.html中使用`<audio>...
其次,影视系统增加支持百度播放器(默认)及快播,允许下载的话,还支持迅雷及快车下载,让前台用户可以自由选择播放器类型。后台添加的每部影片还支持自定义广告。可设置是否对VIP用户组开放观看影片免广发等。 ...
其次,影视系统增加支持百度播放器(默认)及快播,允许下载的话,还支持迅雷及快车下载,让前台用户可以自由选择播放器类型。后台添加的每部影片还支持自定义广告。可设置是否对VIP用户组开放观看影片免广发等。 ...
修改优酷专辑视频的播放器地址和缩略图不能解析 SpaceBuilder/Share.Web/SiteHtmlParsers/YoukuPlayListHtmlParser.cs 25.修改新浪视频分享的正则表达式 SpaceBuilder/Web/SpaceBuilder.config 26.修改新浪...
24.修改优酷专辑视频的播放器地址和缩略图不能解析 SpaceBuilder/Share.Web/SiteHtmlParsers/YoukuPlayListHtmlParser.cs 25.修改新浪视频分享的正则表达式 SpaceBuilder/Web/SpaceBuilder.config 26.修改新浪视频...