IE6 OR IE7 Position Absolute not showing

I don't know why, but for some reason in IE6 or IE7 if there is a floated layout and you have an absolute-positioned div in the mix sometimes it just won't show up. I played with the developer toolbar and if I edit any CSS property in the tool, the div magically shows up, but if I implement all the CSS in the stylesheet then reload the page it won't show up.

If you wrap your absolutely positioned element in an arbitrary div (we gave ours a class of 'positionFix') that ISN'T FLOATED, the absolutely positioned element should magically reappear.

This assumes that you have already made sure that any wrappers around the absolutely positioned element are either relatively positioned or absolutely positioned (that is a freshman-level mistake)

I'm only documenting this here so other lost souls don't spend so much time searching Google fruitlessly.

Jumpy scrolling in Flex 3 application

We've been beating our heads against the wall at work trying to fix an extremely irritating bug in a flex project we're working on.

The scenario was that we had a canvas with a background image, that would scroll when it exceeded the length of its container (a VBox in our scenario).

If we add the background image inline using the backgroundimage property, with a background size of 100%, then started scrolling over our content, suddenly the scroll behavior would become erratic and jumpy.

It was strange, because when we grab the drag handle, and stay over the "track" of the scroll area, it worked fine. Also, if we moved our cursor outside the container and kept dragging it worked fine. Finally, if we were dragging and went over a container INSIDE the jumpy canvas it would scroll normally.

What fixed the issue was taking the backgroundimage property off the canvas, giving the canvas a stylename, then in the mxml document added a style block and defined the backgroundImage property with a value of Embed("imageName.png").

This immediately stopped the jumpy-ness and it works great.

ASP.NET UpdatePanel, Ajax, and jQuery problems and solution

I am finishing work on an eCommerce application and there is some AJAX functionality that I had to add to several of the pages.

Prior to this, I was adding some behaviors to elements of the page using jQuery's ready function:

// inside my script.js file
jQuery(function($) {
$(document).ready(function(){
   // code here
}});

I added several UpdatePanels that were being updated by some AJAX calls. Everything seemed to work great, until I noticed that once any of the AJAX updated the UpdatePanel that all the behaviours I was setting up using jQuery were gone!!

I spent a while digging around and found a comment by "gt1329a" here:
http://forums.asp.net/p/1189519/2039138.aspx#2039138

In his/her comment they mention that "pageLoad fires after every partial postback" - which was essentially resetting the page without re-initializing the jQuery $(document).ready()...

So to clarify his/her "quick and dirty solution", I modified the code so it looks like this:

// inside my script.js file
/* // sorry jQuery
jQuery(function($) {
$(document).ready(function(){ */

function pageLoad()
{
   // code here
}

/*}});*/

I have some concerns about doing this, but being a pragmatist, I am satisfied with the result. The AJAX calls all work, and all the behaviors I need to add into the page are functioning as expected.

Please comment if this post is helpful.

Another day lost due to Internet Explorer 7. Thanks IE.

I've had to find this solution twice, and both times it has cost me dearly - so I am posting here for as much my benefit as anyone else's.

Scenario: Calling a JavaScript function from within Flash using ExernalInterface when Flash is in a form.
Problem: IE7 throws an error when we call ExternalInterface. The error says "player is not defined" - "player" is the id I use for my flash object.
Reason: Apparently, IE can't find an object by ID within the DOM if that object is within a form.
Solution: At the end of the javascript that I use to write out the flash tags, I put this line of code:
player = document.getElementById('player');

Here is a better explanation and the solution (see the comment by IsaacTheIceMan from 19 Oct 2007)