我正在製作一張桌子的網站。每個單元應該有它自己的背景圖像。我選擇將這些圖像放在一個數組中。我做了一個功能,創建一個與作爲背景的照片和作爲文本的照片。我的代碼是在:顯示陣列中的背景照片
var meme = [
'memes/0.jpg',
'memes/1.jpg',
'memes/2.jpg',
'memes/3.jpg',
'memes/4.jpg',
'memes/5.jpg',
'memes/6.jpg',
'memes/7.jpg',
'memes/8.jpg',
'memes/9.jpg',
'memes/10.jpg',
'memes/11.jpg'];
var author = [
'avelan',
'avelan',
'tjespe',
'tjespe',
'avelan',
'avelan',
'avelan',
'jakoo',
'avelan',
'avelan',
'email',
'email'];
function memeDisplay (i) {
for (i=0; i<meme.length; i++) {
return ("<div class='meme' style='background-image:url(" + meme[i] + ")'>av " + author[i] + "</div>");
}
}
body {
margin:0px;
background:#FFFFFF;
background-image: url("jpg/dolan-wallpaper.jpg");
background-repeat: no-repeat;
background-attachment: fixed;
background-position: right bottom;
}
.header-cont {
width:100%;
position:fixed;
top:0px;
}
.header {
height:100px;
background:#303030;
border:1px solid #CCC;
width:960px;
margin: auto;
color: #FFFFFF;
font-size: 300%;
font-family: monaco;
vertical-align: central;
text-align:center;
}
.subheader {
height:100px;
background:#303030;
border:1px solid #CCC;
width:960px;
margin: auto;
color: #FFFFFF;
font-size: 100%;
font-family:monaco;
vertical-align: central;
text-align:center;
}
.content {
width:960px;
background: #303030;
border: 1px solid #CCC;
margin: 70px auto;
}
.meme {
width:300px;
height:300px;
background-position:center;
margin:auto;
font-family:monaco;
vertical-align: text-bottom;
text-align: right;
color: white;
}
a {
color:white
}
<!DOCTYPE html>
<head>
<link rel="stylesheet" type="text/css" href="css/main.css">
<script type="text/javaScript" src="js/script.js"></script>
<meta charset="UTF-8">
</head>
<body style="background-image: url('jpg/dolan-wallpaper.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: right bottom;">
<div class="header">
Olans bæste memes
</div><br><br><br>
<div class="subheader"><br>
Dette er vår offisielle nettside for memes. Her legger vi jevnlig ut asom memes til offentligheten. Vi lager omtrent alle selv. På hvert meme står det hvem som er forfatteren. Under ser du forhåndsvisninger av alle memesene vi har lagt ut. Bare trykk på de for å se hele bildet.
</div>
<div class="content">
<table style="width:100%">
<tr></tr>
<tr>
<td><a href="meme[0]"><script>memeDisplay(0)</script></a></td>
<td><a href="meme[1]"><script>memeDisplay(1)</script></a></td>
<td><a href="meme[2]"><script>memeDisplay(2)</script></a></td>
</tr>
<tr>
<td><a href="meme[3]"><script>memeDisplay(3)</script></a></td>
<td><a href="meme[4]"><script>memeDisplay(4)</script></a></td>
<td><a href="meme[5]"><script>memeDisplay(5)</script></a></td>
</tr>
<tr>
<td><a href="meme[6]"><script>memeDisplay(6)</script></a>
<td><a href="meme[7]"><script>memeDisplay(7)</script></a></td>
<td><a href="meme[8]"><script>memeDisplay(8)</script></a></td>
</tr>
<tr>
<td><a href="meme[9]"><script>memeDisplay(9)</script></a></td>
<td><a href="meme[10]"><script>memeDisplay(10)</script></a></td>
<td><a href="meme[11]"><script>memeDisplay(11)</script></a></td>
</tr>
</table>
</div>
</body>
我的問題是,當我訪問的網站沒有在表中顯示出來。 如果有人能幫我弄清楚有什麼不對,我將非常感激。
有很多事情錯在你的代碼......這不是在所有的JS是如何工作的。 – blex
把它歸結爲最基本的問題,並從那裏採取。去掉所有不必要的html,css,js和數組元素,真正的問題會讓你盯着你。 – user3791372