IE-Bug的jQuery的滑塊

我添加一個jQuery滑塊到我的網頁（BXSlider），該罰款的作品幾乎每一頁（在每個瀏覽器），除了這一個在IE（7 & 8）。IE-Bug的jQuery的滑塊

滑塊內的圖像得到加載，但比它顯示了一個大的空白，而不是滑動表（是的，它需要一個表在這一點）！

遺憾的發佈鏈接，但我不能出這個人物之一，我不知道我應該在這裏添加哪些代碼...是一個CSS問題或JQuery的/ JavaScript的關係嗎？

我希望有人能指出我朝着正確的方向...

非常感謝，約亨

2013-02-01 Jochen Schmidt

爲什麼它必須是表格，腳本會因此產生不正確的html。 bxslider在包含圖像的td之外包裝爲div，所以你有一個table> tr> div> div> td，這可能是ie「bug」的原因，在這種情況下，它不是一個bug。 –

正如我上面的評論中提及。你實現滑塊的方式會產生不正確的html。該bxslider包裝兩個div包含您的圖片TD之外，讓你得到像這樣的HTML結構：表> TR> DIV> DIV> TD，這是IE有問題的原因 - 和瀏覽器是正確的接着就，隨即。如果你無法擺脫表（我寧願）的執行以下操作：

修改您的滑塊表的HTML這樣的：

<table border="0"> 
    <tbody> 
     <tr> 
      <td> 
       <div class="bx-box">[.. YOUR LINKS AND IMAGES .. ]</div> 
      </div> 
     </tr> 
    </tbody> 
</table>

在JS做到這一點：

$(function(){ 
    // change your your selector to the nested div container 
    // and tada it works in ie too. 
    $('td .bx-box').bxSlider({ 
     infiniteLoop: true, 
     hideControlOnEnd: true 
    }); 
});

現在代碼保持有效後bxSlider增加了包裝的div周圍和滑塊顯示了跨瀏覽器。你會發現一個demo here。爲自己一個忙，驗證你的代碼，裏面有更多的錯誤（雙關閉標籤和其他），這可能會導致最奇怪的佈局行爲。

來源

2013-02-01 16:04:28

寫了一些與此非常相似的東西，但現在沒有意義。有一個upvote。 –

謝謝你，真的幫了我很多忙！ –

IE-Bug的jQuery的滑塊

回答

相關問題