Javascript 高级html幻灯片
我目前使用的是一个宣传图片的幻灯片,一切都很好,但我想添加一些东西,如图像过渡(淡入)和右下角的小点显示我正在观看的图像,并有能力切换到另一个图像 我该怎么做 我现在正在处理圆圈按钮,到目前为止代码看起来是这样的Javascript 高级html幻灯片,javascript,html,Javascript,Html,我目前使用的是一个宣传图片的幻灯片,一切都很好,但我想添加一些东西,如图像过渡(淡入)和右下角的小点显示我正在观看的图像,并有能力切换到另一个图像 我该怎么做 我现在正在处理圆圈按钮,到目前为止代码看起来是这样的 <div id="feature-image"> <img id="promo-image" src="images/pentagg.jpg" width="100%" height="800px" name="slide" />
<div id="feature-image">
<img id="promo-image" src="images/pentagg.jpg" width="100%" height="800px" name="slide" />
<script type="text/javascript">
var step=1;
var imagesTotal= 2;
var circleDiv;
function slideit()
{
document.images.slide.src = eval("image"+step+".src");
if(step<imagesTotal)
step++;
else
step=1;
setTimeout("slideit()",5000);
}
slideit();
function createCircles()
{
for (i=0; i<imagesTotal; i++) {
circleDiv = document.createElement('div');
circleDiv.className = 'results';
circleDiv.style.width = '32px';
circleDiv.style.height = '32px';
circleDiv.style.backgroundColor = '#ff4444';
circleDiv.innerHTML = '<span class="msg">Hello world.</span>';
document.getElementsByTagName('feature-image')[0].appendChild(circleDiv);
//document.getElementsByTagName('body')[0].appendChild(circleDiv);
}
}
createCircles();
</script>
</div>
var阶跃=1;
var-imagesTotal=2;
var-circleDiv;
函数slideit()
{
document.images.slide.src=eval(“image”+step+“.src”);
如果(步骤这里有一个部分答案
您可以使用CSS“Hack”排序,通过使包装div具有position:relative
和内部元素具有position:absolute
来定位div底部的圆