Infinite Carousel некорректно загружается в IE, работает в Chrome, Safari и FF - PullRequest
Новая
       21

Infinite Carousel некорректно загружается в IE, работает в Chrome, Safari и FF

1 голос
/ 24 марта 2011

Эй, ребята, я управляю магазином на BigCartel.com.Недавно я решил добавить слайдер jQuery в свой магазин.Я выбрал это, а не флэш, чтобы он был совместим с мобильными устройствами Apple для моих клиентов.К сожалению, я столкнулся с некоторыми проблемами, заставляя его работать в IE.На данный момент он отлично работает в Chrome, FF и Safari, других основных браузерах, о которых я беспокоюсь.Я подумал, что смогу найти здесь эффективную помощь, вместо того, чтобы биться головой об стену, продолжая пытаться понять это.

Мой сайт можно увидеть по адресу www.StarboardClothing.com.Слайдер, который я использую, называется «Бесконечная карусель» и доступен здесь на Catch My Fame .

Вот код, который я сейчас использую:

ВВ разделе моей страницы макета, который применяется ко всем другим страницам сайта, у меня есть следующий код: 

{% if page.permalink == 'home' %}

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://sliderfiles.starboardclothing.com/jquery.infinitecarousel2.min.js"></script>

<script type="text/javascript">
  $.noConflict();
</script>

<script type="text/javascript"> 
jQuery(function(){
jQuery('#carousel').infiniteCarousel({
    transitionSpeed: 2000,
    displayTime: 6000,
    inView:1,
    advance:1,
    imagePath: 'http://sliderfiles.starboardclothing.com/',
    textholderHeight : .25,
    padding:'10px',
    autoHideCaptions: true,
    prevNextInternal: true,
    displayThumbnailNumbers: false,
    displayThumbnailBackground: false,
    thumbnailWidth: '10px',
    thumbnailHeight: '10px',
    autoHideControls: true,
    displayProgressBar: false,
    easeLeft: 'swing',
    easeRight: 'swing'

});
jQuery('div.thumb').parent().css({'margin':'0 auto','width':'60px'});
jQuery('#carouselWrapper > div:eq(1)').css('margin-top','56px');
jQuery('#carouselWrapper > div:eq(2)').css('margin-top','56px');
});
</script>

{% endif %}

Затем я включаю следующий код на своем сайте в разделгде я на самом деле реализую плагин.Это то, что позволило ему быть несколько функциональным в IE.До добавления этой оболочки она вообще не работала в IE.На данный момент это только минимальная функция, и плагин выходит из строя после одного воспроизведения.Ни один из элементов управления в настоящее время не работает в IE, несмотря на то, что он функционирует в других основных браузерах. 

<div class ="iframe-wrapper">

<div id="carousel">
<ul>
<li><a href="http://www.starboardclothing.com"><img alt="" src="http://sliderfiles.starboardclothing.com/annapolis-splash3.jpg" width="648" height="302" /></li>        
<li><a href="http://www.starboardclothing.com/artist/spring-line-2011"><img alt="" src="http://sliderfiles.starboardclothing.com/spring-line.jpg" width="648" height="302" /></li>

</ul>
</div>
</div>

Если бы кто-нибудь мог помочь мне заставить это работать в IE, я был бы чрезвычайно благодарен.Я знаю, что можно начать работать в IE.Частично причина, по которой я выбрал этот плагин, заключается в том, что он был функционален в IE на веб-сайте создателя.Я буду рад реализовать любые ваши предложения и сообщить о результатах.Заранее спасибо.

Ответы [ 2 ]

0 голосов
/ 24 марта 2011

Я тестировал ссылку на IE6,7,8. Слайдер работает нормально, но все они выдают ошибку в строке 17: 

<script type="text/javascript">

    <meta name="generator" content="Big Cartel" />
<script type="text/javascript">

      var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-22000995-1']);
      _gaq.push(['_trackPageview']);

      (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
      })();

    </script>

У вас есть метатег внутри тега скрипта

0 голосов
/ 24 марта 2011

Кажется, работает в IE9, по крайней мере, на моей машине. IE9, однако, выдает «Синтаксическую ошибку» в строке 1, столбце 1 ?live-comment-preview.js (обратите внимание на знак вопроса):

Там есть ссылка на http://www.catchmyfame.com/?live-comment-preview.js, которая, вероятно, действительно должна указывать на http://www.catchmyfame.com/live-comment-preview.js:

<p style="display: none;"><input type="hidden" id="akismet_comment_nonce" name="akismet_comment_nonce" value="48264cb9eb" /></p><script src="http://www.catchmyfame.com/?live-comment-preview.js" type="text/javascript"></script><div id="commentPreview"></div>

У меня больше нет доступа к версиям IE, более ранним, чем IE9, поэтому я не могу помочь вам с ними - возможно, эта синтаксическая ошибка не позволяет старым IE загружать ваш карусель.

...