View Full Version : fadeIn Broken in Internet Explorer When using Ext as Base

22 Jun 2007, 8:21 AM
Just started working on implementing some effects into my code. I decided to update to the Ext 1.1 Beta 1. I also decided to user Ext as the base for my scripting.

The problem is that fadeIn does not want to work in Internet Explorer (7 or 6) when using Ext as the base. Everything works fine in Firefox. FadeOut works in InternetExplorer just not fade in. If I change the base class to the YUI class everything works fine. This leads me to beleive that it is something with the Ext base calss.

Here is the code:

Include Lines:

<script type="text/javascript" language="javascript" src="Scripts/adapter/ext/ext-base.js"></script>
<script type="text/javascript" language="javascript" src="Scripts/ext-core.js"></script>

(Flipping from ext-core.js to ext-all.js did not make any difference.)


var image1 = Ext.get('Image1');
image1.fadeIn({startOpacity: 0,endOpacity: 1, duration: 3});


<div id="Image1">
<img src="Images/temp1.jpg" />

22 Jun 2007, 10:40 AM
Thanks. This is now fixed in SVN.

22 Jul 2007, 7:40 AM

I have a div containing a dynamic form. I want to fade it out using fadeOut() from Fx. However, the fields in the form do not fade out in IE (it works fine in Firefox).

DOM tree sketch:

|- div(id="login_form")

I dynamically build the form using the "login_form" element.

When I click the submit button I call this function:

function() {
var tbl = Ext.get('login_table');
tbl.fadeOut({duration: 1.5, callback: {
function() {tbl.remove();}
Am I using the fading incorrectly, or is there a rendering bug in IE?

- Karl

22 Jul 2007, 8:20 PM
Note: you can use the param 'remove:true' instead of supplying a custom callback to do that. The code looks fine and should work in IE as far as I can see.

23 Jul 2007, 3:50 AM
Thanks, can you reproduce the problem or is it something in my setup?

I have a similar problem, also only in IE: When I scroll then form fields and labels stay in their position as though their position as was relative to the browser frame, i.e., they stay the same place even though I scroll the page down.

- Karl