我想改變形象我的網頁上隨時間

例子，我想顯示前10秒image1.jpg，然後image2.jpg爲接下來的10秒我想改變形象我的網頁上隨時間

<HTML> 
    <body> 
    <img src="image1.jpg" aftersometime='this.src="image2.jpg"' /> 
     <!-- --> 
    </body> 
</HTML>

來源

2014-03-19 RahulGoel

https://developer.mozilla.org/en/docs/Web/API/ window.setInterval – Quentin

你使用的是jQuery，還是想要純JavaScript解決方案？ – ProllyGeek

@laaposto不要以這種方式編輯問題！雖然有些事情並不是真的需要在問題中發佈，但它不應該丟失OP的代碼至少 –

嘗試：

HTML：

<img id ="image" src="/image1.jpg" />

JS：

setInterval(function(){ 
var src=document.getElementById("image").src; 
    if(src.indexOf("image1") != -1){ 
    document.getElementById("image").src="image2.jpg" 
    } 
    else{ 
    document.getElementById("image").src="image1.jpg" 
    } 


},10000);

DEMO

來源

2014-03-19 13:36:17 laaposto

發現這對老堆棧溢出問題嘗試了這一點:)

javascript Change background Based on Time

檢查它通過鏈接。的代碼主片低於

</body> 
    <script type="text/javascript"> 
     var currentTime = new Date().getHours(); 
     if(5 < currentTime && currentTime < 18){ 
      if (document.body) { 
       document.body.background = 'images/bg-day.png'; 
      } 
     } else { 
      if (document.body) { 
       document.body.background = 'images/bg-night.png'; 
      } 
     } 
    </script>

來源

2014-03-19 13:32:55 Kieranmv95

對不起，沒有意識到現在會抓住它:) – Kieranmv95

如何配置時間？ –

@IanBrindley我以爲你可以在頁面上做到這一點，不管長時間他們在頁面上從theron它將會實現 – Kieranmv95

使用此

圖片代碼

<img src="image1.jpg" id="changeimg" aftersometime='this.src="image2.jpg"' />

的Javascript

setInterval(function(){ 
     $("#changeimg").attr("src",""); 
    },10000);

你必須建立這個代碼用數組....

來源

2014-03-19 13:34:12

你可以通過使用類似

YourElementSelector.setAttribute用javascript函數很容易做到這一點（「SRC」，「路徑TO-你的形象「）;

您將只需創建一個功能，根據您選擇的時間間隔切換圖像路徑。

或者，您可以將圖像設置爲背景圖像，並使用JavaScript更改CSS以指向您所需的新背景。

來源

2014-03-19 13:34:38

你的IMG需要一個ID

<img id="myimg" src="image1.jpg" />

在JavaScript中，你可以做類似的東西：

var IMG_URL1 = "image1.jpg" 
var IMG_URL2 = "image2.jpg" 

setInterval(function() { 
    var myimg = document.getElementById('myimg'); 
    if (myimg.src === IMG_URL1) { 
     myimg.src = IMG_URL2; 
    } else { 
     myimg.src = IMG_URL1; 
    } 
}, 10000);

來源

2014-03-19 13:36:55 Roberto

的功能你需要的是window.setInterval（）或window.setTimeout（）的時序和類似的document.getElementById（）的東西的setAttribute（。「SRC」，「NEWPATH」）;

如果你想用一個新的屬性來完成它，例如aftersometime =「」我會建議把它稱爲data-aftersometime =「」（根據HTML5標準），而忽略了這一點。SRC一部分，你需要一個ID：

IMG代碼：

<img src="image1.jpg" id="myimage" data-aftersometime="image2.jpg" />

JavaScript代碼：

setTimeout(function() { 
    var imgref = document.getElementById("myimage"); 
    imgref.setAttribute("src", imgref.getAttribute("data-aftersometime")); 
}, 10*1000);

來源

2014-03-19 13:45:30

我想改變形象我的網頁上隨時間

回答

相關問題