Question

我需要在我网站上的幻灯片放映中心放置一个图像。有什么方法可以做到吗？下面的幻灯片代码。

<script type="text/javascript">
<!-->
var image1=new Image()
image1.src="One.jpg"
var image2=new Image()
image2.src="Two.jpg"
var image3=new Image()
image3.src="Three.jpg"

//-->
</script>
</head>
<body>

<center>
<img src="One.jpg" name="slide" width="1500" height"1500">
<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>
</center>

Answer 1

尝试这样

.slideshow-div {
position: relative; 
z-index:1;

}
#image-class{
    position: absolute; 
    top: 200px;
    z-index:2;

}

其中slideshow-div是幻灯片容器的类并且image-class是您图片的类别。

http://jsfiddle.net/TDSFF/22/

这使图像显示在幻灯片放映上..

Answer 2

您可以将父div（在本例中为body）设置为text-align：center;并将每个幻灯片显示为内嵌块：

body {
    text-align: center;
}

body img {
    display: inline-block;
}

如何将图像放在幻灯片放映的中心？

2 个答案: