&l"/>
&l">
Home >Web Front-end >JS Tutorial >Note: BUG that jquery's fadeIn and fadeOut methods fail under IE
<p id="show_list"> <p class="" val="0"> <p class=" posab" style="top:50px; left:260px;"> <img class="png_bg" src="/uploads/productimage/164613_634717302959421250.png" /></p> <p class="posab alce" style="top:200px; width:260px; left:80px;"> <p class=" f18 l22 alce" style="color:#e99417; margin-top:20px;">测试测试测试</p> <p class=" f14 l22 alce" style="color:#e99417;">测试测试测试</p> <p class="lk444 f14 l22 alce" style="margin-top:5px;">测试测试测试</p> </p> </p>
<p class="" val="0"> <p class=" posab" style="top:50px; left:260px;"> <img class="png_bg" src="/uploads/productimage/164613_634717302959421250.png" /></p> <p class="posab alce" style="top:200px; width:260px; left:80px;"> <p class=" f18 l22 alce" style="color:#e99417; margin-top:20px;">测试测试测试</p> <p class=" f14 l22 alce" style="color:#e99417;">测试测试测试</p> <p class="lk444 f14 l22 alce" style="margin-top:5px;">测试测试测试</p> </p> </p>
<p><p>posab is an absolute positioning class <p>As long as the absolute positioning is replaced with floating, the effect of fading in and out can be achieved .
<p> The specific position needs to be adjusted <p>BUG2: Parent absolute positioning nested pictures that are larger than the parent size <p> There is another situation, which is a BUG unique to IE8. The format is as follows
测试测试测试
测试测试测试
测试测试测试
测试测试测试
测试测试测试
测试测试测试
<p>
<p class=" posab" style=" top:80px; left:260px;width:550px;height:55px"> <img class="png_bg" src="image.jpg" /> </p><p> If the size of the picture exceeds the size of p, it will fade under IE8 The fade-out effect will be invalid <p>BUG3: <p>There is a bug on the Internet that I have not encountered in detail. I will post it now:
<p> <p>The above code can basically achieve the expected results in all mainstream browsers <p>But the reality is cruel, and your html structure will certainly not be that simple. <p>Let’s add a little bit more<p> <p>I am going to fade in ;
<p>I am going to fade in ; $('.fadein').fadeIn();
<style> .relative{position: relative;} </style>
<p>At this time, the issue of shouting daddy will appear in IE 6 78. AnimationIf it doesn’t appear, will it happen? Directly show it and it will. do not have! <p>This is a notorious big IE bug: If the sub-elements of the fadeIn element have the position attribute, the relative value is the most serious. Elements with the position attribute will not have the effect of fadeIn!
<p>I am going to fade in ;
<p>I am going to fade in ; $('.fadein').fadeIn();
$('.fadein').css('position', 'relative').fadeIn();<p>Dynamicly change the position attribute to relative before fadeIn(); this bug under IE7 will be solved
<style> .relative{position: relative; filter: inherit} </style><p>Add filter: inherit; to the elements whose child elements have the position attribute. Also add filter: inherit; to the first-level child elements of the current element.
The above is the detailed content of Note: BUG that jquery's fadeIn and fadeOut methods fail under IE. For more information, please follow other related articles on the PHP Chinese website!