彈出窗口阻止加載JS文件

Question

我剛剛在我的網站上實現了一個項目滑塊。 我使用免費托管服務（000webhost）將我的網站放在網上，這樣我就可以在不同的設備上進行測試。 我注意到的是，當您第一次打開我的網站（ 鏈接到我的網站 ）時，將顯示來自免費托管服務的彈出窗口：

關閉彈出窗口后，項目滑塊看起來像這樣，這是不正常的：

然后你需要刷新頁面，當沒有彈出窗口時，你會看到正常的顯示：

只要滑塊未正常顯示，滑塊就不能完美地工作。 我認為彈出窗口阻止加載我的某些JavaScript文件。

這是有關項目滑塊的代碼：

 <div class="clearfix"> <h1>Femme <span>Les articles feminins viennent à vous</span></h1> </div> <div class="main"> <div id="mi-slider" class="mi-slider"> <ul> <li><a href="#"><img src="images/1.jpg" alt="img01"><h4>Boots</h4></a></li> <li><a href="#"><img src="images/2.jpg" alt="img02"><h4>Oxfords</h4></a></li> <li><a href="#"><img src="images/3.jpg" alt="img03"><h4>Loafers</h4></a></li> <li><a href="#"><img src="images/4.jpg" alt="img04"><h4>Sneakers</h4></a></li> </ul> <ul> <li><a href="#"><img src="images/5.jpg" alt="img05"><h4>Belts</h4></a></li> <li><a href="#"><img src="images/6.jpg" alt="img06"><h4>Hats &amp; Caps</h4></a></li> <li><a href="#"><img src="images/7.jpg" alt="img07"><h4>Sunglasses</h4></a></li> <li><a href="#"><img src="images/8.jpg" alt="img08"><h4>Scarves</h4></a></li> </ul> <ul> <li><a href="#"><img src="images/9.jpg" alt="img09"><h4>Casual</h4></a></li> <li><a href="#"><img src="images/10.jpg" alt="img10"><h4>Luxury</h4></a></li> <li><a href="#"><img src="images/11.jpg" alt="img11"><h4>Sport</h4></a></li> </ul> <nav> <a href="#">Chaussures</a> <a href="#">Acccesoires</a> <a href="#">Vêtements</a> </nav> </div> </div> </div><!-- /container --> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="js/jquery.catslider.js"></script> <script> $(function() { $( '#mi-slider' ).catslider(); }); </script> 

請幫助我知道如何解決我面臨的這個問題。 提前致謝。

Answer 1

我無法在您添加的代碼段中查看它。 但我猜的是兩個jQuery版本之間存在沖突。 嘗試在ready()函數之前添加jQuery代碼事件頂部的blow line。

$.noConflict();

另請注意圖像中有兩個jQuery版本加載。

第一次：

第二次：

jQuery網站上的更多信息

Answer 2

首次加載時，“mi-selected”類不會添加到您的代碼中，這就是您遇到問題的原因。 您可以檢查滑塊js，實際上是什么問題。 是的，您也可以按照'noconflict'/ @ Roy的回答來檢查您的問題是否已經解決