中心Javascript幻燈片？

我在編碼方面很初學，而且我遇到的大部分答案都直接超出了我的頭。我必須讓我的幻燈片工作（這是工作）的唯一代碼：中心Javascript幻燈片？

<script type="text/javascript"> 
<!--> 
var image1=new Image() 
image1.src="congo.jpg" 
var image2=new Image() 
image2.src="snow.jpg" 
var image3=new Image() 
image3.src="mekong.jpg" 
//--> 
</script>

，並在主體部分：

<img src="congo.jpg" name="slide" width="400" height="300"> 
<script type="text/javascript"> 
<!-- 
var step=1 
function slideit(){ 
document.images.slide.src=eval("image"+step+".src") 
if(step<3) 
step++ 
else 
step=1 
setTimeout("slideit()",2500) 
} 
slideit() 
//--> 
</script>

我不知道如何中心這或將在保證金。我試着把它放在一張桌子裏，這樣我就可以操縱它的位置，這不起作用（假設它不那麼容易），並試着用標籤來中心化，但我只是扯着繩子！什麼是添加保證金/中心的正確方法？謝謝。

來源

2015-04-22 Jessica

你可以嘗試添加文本對齊中心到圖像標記的父元素。 –

你只需要把<div>放在你的幻燈片上，然後把text-align:center應用到div上。

<div style="text-align:center;"> 
    <img src="congo.jpg" name="slide" width="400" height="300"> 
</div>

快速和骯髒的例子：https://jsfiddle.net/pbsz9spu/

來源

2015-04-22 17:53:37 PaddyMack

這很有道理。我認爲這是我的想法，但是我現在還沒有結束嘗試。像魅力一樣工作！謝謝噸！ – Jessica

您還應該在這裏閱讀其他答案。避免內聯樣式。我只用它作爲例子。如果有的話，將樣式放入你的CSS樣式表中。 – PaddyMack

/*css*/ 

.slideshowContainer { 
position:relative; 
width:400px; 
height:300px; 
margin:0 auto; 
clear:both; 
} 



<!-- HTML --> 


<div class="slideshowContainer"> 
<img src="congo.jpg" name="slide" width="400" height="300"> 
</div>

總是試圖用CSS樣式表或在頁面的頭部風格你的div。儘量避免像div style =「」一樣內嵌樣式。這是不好的做法。

來源

2015-04-22 18:00:50 Charlie

中心Javascript幻燈片？

回答

相關問題