大家好,我先将问题描述一下,我想做一个动态显示图片的效果,就是将鼠标滑上一个按钮就换一个图片,但是该按钮是在该图片的前面,为什么在FF下是ok的,但是IE6就是有问题呢?
代码如下:
<ul class="banners" id="promotion_banners">
          <script type="text/javascript">
  <!--{foreach from=$categore_ad_list item=ad name=ad_name}-->
  var index = {$smarty.foreach.ad_name.index} + 1;
  
  var str = "<li id='banners_" + index +"_body_1' "; 
  <!---{if $smarty.foreach.ad_name.index==0}-->
  str += "style='display:block;'>";
  <!--{else}-->
  str += "style='display:none;'>";
  <!--{/if}-->
  str += "<a target='_blank' href='{$ad.url}'>" ;
  str += "<img src='{$ad.img_src}' />";
  str += "</a></li>";
  document.write(str);
  <!--{/foreach}-->
  </script>
        </ul>
  
        <div class="switcher">
          <ul id="banners" class="points">
          <script type="text/javascript">
  <!--{foreach from=$categore_ad_list item=ad name=ad_name}-->
  var index = {$smarty.foreach.ad_name.index} + 1;
  var str = "";
  <!---{if $smarty.foreach.ad_name.index==0}-->
  str =  "<li id='banners_" + index +"' class='current' onMouseOver='changePC(" + index + ")'>" + index + "</li>";
  <!--{else}-->
  str = "<li id='banners_" + index +"' onMouseOver='changePC(" + index + ")'>" + index + "</li>";
  <!--{/if}-->
  document.write(str);
  <!--{/foreach}-->
 
  </script>
  </ul>
        </div>
CSS如下:.pb{ margin:9px 0px 0px 0px; width:617px; float:left; position:relative}
 .pb .points li {
        background:url("images/pb_btn_01.gif") no-repeat scroll left top transparent;
     }
 .pb .banners{ padding:0; margin:0; float:left; }
 .famaleright2_l ul{ width:165px; }  
 .pb .switcher{ position:absolute; background-position:left -76px;  float:right; z-index:99999; left:300px; top:110px; height:25px; }
  .pb .points {
    font-size:12px;
    margin:8px auto 0;
    padding:0;
  }
  .pb .points li {
    background-position:0 0;
    color:#FFFFFF;
    cursor:pointer;
    font-family:Arial;
    height:15px;
    line-height:15px;
    margin:0 0 2px 3px;
    overflow:hidden;
    text-align:center;
    width:16px;
float:left
    }
  .pb .points li.current {
    background-position:-19px 0;
    margin-left:0;
    text-align:center;
    text-indent:3px;
    width:19px;
    }