не работает в IE

Question

вот мой JavaScript:

            function random_imglink() {
            var myimages = [
                {image: "/documents/templates/projedepo/banner/canon.jpg", url: "/index.cfm?fuseaction=objects2.detail_product&product_id=612&stock_id=612"},
                {image: "/documents/templates/projedepo/banner/indigovision.jpg", url: "http://www.url2.com"}
            ];

            var ry=Math.floor(Math.random()*myimages.length);

            var randomImage = myimages[ry];

            var randomImageLink = '<a id="random_link" href="' + randomImage.url + '"><img style="z-index:1;position:absolute; left:70px; top:360px;" border="0" align="absmiddle" src="/documents/templates/projedepo/banner/daha_fazlasi.jpg" /></a><img id="random_img" src="'+randomImage.image+'" height="420" width="964" />';
            document.getElementById("image2").innerHTML = randomImageLink;
            }
 $(function() {
  $(".image2").click(function() {
  var image = $(this).attr("rel");
    var rel = $('#random_img').hide().fadeIn('slow').attr('src');
    $('#random_img').attr('src', image);

  var randomLink = $(this).attr("href");
  $('#random_link').attr('href',randomLink);

    var image2 = $('#random_img').attr('src');
    $("#thumb2 a img").removeClass("open");
    $("#thumb2 a[rel='" + image2 + "'] img").addClass("open");
    return false;
  });
 }); 

 $(document).ready(function() {
   var image2 = $('#random_img').attr('src');
   $("#thumb2 a[rel='" + image2 + "'] img").addClass("open");
 });
                random_imglink()

Вот мой HTML:

<div id="slider_container">    
<div id="image2">Here is written my sript</div>
<div id="thumb2">

<a href="/index.cfm?fuseaction=objects2.detail_product&product_id=612&stock_id=612" rel="/documents/templates/projedepo/banner/canon.jpg" class="image2" ><img title="Canon" class="slider_thumb" src="/documents/templates/bilgiteknolojileri/images/t_flash/t1.png" border="0"/></a>
<a href="http://www.url2.com" rel="/documents/templates/projedepo/banner/indigovision.jpg" class="image2"><img title="IndigoVision" class="slider_thumb" src="/documents/templates/bilgiteknolojileri/images/t_flash/t2.png" border="0"/></a>

</div></div>

В Internet Explorer, а не в Firefox или Opera, сначала все работает нормально, отображается случайное изображение и миниатюры в порядке, но когда я нажимаю на миниатюру, случайное изображение превращается в кадр с переполнением, например:

Answer 1

Единственное подозрительное, что я вижу, это:

$(document).ready(function() {
   var image2 = $('#random_img').attr('src');
   $("#thumb2 a[rel='" + image2 + "'] img").addClass("open");
 });
                random_imglink()

В своем HTML-источнике вы написали

    <div id="image2">Here is written my sript</div>

... поэтому я предполагаю, что скрипт находится там.Это может быть проблемой. Замените приведенный выше код на

$(document).ready(function() {
       var image2 = $('#random_img').attr('src');
       $("#thumb2 a[rel='" + image2 + "'] img").addClass("open");
       random_imglink();
     });

(переместите вызов random_imglink () в функцию ready).В противном случае он вызывается немедленно, но будет обработан элемент (# image2), который еще не закрыт, что может привести к ошибке в MSIE.

Answer 2

вот мой css

#slider_container { }
#thumb2 { float:right; }
#thumb2 img { border:1px solid #999; padding:2px; margin-top:4px; filter:alpha(opacity=20); -moz-opacity: 0.2; -khtml-opacity: 0.2; opacity: 0.2; width:30px; }
#thumb2 img:hover { filter:alpha(opacity=100); -moz-opacity: 1.0; -khtml-opacity: 1.0; opacity: 1.0; }
.slider_thumb.open { filter:alpha(opacity=100) !important; -moz-opacity: 1.0 !important; -khtml-opacity: 1.0 !important; opacity: 1.0 !important; }