Question

这是我的javasript：

            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中，首先它工作正常，随机图像显示和缩略图都可以，但是当我点击缩略图时，随机图像会出现溢出，如下所示：http://vteam.net.ru/_fr/11/1923928.jpg

Answer 1

这是我的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; }

Answer 2

我看到的唯一可疑的是：

$(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-function中）。否则会立即调用，但会有一个元素被操作（＃image2）尚未关闭，可能导致MSIE出错。

在IE中不起作用

2 个答案: