I had an awkward thing happening with IE7 on a page using CSS3 PIE. Basically, here's what happened: 1) The page was drawn just fine with 5-6 divs styled with rounded corners, gradients, and shadows. 2) Navigate away to new page. 3) Hit browser back button in IE7. The CSS3 styled divs containing dynamic content (aspx gridviews, SSRS reports) all were collapsed to height=0, as if they contained no content. Static content divs were fine. Upon hovering in the divs, the CSS was redrawn correctly.

I looked at several things, including javascript reflows, setting sizes in javascript, min-height settings, etc. Nothing worked well. I assumed that since the divs were styled correctly after hovering, CSS3 PIE must be working correctly. On a whim, I glanced again at recent updates to the CSS3 PIE version I'm using and noticed the Layout Polling. I set the option in the css file, and WHAMMO. It works. You do see a flash of reformatting upon hitting the back button, but it does in fact end up looking correct. So I am happy. Thanks!

In general PIE is quite good at detecting changes to the size and position of the elements to which it is attached and automatically adjusting its rendering to match. It does this by listening to the IE-specific onmove and onresize events for each target element. In the majority of cases this works seamlessly; in rare cases, however, IE does not fire these events when it should, and PIE gets out of sync.

To help users get around these cases, PIE has a second method for tracking size and position changes: polling. When polling is enabled for an element, PIE will manually query that element's layout several times a second, and if the layout has changed then it will adjust the rendering.

Polling is enabled by default for all elements in IE8 (as that version is particularly bad about not firing the events) and disabled in IE 6 and 7. Users can override these defaults to force polling on or off for individual elements by setting a custom CSS property: just specify -pie-poll:true; to force polling on for an element, or -pie-poll:false; to disable it.

Who is online

Users browsing this forum: No registered users and 1 guest

You cannot post new topics in this forumYou cannot reply to topics in this forumYou cannot edit your posts in this forumYou cannot delete your posts in this forumYou cannot post attachments in this forum