2011-07-25 7 views
1

私は、画像で見ることができるIEでこの有線のエイリアス化されたテキストと画像の枠線を取得しています。jQueryの不透明度の問題があります。

enter image description here

私はjQueryとCSS(不透明度)を使用していますJavaScriptで見ることができるように。

これは私のhtmlです:

<div id="banner-container"> 
    <div id="banner-0" class="banner"> 
     <div class="banner-text"> 
      <div class="banner-text-heading-3">0 Lorem ipsum dolor si</div> 
      <div class="banner-text-text-3">0 Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea <br /><b>Learn more</b></div> 
     </div> 
     <div class="banner-image"><img src="images/banner-img.png" border="0" /></div> 
    </div> 
    <div id="banner-1" class="banner"> 
     <div class="banner-text"> 
      <div class="banner-text-heading-3">1 Lorem ipsum dolor si</div> 
      <div class="banner-text-text-3">1 Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea <br /><b>Learn more</b></div> 
     </div> 
     <div class="banner-image"><img src="images/banner-img1.png" border="0" /></div> 
    </div> 
    <div id="banner-2" class="banner"> 
     <div class="banner-text"> 
      <div class="banner-text-heading-3">2 Lorem ipsum dolor si</div> 
      <div class="banner-text-text-3">2 Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea <br /><b>Learn more</b></div> 
     </div> 
     <div class="banner-image"><img src="images/banner-img2.png" border="0" /></div> 
    </div> 
</div>

のjQueryコード:


$(document).ready(function(){ 
    slide_logic(0,3,0); 
}); 
function slide_logic(slide,nof_slides,animation_duration) 
{ 
    for(i=0;i<nof_slides;i++) 
    { 
     if(i==slide) 
     { 
      $('#banner-'+i).animate({'opacity':'1'},animation_duration); 
      $('#banner-'+i+' .banner-text').animate({'opacity':'1'},animation_duration); 
     } 
     else 
     { 
      $('#banner-'+i).animate({'opacity':'0'},animation_duration); 
      $('#banner-'+i+' .banner-text').animate({'opacity':'0'},animation_duration); 
     } 
    } 
} 

は、そのための任意の修正はありますか?ここでの回答で

+1

"un-anti" == "" :) – Sergey

+0

:)そのことを申し訳ありません。 –

+2

IE8以前の不透明度のサポートは非​​常に貧弱です。この事実から逃げることはありません。それはバグであり、ひどく実装されています。 JQueryは使いやすくするかもしれませんが、バグを修正することはできません。 – Spudley

答えて

2

ルック:jQuery fadeIn leaves text not anti-aliased in IE7

はそれが役立つかもしれませ。 IEのバグ(通常通り)

+0

+1、ご返信ありがとうございます。私はアニメーションのコールバックで次のコードを追加しましたif($。browser.msie)this.style.removeAttribute( 'filter');アニメーション化していないときに問題を修正しますが、アニメーション化するときには同じ問題が修正されます。 –

関連する問題