調整交替背景圖像以適合屏幕

稍微背景 - 我通過交易編寫java，python，c＃和hacky shell腳本，並且幾乎沒有javascript經驗（從今天開始）。我一直在四處挖掘，到目前爲止，沒有任何一個關於stackoverflow的問題已經奏效（或者，我可能沒有js的訣竅可以使它們工作）。調整交替背景圖像以適合屏幕

無論如何，故事 - 我想要一個頁面，其中背景在本地存儲的一組預定圖像（bg01.jpg到bgXX.jpg）之間切換。我已經想出瞭如何循環顯示圖像，現在我希望這些圖像能夠真正適合文檔背景......而不僅僅是......做他們自己的事情。

這裏是我到目前爲止（工作） - （編輯10月15日）

<!DOCTYPE html> 
<html> 
<style> 
body {background-repeat:no-repeat;} 
</style> 
<body> 

<script> 

var bgslides=new Array() 
bgslides[0]="bg01.jpg" 
bgslides[1]="bg02.jpg" 
bgslides[2]="bg03.jpg" 
bgslides[3]="bg04.jpg" 
bgslides[4]="bg05.jpg" 


//Specify interval between slide (in miliseconds) 
var speed=1000 

//preload images 
var processed=new Array() 
for (i=0;i<bgslides.length;i++){ 
    processed[i]=new Image() 
    processed[i].src=bgslides[i] 
} 

var inc=-1 
function slideback(){ 
if (inc<bgslides.length-1) 
    inc++ 
else 
    inc=0 
document.body.style.backgroundImage = "url("+bgslides[inc]+")"; 
} 

if (document.all||document.getElementById) 
window.onload=new Function('setInterval("slideback()",speed)') 


</script> 
</body> 
</html>

我已經試過

image.width = .. 
image.height = ..

但我認爲，在調用

document.body.background = image.src

覆蓋以前的更改image.width ..不是我有很多線索。我也嘗試了幾個不同的調整大小的函數，我發現了這個地方並進行了修改，並試圖改變js和迄今爲止的css（該部分？）..nada。

有沒有什麼我可以插入這個讓它愉快地調整大小？！

來源

2013-10-14 user2877564

相反document.body.background行，你有沒有想過像

document.body.style.backgroundImage = "url("+bgslides[inc]+")";

的幾個注意事項。 - 「新的圖像（）」與標籤一起使用，但不是預加載圖像，您不會將其用於CSS背景。 - 儘管JavaScript不需要它，但強烈建議用分號結束語句。 - 您有一行「processed [i] .size =」，它未定義。 - 在else語句中還應包含「document.body.background = processed [inc] .src」，但它應該在整個if/then之外。

來源

2013-10-14 05:05:18

啊我一定錯過了複製/粘貼/編輯時的尺寸線 - 很好的發現！我爲'document.body.style.backgroundImage =「url（」+ bgslides [inc] +「）」;'換了'document.body.background = processed [inc] .src';' - 沒有明顯的變化。此外，事實證明，它必須位於其他部分，否則代碼似乎根本不起作用。呵呵。這並不是說爲什麼甚至在webconsole中。 – user2877564

在您的演示代碼中，您仍然在else語句中包含該行，因此大部分時間都不會調用它。另外，「if（document.all || document.getElementById）」返回false，您從不設置超時。我不確定你爲什麼要這麼叫。我不認爲「功能」應該大寫。甚至打電話。我不認爲你需要window.onload。你可能只想要setInterval調用。 –

嗨，如果你指的是「document.body.style.backgroundImage =」url（「+ bgslides [inc] +」）「;」那麼正如我所說，如果我把它放在if else段之外，代碼根本不起作用。我不知道爲什麼 - 它只是沒有。我不確定它爲什麼要求這樣做 - 我發現代碼段在某個地方，而且它是第一個在半小時內拖網後工作的塊。我很樂意嘗試一種不同的風格，如果你願意介紹它。 – user2877564

調整交替背景圖像以適合屏幕

回答

相關問題