Галерея js не работает в IE8 - PullRequest
0 голосов
/ 23 марта 2012

Эта галерея js отлично работает в IE9, FF, Safari и т. Д., Но не в IE8 При нажатии на большие пальцы ничего не происходит на странице.

Кто-нибудь знает почему?

Моя страница находится здесь

HTML (урезанная версия):

        <div id="strandScroll">
        <ul>
        <li><a href="images/IMG_8720_.jpg" class="thumbnailStrand"><img src="images/IMG_8720_small.jpg" 
            alt="Image 1" border="0"/></a></li>
        <li><a href="images/IMG_9112.jpg" class="thumbnailStrand"><img src="images/IMG_9112_small.jpg" 
            alt="Thumbnail 2" border="0"/></a></li>
        </ul>
        </div>

        <div id="claspScroll">
        <ul>  
        <li><a href="images/IMG_8626.png" class="thumbnailClasp"><img src="images/IMG_8626.png" 
            alt="Image 1" border="0"/></a> </li>          
        <li><a href="images/IMG_8577.png" class="thumbnailClasp"><img src="images/IMG_8577.png" 
            alt="Thumbnail 2" border="0"/></a></li>       
        </ul>
        <div>

        <div id="combinedStrand">
        <img src="images/IMG_8720_.jpg" max-width 100% alt="Main Image" id="mainImageStrand" class="combinedStrandImage"/>
        </div>

        <div id="combinedClasp">
        <img src="images/IMG_8577.png" alt="Main ImageClasp" id="mainImageClasp" class="combinedClasp"/>
        </div>

ЯШ:

            $(function() {
                $('.thumbnailStrand').live('click', function() {
                    $('#mainImageStrand').hide();
                    $('#imageWrap').css('background-image', 'url(ajax-loader.gif)');
                    $('<img />').attr('src', this.href).load(function() {
                          $('#imageWrap').css('background-image', 'none');
                          $('#mainImageStrand').attr('src', $(this).attr('src')).fadeIn();
                    });
                    return false;
              });
             $('.thumbnailClasp').live('click', function() {
                    $('#mainImageClasp').hide();
                    $('#imageWrapClasp').css('background-image', 'url(ajax-loader.gif)');
                    $('<img />').attr('src',this.href).load(function() {
                          $('#imageWrapClasp').css('background-image', 'none');
                          $('#mainImageClasp').attr('src', $(this).attr('src')).fadeIn();
                    });
                    return false;

            $(".thumbnail").click(function() {

        $("#mainImage").attr("src", $(this).attr("src"));   
                        });
              });

        });

Заранее спасибо ...

1 Ответ

0 голосов
/ 23 марта 2012

Это не работает, потому что ваше load событие никогда не запускается.

Возможно, это запланированная (на тот момент) оптимизация, поскольку бессмысленно загружать изображение, которое еще не добавлено в DOM.

Я рекомендую не связываться с jQuery, а просто сделать это старомодным способом:

var i = new Image();
i.src = this.href;
i.onload = function() {
    $('#imageWrapClasp').css blah blah blah
    more blah here
}
...