bxSlider不能在IE8中工作，除非開發人員工具已激活

我試圖使用bxSlider，而IE8似乎沒有合作。在這個例子中，圖像滑塊被摺疊或者根本不顯示...很難說，因爲當我打開Developer Tools進行調試時，滑塊突然顯示出來，並且看起來都很笨拙。bxSlider不能在IE8中工作，除非開發人員工具已激活

http://www.ilium.com/test/

還有一個類似的問題，其中有一個JavaScript錯誤（在不同的幻燈片插件），通過打開調試控制檯上解決：

jQuery script only working under ie8/9 developer tools

...但IE瀏覽器不會似乎將在我的情況下拋出任何錯誤，並建議修復不適用於/適用於我的情況。另外我不認爲我的腳本中的任何地方都有console.log。我嘗試添加任何數量的腳本，在頁面加載時激活控制檯，但無濟於事。

我試圖旨在解決衝突的JQuery修復（在另一個網站，我還沒有足夠的代表鏈接到建議），改變bxSlider函數調用就像這樣：

<script>// <![CDATA[ 
    $jQ = jQuery.noConflict(); 
    $jQ('#home').live('pageshow',function(){ 
    $jQ('.bxslider').bxSlider({ 
    mode: 'fade', 
    auto: true, 
    pager: false, 
    controls:true, 
    pause: 9000, 
    }); 
    }); 
    // ]]> 
    </script>

沒有好，並開始引發其他衝突。

在GitHub（https://github.com/wandoledzep/bxslider-4/issues/197）的一個問題上，有人說IE在bxSlider中摺疊了LI，並且建議添加一些CSS來給LIs一個寬度。這也不適合我。

所以現在我在這個問題上幾個小時後無處可去。任何建議，醫生？

來源

2013-10-14 Matt Kristiansen

有趣，我遇到了同樣的問題，今天晚上 - 在我的情況，我能夠設置在BX-包裝內，以便固定高度....

.bx-wrapper{ 
    height: 500px !important; 
}

固定對我來說 - 並不理想，因爲我期望它是靈活的，但它在這裏工作。

我試着調試腳本，並將其縮小到resizeWindow-> redrawSlider處理程序是什麼導致顯示器本身（不是開發人員工具，而是打開它們時發生的調整窗口大小事件） - out的時間，但如果我明天會有更好的解決方案會讓你知道。

來源

2013-10-15 05:24:20 maehue

Thanks @Migo。真高興你做到了。不幸的是，我需要這個靈活。不過，這是很好的信息......我從來不會想到這一點，因爲我使用虛擬機來運行IE8，並且無法調整窗口大小。這絕對給了我一些想法嘗試。如果我找到靈活的解決方案，我會通知您。歡呼並再次感謝！ –

嘿@MigoFast，我發現從頁面導航離開並再次返回也會導致滑塊出現。這是否提供了進一步的線索？ –

我有同樣的問題。對我而言，解決方案不是按百分比調整滑動圖像的大小，而是按照確切的像素量調整大小。例如，

<li><img src="image.jpg" style="width: 561px; height: 425px;" /></li>

而不是

<li><img src="image.jpg" style="width: 170%; height: 170%;" /></li>

，然後通過添加自舉的IMG響應級響應使圖像一次。

來源

2014-01-22 13:30:22

嘿謝謝@ user2609980。很高興你在這裏回覆，因爲我仍然沒有排序這個問題。我正在使用JQM，並且我希望有一個'img-responsive'類。但是除非在Bootstrap中有一些後門的東西需要做這個工作，否則我應該鞭打一個。它看起來像它應用'width：100％;'和'height：auto;'。我會給你一個鏡頭，讓你如何去...雖然它可能會帶我一點，因爲我的css3mediaqueries.js在某個時候停止工作，渲染這一切都沒有意義。 –

@MattKristiansen我現在看到我可能已經回答了一個不同的問題:)。我曾經遇到這樣的問題：IE8中的高度並沒有以正確的方式渲染（它被拉伸了），但它確實在FireFox的高度渲染。上面的答案解決了這個問題。 –

如果你說在調試的時候它確實有效，畢竟可能有一個'console.log'。你不需要使用IE來打破它。 –

我與網站有同樣的問題，我做了什麼來糾正它而不是調整瀏覽器大小（這也適用於我;這就是打開開發人員工具本質上是做的）是我添加了一些代碼每次在IE8中重新加載圖像（而不是緩存），方法是在每個圖像的末尾添加任意查詢。這似乎對我有用。見下文。

<div class="slide"><img src="images/your_image_name.jpg<?php if (strstr($_SERVER['HTTP_USER_AGENT'], "MSIE 8") > ""){ echo "?v=" . time(); } ?>" ></div>

來源

2014-04-14 14:17:13 mbacklas

這是一個非常哈克的做法，但我發現它在IE8的工作 - 本質上，它運行的窗口大小調整，迫使BX滑塊重裝

將這個窗口載入標籤內。

if ($('.bxslider').length > 0) { 

    slider = $('.bxslider').show().bxSlider(); 
    slider.reloadSlider(); 

} 

function fireOnResizeEvent() { 
var width, height; 

if (navigator.appName.indexOf("Microsoft") != -1) { 
    width = document.body.offsetWidth; 
    height = document.body.offsetHeight; 
} else { 
    width = window.outerWidth; 
    height = window.outerHeight; 
} 

window.resizeTo(width - 1, height); 
window.resizeTo(width + 1, height); 
} 

window.onresize = function() { 
    if ($('.bxslider').length > 0) { 
     slider.reloadSlider(); 
    } 
}

來源

2015-11-12 12:53:51

bxSlider不能在IE8中工作，除非開發人員工具已激活

回答

相關問題