Question

我有5个用于滑动的图像，需要为html中的所有5个图像页面添加下拉框，因为第一个图像幻灯片下拉框的大小是固定的并且可以点击但是对于剩下的四个图像页面，下拉框很小而且也不可点击，这似乎是一个奇怪的问题，谷歌搜索很多，但无法得到与我的问题相关的解决方案。

CSS

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>

下拉框中的问题（HTML）

0 个答案: