Question

我有一个名为pgwslidemaster的jquery滑块。幻灯片本身完全响应。当我把它放在我的桌子里时，它变得没有反应。

这是我的代码：

<div style="background-color:#e9e9e9; border-top-color:#FFF; border-top-style:solid; border-top-width:1px;">

   <center><div style="margin-top:10px; width:100%; margin-bottom:10px;">
   <ul class="pgwSlideshow">


   <li><img src="PgwSlideshow-master/san-francisco.jpg" alt="San Francisco, USA" data-description="Golden Gate Bridge"></li>
    <li><img src="PgwSlideshow-master/rio.jpg" alt="Rio de Janeiro, Brazil"></li>
    <li><img src="PgwSlideshow-master/london.jpg" alt=""></li>
    <li><img src="PgwSlideshow-master/new-york.jpg" alt=""></li>
    <li><img src="PgwSlideshow-master/new-delhi.jpg" alt=""></li>
    <li><img src="PgwSlideshow-master/paris.jpg" alt=""></li>
    <li><img src="PgwSlideshow-master/sydney.jpg" alt=""></li>



</ul>
</div></center></div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="PgwSlideshow-master/pgwslideshow.js"></script>
<script>
$(document).ready(function() {
    var pgwSlideshow = $('.pgwSlideshow').pgwSlideshow();
    pgwSlideshow.stopSlide();

});
</script>

当我把它放入我的td时，它突然变得无法响应：

<tr style="display:table-row">
    <td height="80" style="display:table-cell"><div id="wrapper-bottom"><span style="font-size:15px;"><img src="images/icon-info.png" width="29" height="29" align="left" style="margin-right:15px; margin-bottom: 15px;"/><span style="text-transform:uppercase; color: #E73227; font-weight: 700; font-size: 25px;">Property Name</span><br />
    Location: <span style="color:#666">Place</span></span></div></td>
  </tr>
  <tr>
   <td align="left" style="" ><div style="background-color:#e9e9e9; border-top-color:#FFF; border-top-style:solid; border-top-width:1px;">

   <center><div style="margin-top:10px; width:100%; margin-bottom:10px;">
   <ul class="pgwSlideshow">


   <li><img src="PgwSlideshow-master/san-francisco.jpg" alt="San Francisco, USA" data-description="Golden Gate Bridge"></li>
    <li><img src="PgwSlideshow-master/rio.jpg" alt="Rio de Janeiro, Brazil"></li>
    <li><img src="PgwSlideshow-master/london.jpg" alt=""></li>
    <li><img src="PgwSlideshow-master/new-york.jpg" alt=""></li>
    <li><img src="PgwSlideshow-master/new-delhi.jpg" alt=""></li>
    <li><img src="PgwSlideshow-master/paris.jpg" alt=""></li>
    <li><img src="PgwSlideshow-master/sydney.jpg" alt=""></li>



</ul>
</div></center></div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="PgwSlideshow-master/pgwslideshow.js"></script>
<script>
$(document).ready(function() {
    var pgwSlideshow = $('.pgwSlideshow').pgwSlideshow();
    pgwSlideshow.stopSlide();

});
</script>
</td>
  </tr>

为什么会发生这种想法？

Answer 1

我删除了所有表格元素并用div替换它们。这完全解决了我的问题，页面现在为每个元素调整大小。

我的UL在放入TD时没有响应

1 个答案: