要实现图片播放,且有播放,停止,上一个,下一个按钮,该如何实现?? 题目如上,高手帮我! 解决方案 » 免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货 示例代码:ImageSlide.htm:<html><head><title>永失我爱</title><meta http-equiv="Content-Type" content="text/html; charset=gb2312"></head><body bgcolor="black"><table width="100%" height="100%"><tr><td align="center" valign="middle"><h1 style="color:#EEEEEE;">永失我爱</h1><div style="padding:1px;background-color:white;width:1px;height:1px;"><script language="JavaScript" type="text/javascript" src="ImageSlide-1.0.0.iclass.js"></script><script language="JavaScript" type="text/javascript">//添加播放的图片window.imageSlide.pushImgs( "images/00.jpg", "images/01.jpg", "images/02.jpg", "images/03.jpg", "images/04.jpg", "images/05.jpg", "images/06.jpg", "images/07.jpg", "images/08.jpg", "images/09.jpg", "images/10.jpg", "images/11.jpg", "images/12.jpg", "images/13.jpg", "images/14.jpg", "images/15.jpg", "images/16.jpg", "images/17.jpg", "images/18.jpg", "images/19.jpg", "images/20.jpg", "images/21.jpg", "images/22.jpg", "images/23.jpg", "images/24.jpg", "images/25.jpg", "images/26.jpg", "images/27.jpg", "images/28.jpg", "images/29.jpg", "images/30.jpg", "images/31.jpg", "images/32.jpg", "images/33.jpg", "images/34.jpg");//还可以进行如下的设置//window.imageSlide.setAutoPlay(false); //是否自动播放//window.imageSlide.setBoxId("myImageSlide"); //设置播放容器的ID//window.imageSlide.setDelay(8); //设置播放延时//window.imageSlide.setTransform(18); //设置切换效果window.imageSlide.setSize(640, 320); //设置播放容器的大小window.imageSlide.display(); //显示</script></div><br /><span style="color:#EEEEEE;"></span></td></tr></table></body></html>ImageSlide-1.0.0.iclass.js:function ImageSlide () { if((/MSIE\s*[5-9]/).test(navigator.appVersion)) { this.count = 0; this.timer = null; this.first = new Object(); this.frms = new Array(); this.imgs = new Array(); this.width = 640; this.height = 480; this.boxId = "imageSlideBox"; this.delay = 5; this.autoPlay = true; this.transform = 23; /** * 播放切换效果说明 * -------------- * 0. 矩形缩小 * 1. 矩形扩大 * 2. 圆形缩小 * 3. 圆形扩大 * 4. 从下到上 * 5. 从上到下 * 6. 从左到右 * 7. 从右到左 * 8. 竖百叶窗 * 9. 横百叶窗 * 10. 错位横百叶窗 * 11. 错位竖百叶窗 * 12. 点扩散 * 13. 两边到中间 * 14. 中间到两边 * 15. 中间到上下 * 16. 上下到中间 * 17. 右下到左上 * 18. 右上到左下 * 19. 左上到右下 * 20. 左下到右上 * 21. 横条 * 22. 竖条 * 23. 随机 * -------------- */ } else { alert("请使用IE5或IE5以上版本的浏览器使用本程序!"); }}//加入一张或多张图片(传入一个或多个图片路径)//pushImg(sPath1 [, sPath2 [, sPath3 [, ...]]])ImageSlide.prototype.pushImgs = function () { for (var i = 0; i < arguments.length; i++) this.imgs.push(arguments[i]);}//设置图片播放容器的长宽ImageSlide.prototype.setSize = function (nWidth, nHeight) { this.width = nWidth; this.height = nHeight;}//设置图片播放容器的IDImageSlide.prototype.setBoxId = function (sBoxId) { this.boxId = sBoxId;}//设置是否自动播放ImageSlide.prototype.setAutoPlay = function (bAutoPlay) { this.autoPlay = bAutoPlay;}//设置自动播放的延时秒数ImageSlide.prototype.setDelay = function (nSeconds) { this.delay = nSeconds;}//设置播放的切换效果(0-23的整数)ImageSlide.prototype.setTransform = function (nTransform) { this.transform = nTransform;}//显示ImageSlide.prototype.display = function () { var boxStr = "<div style='width:" + this.width + "px;height:" + this.height + "px;' "; boxStr += "id='" + this.boxId + "'><div "; if (this.autoPlay) boxStr += "onclick='window.imageSlide.play();window.imageSlide.timerPlay();'"; else boxStr += "onclick='window.imageSlide.play();'"; boxStr += "style='word-break:keep-all;width:100%;height:100%;background-color:#EEEEEE;'>"; if (this.autoPlay) boxStr += "<br /> 点击此处开始进行自动播放……"; else boxStr += "<br /> 点击此处开始播放,播放时单击播放下一张……"; boxStr += "</div>"; var img; var transform = this.transform; for (var i = 0; i < this.imgs.length; i++) { if (this.transform >= 23) var transform = Math.floor(Math.random()*23); boxStr += "<img src='" + this.imgs[i] + "' style='display:none;width:"; boxStr += this.width + ";height:" + this.height + "px;height:px;filter:"; boxStr += "revealTrans(transition=" + transform + ",duration=1);'"; if (!this.autoPlay) boxStr += "' onclick='window.imageSlide.play();' alt='点击播放下一张'"; boxStr += " />"; } boxStr += "</div>"; document.writeln(boxStr); var box = document.getElementById(this.boxId); this.first = box.childNodes[0]; this.frms = box.getElementsByTagName("IMG");}//播放ImageSlide.prototype.play = function () { if (window.imageSlide.imgs.length) { window.imageSlide.first.style.display = "none"; if (window.imageSlide.count >= window.imageSlide.imgs.length) { alert("播放完毕!"); window.imageSlide.frms[window.imageSlide.count-1].style.display = "none"; window.imageSlide.first.style.display = "block"; window.imageSlide.first.innerHTML = "<br /> 点击此处再次进行播放!"; clearInterval(window.imageSlide.timer); window.imageSlide.count = 0; } else if (window.imageSlide.count == 0) { window.imageSlide.first.style.display = "none"; window.imageSlide.frms[0].filters[0].apply(); window.imageSlide.frms[0].style.display = "block"; window.imageSlide.frms[0].filters[0].play(); } else { window.imageSlide.frms[window.imageSlide.count-1].style.display = "none"; window.imageSlide.frms[window.imageSlide.count].filters[0].apply(); window.imageSlide.frms[window.imageSlide.count].style.display = "block"; window.imageSlide.frms[window.imageSlide.count].filters[0].play(); } window.imageSlide.count++; } else { alert("你没有放入任何图片,无法进行播放!"); }}//连续播放ImageSlide.prototype.timerPlay = function () { this.timer = setInterval(this.play, this.delay * 1000);}//实例化一个ImageSlide对象imageSlide并将其做为window对象的一个子对象window.imageSlide = new ImageSlide(); 读一下指定目录下的所有JPG文件,然后添充一下那个播放的数组不就可以了吗? http://dotnet.aspx.cc/Exam/Play/Play.htm http://dotnet.aspx.cc/Exam/Play/Play.zip 呵呵,做的有些像yahoo!的幻灯片~~感觉msn的spaces上相册的图片播放做的更漂亮些。 传输文件的ip问题 CS1026: ) expected 求C# 的ubb在线编辑器 急急急 asp.net中如何用字节转换为KB呢? Vs2005与Vs2003的区别 50分,简单问,来拿分。 无刷新取数据? if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)是什么意思,有什么作用? 关于dll文件多处定义的错误 C# SDK文档 是什么?? 网页生成图片 ============散分啦,大家来看看吧。。。。。 急急急!!!
ImageSlide.htm:<html>
<head>
<title>永失我爱</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body bgcolor="black">
<table width="100%" height="100%">
<tr>
<td align="center" valign="middle">
<h1 style="color:#EEEEEE;">永失我爱</h1>
<div style="padding:1px;background-color:white;width:1px;height:1px;">
<script language="JavaScript" type="text/javascript" src="ImageSlide-1.0.0.iclass.js"></script>
<script language="JavaScript" type="text/javascript">
//添加播放的图片
window.imageSlide.pushImgs( "images/00.jpg", "images/01.jpg", "images/02.jpg", "images/03.jpg", "images/04.jpg",
"images/05.jpg", "images/06.jpg", "images/07.jpg", "images/08.jpg", "images/09.jpg",
"images/10.jpg", "images/11.jpg", "images/12.jpg", "images/13.jpg", "images/14.jpg",
"images/15.jpg", "images/16.jpg", "images/17.jpg", "images/18.jpg", "images/19.jpg",
"images/20.jpg", "images/21.jpg", "images/22.jpg", "images/23.jpg", "images/24.jpg",
"images/25.jpg", "images/26.jpg", "images/27.jpg", "images/28.jpg", "images/29.jpg",
"images/30.jpg", "images/31.jpg", "images/32.jpg", "images/33.jpg", "images/34.jpg");
//还可以进行如下的设置
//window.imageSlide.setAutoPlay(false); //是否自动播放
//window.imageSlide.setBoxId("myImageSlide"); //设置播放容器的ID
//window.imageSlide.setDelay(8); //设置播放延时
//window.imageSlide.setTransform(18); //设置切换效果
window.imageSlide.setSize(640, 320); //设置播放容器的大小
window.imageSlide.display(); //显示
</script>
</div><br />
<span style="color:#EEEEEE;"></span>
</td>
</tr>
</table>
</body>
</html>ImageSlide-1.0.0.iclass.js:function ImageSlide () {
if((/MSIE\s*[5-9]/).test(navigator.appVersion)) {
this.count = 0;
this.timer = null;
this.first = new Object();
this.frms = new Array(); this.imgs = new Array();
this.width = 640;
this.height = 480;
this.boxId = "imageSlideBox";
this.delay = 5;
this.autoPlay = true;
this.transform = 23;
/**
* 播放切换效果说明
* --------------
* 0. 矩形缩小
* 1. 矩形扩大
* 2. 圆形缩小
* 3. 圆形扩大
* 4. 从下到上
* 5. 从上到下
* 6. 从左到右
* 7. 从右到左
* 8. 竖百叶窗
* 9. 横百叶窗
* 10. 错位横百叶窗
* 11. 错位竖百叶窗
* 12. 点扩散
* 13. 两边到中间
* 14. 中间到两边
* 15. 中间到上下
* 16. 上下到中间
* 17. 右下到左上
* 18. 右上到左下
* 19. 左上到右下
* 20. 左下到右上
* 21. 横条
* 22. 竖条
* 23. 随机
* --------------
*/
}
else {
alert("请使用IE5或IE5以上版本的浏览器使用本程序!");
}
}//加入一张或多张图片(传入一个或多个图片路径)
//pushImg(sPath1 [, sPath2 [, sPath3 [, ...]]])
ImageSlide.prototype.pushImgs = function () {
for (var i = 0; i < arguments.length; i++)
this.imgs.push(arguments[i]);
}//设置图片播放容器的长宽
ImageSlide.prototype.setSize = function (nWidth, nHeight) {
this.width = nWidth;
this.height = nHeight;
}//设置图片播放容器的ID
ImageSlide.prototype.setBoxId = function (sBoxId) {
this.boxId = sBoxId;
}//设置是否自动播放
ImageSlide.prototype.setAutoPlay = function (bAutoPlay) {
this.autoPlay = bAutoPlay;
}//设置自动播放的延时秒数
ImageSlide.prototype.setDelay = function (nSeconds) {
this.delay = nSeconds;
}//设置播放的切换效果(0-23的整数)
ImageSlide.prototype.setTransform = function (nTransform) {
this.transform = nTransform;
}//显示
ImageSlide.prototype.display = function () {
var boxStr = "<div style='width:" + this.width + "px;height:" + this.height + "px;' ";
boxStr += "id='" + this.boxId + "'><div ";
if (this.autoPlay)
boxStr += "onclick='window.imageSlide.play();window.imageSlide.timerPlay();'";
else
boxStr += "onclick='window.imageSlide.play();'";
boxStr += "style='word-break:keep-all;width:100%;height:100%;background-color:#EEEEEE;'>";
if (this.autoPlay)
boxStr += "<br /> 点击此处开始进行自动播放……";
else
boxStr += "<br /> 点击此处开始播放,播放时单击播放下一张……";
boxStr += "</div>";
var img;
var transform = this.transform;
for (var i = 0; i < this.imgs.length; i++) {
if (this.transform >= 23)
var transform = Math.floor(Math.random()*23);
boxStr += "<img src='" + this.imgs[i] + "' style='display:none;width:";
boxStr += this.width + ";height:" + this.height + "px;height:px;filter:";
boxStr += "revealTrans(transition=" + transform + ",duration=1);'";
if (!this.autoPlay)
boxStr += "' onclick='window.imageSlide.play();' alt='点击播放下一张'";
boxStr += " />";
}
boxStr += "</div>";
document.writeln(boxStr);
var box = document.getElementById(this.boxId);
this.first = box.childNodes[0];
this.frms = box.getElementsByTagName("IMG");
}//播放
ImageSlide.prototype.play = function () {
if (window.imageSlide.imgs.length) {
window.imageSlide.first.style.display = "none";
if (window.imageSlide.count >= window.imageSlide.imgs.length) {
alert("播放完毕!");
window.imageSlide.frms[window.imageSlide.count-1].style.display = "none";
window.imageSlide.first.style.display = "block";
window.imageSlide.first.innerHTML = "<br /> 点击此处再次进行播放!";
clearInterval(window.imageSlide.timer);
window.imageSlide.count = 0;
}
else if (window.imageSlide.count == 0) {
window.imageSlide.first.style.display = "none";
window.imageSlide.frms[0].filters[0].apply();
window.imageSlide.frms[0].style.display = "block";
window.imageSlide.frms[0].filters[0].play();
}
else {
window.imageSlide.frms[window.imageSlide.count-1].style.display = "none";
window.imageSlide.frms[window.imageSlide.count].filters[0].apply();
window.imageSlide.frms[window.imageSlide.count].style.display = "block";
window.imageSlide.frms[window.imageSlide.count].filters[0].play();
}
window.imageSlide.count++;
}
else {
alert("你没有放入任何图片,无法进行播放!");
}
}//连续播放
ImageSlide.prototype.timerPlay = function () {
this.timer = setInterval(this.play, this.delay * 1000);
}//实例化一个ImageSlide对象imageSlide并将其做为window对象的一个子对象
window.imageSlide = new ImageSlide();
感觉msn的spaces上相册的图片播放做的更漂亮些。