㈠ 用javascript怎么循环显示三张图片
我写了一个demo 你可以参考一下
<!doctypehtml>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>sildeimagedemo</title>
<style>
.stage{
display:flex;
margin:100pxautoautoauto;
width:400px;
height:400px;
overflow:hidden;
}
</style>
<script>
window.addEventListener('load',function(){
//设置3个图片的地址
varimgSrcs=['1.jpg','2.jpg','3.jpg'];
//设置滚动间隔时间(毫秒)
varinterval=1000;
varviewer=document.getElementById('viewer');
varcurrent=0;
varlen=imgSrcs.length;
varsetImage=function(){
viewer.src=imgSrcs[current];
current=++current>len-1?0:current;
};
setImage();
setInterval(setImage,interval);
});
</script>
</head>
<body>
<divclass="stage">
<imgid="viewer"src="#"alt="">
</div>
</body>
</html>
㈡ js中使用dowhile循环显示多张图片
你运行下一段代码,确实是输出的2个3。。。第二段没啥问题。但是第一段确实不清楚
㈢ javascript如何输出图片
document.write("<img src='显示图片地址' />");
㈣ js中如何利用循环数组得到一个随机的图片
var arr=["1.jpg","2.jpg","3.jpg","4.jpg".......];
var oImg=Math.floor(Math.random()*arr.length) //随机图
img.src="./img/"+arr[oImg]; //img元素得到img文件夹下面的某张图片
㈤ 在网页中让图片循环显示用javascript怎么做
或者用数组。
声明个全局的变量 var i=0;
然后下面的写在函数里
var img=new Array();
img[0]="<img src='路径'>";
img[1]="<img src='路径'>";
有多少图片,就给多少个img[]
if(i>你那个数组的长度){
i=0;
}
然后就是找到body里面的img标签。得要个ID="img1"哈。然后
document.getElementById("img1").src=img[i];
然后在函数外面写一个setInterval("函数名()",1000)。
㈥ 网页怎样循环显示图片,JS。
可以测试一下以下代码:
<SCRIPTLANGUAGE="JavaScript">
<!--Begin
varrotate_delay=5000;//delayinmilliseconds(5000=5secs)
current=0;
functionnext(){
if(document.slideform.slide[current+1]){
document.images.show.src=document.slideform.slide[current+1].value;
document.slideform.slide.selectedIndex=++current;
}
elsefirst();
}
functionprevious(){
if(current-1>=0){
document.images.show.src=document.slideform.slide[current-1].value;
document.slideform.slide.selectedIndex=--current;
}
elselast();
}
functionfirst(){
current=0;
document.images.show.src=document.slideform.slide[0].value;
document.slideform.slide.selectedIndex=0;
}
functionlast(){
current=document.slideform.slide.length-1;
document.images.show.src=document.slideform.slide[current].value;
document.slideform.slide.selectedIndex=current;
}
functionap(text){
document.slideform.slidebutton.value=(text=="Stop")?"Start":"Stop";
rotate();
}
functionchange(){
current=document.slideform.slide.selectedIndex;
document.images.show.src=document.slideform.slide[current].value;
}
functionrotate(){
if(document.slideform.slidebutton.value=="Stop"){
current=(current==document.slideform.slide.length-1)?0:current+1;
document.images.show.src=document.slideform.slide[current].value;
document.slideform.slide.selectedIndex=current;
window.setTimeout("rotate()",rotate_delay);
}
}
//End-->
</script>
<center>
<formname=slideform>
<tablecellspacing=1cellpadding=4bgcolor="#000000">
<tr>
<tdalign=centerbgcolor="white">
<b>图片循环</b>
</td>
</tr>
<tr>
<tdalign=centerbgcolor="white"width=200height=150>
</td>
</tr>
<tr>
<tdalign=centerbgcolor="#C0C0C0">
<selectname="slide"onChange="change();">
<optionvalue="图片地址"selected>图片
<optionvalue="图片地址">图片
<optionvalue="图片地址">图片
<optionvalue="图片地址">图片
<optionvalue="图片地址">图片
<optionvalue="图片地址">图片
<optionvalue="图片地址">图片
<optionvalue="图片地址">图片
<optionvalue="图片地址">图片
<optionvalue="图片地址">图片
</select>
</td>
</tr>
<tr>
<tdalign=centerbgcolor="#C0C0C0">
<inputtype=buttononClick="first();"value="|<<"title="Beginning">
<inputtype=buttononClick="previous();"value="<<"title="Previous">
<inputtype=buttonname="slidebutton"onClick="ap(this.value);"value="Start"title="AutoPlay">
<inputtype=buttononClick="next();"value=">>"title="Next">
<inputtype=buttononClick="last();"value=">>|"title="End">
</td>
</tr>
</table>
</form>
</center>
JavaScript是属于网络的脚本语言!JavaScript被数百万计的网页用来改进设计、验证表单、检测浏览器、创建cookies,以及更多的应用。
㈦ javascript 循环显示图片
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript">
var img=new Array();
img[0]="img-1.jpg";
img[1]="img-2.jpg";
img[2]="img-3.jpg";
//图片可以自己增加
var index=0;
function show(){
if(index>2){//图片增加了的话,这里2也要改
index=0;
}
document.getElementById("images").src=img[index];
document.getElementById("images").title="图片"+(index+1);
index++;
setTimeout("show()",1000);//1000毫秒是1秒,隔1秒换,2秒就是2000
}
</script>
<title>@title</title>
</head>
<body onload="show();">
<div>
<img id="images" src="image-1.jpg" title="图片1" />
</div>
</body>
</html>
㈧ JS代码实现图片循环的问题
for(i=0;i<7;i++){
imageArray[i]=newImage();
//imageArray[i].src=(i+1)+'.jpg';
imageArray[i].src='/images/'+(i+1)+'.jpg';
}
㈨ JavaScript中怎么输出图片
js输出图片是要获取到图片的所有属性才可以的。
1、图片的尺寸,比如宽和高
2、图片的路径
3、图片的alt属性
参考代码如下:
function show_image(src, width, height, alt) {
var img = document.createElement("img");
img.src = src;
img.width = width;
img.height = height;
img.alt = alt;
// This next line will just add it to the <body> tag
document.body.appendChild(img);
}
㈩ 写了个循环输出图片的js,图片不足时怎么停止循环呢现在虽然不影响前台显示,但图片的地址还是会生成!
你少了一个}吧?
一共才9张图片,你按序编号就行,要么再加个if
判断目录下存在文件就输出,不存在就不输出