html中,如何动态显示几个图片,就是从左到右依次显示5张图片 10

还是自己解决了,用的animate... 还是自己解决了,用的animate 展开
 我来答
生活知识小超人
高粉答主

2020-05-21 · 醉心答题,欢迎关注
知道答主
回答量:2078
采纳率:50%
帮助的人:92.5万
展开全部

1、新建一个html文件,命名为test.html,在test.html文件内,使用img标签创建一张图片,图片是images文件夹下面的1.jpg。

2、为了展示隐藏图片后的效果,在img标签的外部使用div标签,同时设置div标签的class属性为mydiv。

3、在test.html文件内,编写<style type="text/css"></style>标签,页面的css样式将写在该标签内。

4、在css标签内,设置类名为mydiv的样式,使用border设置div的边框为1px的灰色边框,使用width设置div的宽度为300px,使用height设置div的高度为300px。

5、在css标签内,对img元素进行样式设置,将display属性设置为none,实现图片的隐藏。

6、在浏览器打开test.html文件,查看实现的效果。

博思aippt
2024-07-20 广告
作为深圳市博思云创科技有限公司的工作人员,对于Word文档生成PPT的操作,我们有以下建议:1. 使用另存为功能:在Word中编辑完文档后,点击文件->另存为,选择PowerPoint演示文稿(*.pptx)格式,即可将文档内容转换为PPT... 点击进入详情页
本回答由博思aippt提供
小卡卡张
推荐于2018-03-02 · 超过13用户采纳过TA的回答
知道答主
回答量:63
采纳率:0%
帮助的人:23.5万
展开全部
用js+css来实现。下面是两张图片的显示。
<html>
<head>
<title>图片的显示</title>
<style type="text/css">
<!--
#bg1 {
position:absolute;
width:162px;
height:115px;
z-index:1;
}
#bg2 {
position:absolute;
width:162px;
height:115px;
z-index:1;
left: 1px;
top: 1px;
display:none;
}
#b1 {
position:absolute;
width:22px;
height:21px;
z-index:2;
left: 60px;
top: 201px;
}
#b2 {
position:absolute;
width:22px;
height:24px;
z-index:3;
left: 84px;
top: 203px;
}
-->
</style>
<script>
function showbg1(){
document.getElementById("bg1").style.display="block";
document.getElementById("bg2").style.display="none";

}
function showbg2(){
document.getElementById("bg1").style.display="block";
document.getElementById("bg2").style.display="block";
}
</script>
</head>

<body>
<div id="bg1"><img src="mao.jpg" width="160" height="180" />
<div id="bg2"><img src="haitun.jpg" width="160" height="180" /></div>
</div>

<p> </p>
<div id="b1" onmousemove="showbg1()"><img src="b1.png" width="22" height="20" /></div>
<div id="b2" onmousemove="showbg2()"><img src="b2.png" width="18" height="19" /></div>
</body>
</html>
追问
就像这2张图片的,b1和b2,b2显示要比b1延迟一点,0.3秒吧,后面再有图片,用DIV分的,就这样依次都有延迟,就像是动态的从左向右显示的,能不能做出这个效果呢?
追答
暂时做不出来  如果有了答案   麻烦通知一下  谢谢
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
第一懒人
2015-10-17 · TA获得超过192个赞
知道答主
回答量:91
采纳率:83%
帮助的人:44.7万
展开全部
这是我截取的一小段:

<marquee width="968" height="180" onMouseOver= stop() onMouseOut=start() scrollamount="3" loop=infinte deplay="0">
<a href="#"><img src="index4/1_small.jpg"></a>
<a href="#"><img src="index4/2_small.jpg"></a>
<a href="#"><img src="index4/3_small.jpg"></a>
<a href="#"><img src="index4/4_small.jpg"></a>
<a href="#"><img src="index4/5_small.jpg"></a>
</marquee>
实际上用的是html中的marquee,具体的marquee的用法可以去百度,我就不细说了。
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
范小旭丶
2012-04-23 · 超过17用户采纳过TA的回答
知道答主
回答量:110
采纳率:0%
帮助的人:37.5万
展开全部
懒人上有
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式