㈠ 用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
判斷目錄下存在文件就輸出，不存在就不輸出