我只在IE中获得这个有线别名文本和图像边框,您可以在图像中看到。
正如你在javascript中看到的,我使用的是jQuery和css(不透明度)。
这是我的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);
}
}
}
有没有解决方法?
答案 0 :(得分:2)
在这里查看答案:jQuery fadeIn leaves text not anti-aliased in IE7
可能会有所帮助。看来它可能是IE的错误(像往常一样)