Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery fadeIn fadeOut - IE8 does not fade
    primarykey
    data
    text
    <p>Can anyone tell me why a .jpg would not fade in or fade out in IE8. Right now it is just disapearing and reappearing with no opacity changes. I have this set up locally and on a publishing server, strange thing is the images fade in and out just fine locally, it's only when I go to the publishing server that they cease to fade.</p> <p>Just wondering if I am missing something someone could quickly help me with off the top of their heads.</p> <p>Here is the gcRotateContent that is on the publishing server, If I just throw an image up and do a fade in out it works, for some reason it doesn't work with this markup.</p> <pre><code>&lt;div class="gcRotateContent"&gt; &lt;div id="USCFRR2EN" class="gcEmployeeProfile"&gt; &lt;div class="gcEmployeeProfileHeading"&gt; Meet John&lt;/div&gt; &lt;div class="gcEmployeeProfileContent"&gt; &lt;div class="gcEmployeeProfileHRPad"&gt; &lt;/div&gt; &lt;div class="gcEmployeeProfileHR"&gt; &lt;/div&gt; &lt;div class="gcEmployeeProfileHRPad"&gt; &lt;/div&gt; &lt;div class="gcEmployeeProfileSLVideo"&gt; &lt;img src="/PublishingImages/Profile_JOHN-190x96.jpg" alt="Portrait of employee John." height="96" width="190"&gt;&lt;/div&gt; &lt;div class="gcEmployeeProfileName"&gt; &lt;/div&gt; &lt;div class="gcEmployeeProfileTitle"&gt; Software Development Lead, Server Performance&lt;/div&gt; &lt;div class="gcEmployeeProfileQuote"&gt; “You will find no other company with the sheer breadth of technologies. The things you get to see and learn from other people are amazing.”&lt;/div&gt; &lt;/div&gt; &lt;div class="gcEmployeeProfileFooter"&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p></p> <pre><code>&lt;div class="gcRotate"&gt; &lt;div class="gcRotateContent"&gt; &lt;div style="border: solid 2px black; text-align: center; width: 150px;"&gt; This is first content &lt;img src="http://pix.motivatedphotos.com/2008/6/16/633492359109161542-Skills.jpg" alt="First" /&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="gcRotateContent"&gt; &lt;div style="border: solid 2px black; text-align: center; width: 150px"&gt; This is second content &lt;img src="http://www.funnycorner.net/funny-pictures/5010/cheezburger-locats.jpg" alt="Second" /&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="gcRotateContent"&gt; &lt;div style="border: solid 2px black; text-align: center; width: 150px"&gt; This is third content &lt;img src="http://icanhascheezburger.files.wordpress.com/2007/06/business.jpg" alt="Third" /&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div&gt; This shouldn't move. &lt;/div&gt; &lt;script type="text/javascript"&gt; function fadeContent() { $(".gcRotateContent").first().customFadeOut(500, function() { $(".gcRotateContent:hidden:first").customFadeIn(500) }); $(".gcRotateContent").first().appendTo($(".gcRotateContent").parent()); } $(".gcRotate").height(0); $(".gcRotateContent").each( function() { if ($(".gcRotate").height() &lt; $(this).height()) { $(".gcRotate").height($(this).height()); } } ); $(".gcRotateContent").each(function() { $(this).css("display", "none") }); $(".gcRotate").hover(function() { window.clearInterval(timer) }, function() { timer = window.setInterval("fadeContent()", 2000) }); $(".gcRotateContent").first().show(0); var timer = window.setInterval("fadeContent()", 2000); (function($) { $.fn.customFadeIn = function(speed, callback) { $(this).fadeIn(speed, function() { if (jQuery.browser.msie) $(this).get(0).style.removeAttribute('filter'); if (callback != undefined) callback(); }); }; $.fn.customFadeOut = function(speed, callback) { $(this).fadeOut(speed, function() { if (jQuery.browser.msie) $(this).get(0).style.removeAttribute('filter'); if (callback != undefined) callback(); }); }; })(jQuery); &lt;/script&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload