Javascript 下拉框中的问题(HTML)
我有5个图像用于刷卡,需要为html中的所有5个图像页面添加下拉框,因为第一个图像幻灯片下拉框的大小是固定的,可以单击,但对于剩余的4个图像页面,下拉框很小,也不能单击,这似乎是一个奇怪的问题,谷歌搜索了很多,但无法找到与我的问题相关的解决方案 cssJavascript 下拉框中的问题(HTML),javascript,jquery,html,css,drop-down-menu,Javascript,Jquery,Html,Css,Drop Down Menu,我有5个图像用于刷卡,需要为html中的所有5个图像页面添加下拉框,因为第一个图像幻灯片下拉框的大小是固定的,可以单击,但对于剩余的4个图像页面,下拉框很小,也不能单击,这似乎是一个奇怪的问题,谷歌搜索了很多,但无法找到与我的问题相关的解决方案 css html { height: 100%; } body { margin: 0; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 1.5; p
html {
height: 100%;
}
body {
margin: 0;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
line-height: 1.5;
position: relative;
height: 100%;
}
.swiper-container {
width: 90%;
height: 100%;
color: #fff;
text-align: center;
}
.red-slide {
background: "file:///android_res/drawable/r9.jpg";
}
.blue-slide {
background: "file:///android_res/drawable/br.jpeg";
}
.orange-slide {
background: "file:///android_res/drawable/br.jpeg";
}
.green-slide {
background: "bb1.jpg";
}
.pink-slide {
background: "bb1.jpg";
}
.swiper-slide .title {
font-style: italic;
font-size: 42px;
margin-top: 80px;
margin-bottom: 0;
line-height: 45px;
}
.pagination {
position: absolute;
z-index: 20;
left: 10px;
bottom: 10px;
}
.swiper-pagination-switch {
display: inline-block;
width: 8px;
height: 8px;
border-radius: 8px;
background: #222;
margin-right: 5px;
opacity: 0.8;
border: 1px solid #fff;
cursor: pointer;
}
.swiper-visible-switch {
background: #aaa;
}
.swiper-active-switch {
background: #fff;
}
.wrapper {
text-align: center;
}
.button {
position: absolute;
top: 50%;
}
html
<body style="padding:0px 0px;">
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide red-slide">
<img src="file:///android_res/drawable/a.jpg" >
<div class="wrapper">
<div class="button" >
<div id="ddmenu">
<ul>
<li>SHARE
<div>
<div class="column">
<a id="sendFacebook" onclick="share(3)" href="#">Email</a>
<a id="sendMMS" onclick="share1(3)" href="#">MMS</a>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="swiper-slide blue-slide">
<img src="file:///android_res/drawable/b.jpg" >
<div class="wrapper">
<div class="button" >
<div id="ddmenu">
<ul>
<li>SHARE
<div>
<div class="column">
<a id="sendFacebook" onclick="share(4)" href="#">Email</a>
<a id="sendMMS" onclick="share1(4)" href="#">MMS</a>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
- 分享
- 分享
div id->表示页面上只有一个div class->页面上有多个相同名称的id。尝试将它们更改为类。感谢您的回复,我明白了您的意思,并且我在css文件中将id#ddmenu改为.ddmenu,但仍然无法获得它,因为在js文件中有一个名为getElementsbyId@Thomaswood的函数。一个简单的修复方法是给它们一个“ddmenu”类和一个“ddmenu-#”id