Download & Extend
Views Rotator » Issues

Views Rotator does not scroll with page content - in Win IE 7

Posted by manimejia on January 11, 2009 at 7:16pm
Project:Views Rotator
Version:6.x-1.0-alpha2
Component:Code
Category:support request
Priority:normal
Assigned:Unassigned
Status:active
Issue tags:CSS, IE, Windows

Issue Summary

A few weeks ao I figgured out how to get multiple instances of Views Rotator to show on the same page (#346498). Now I'm all done building my site, and testing in Windows IE 7.
Here's my test site http://cyrusmejia.openfacestudio.com/art

In firefox, looks OK. In IE, my little thumbnail rotators do not scroll with the page content. I've spent a while trying to troubleshoot this issue. From looking into various CSS Hacks, to learning about hasLayout property in ie, to trying to give layout to various parts of the views rotator. (The only elements I couldn't target with CSS hacks are the classles children DIVs of ".item-list").

Does anyone have any idea what might be causing this, and/or what I might try to fix it?
Anybody else able to duplicate this problem?
Is this a bug that needs addressing?

Best,
M.M.

Login or register to post comments

Comments

#1

Posted by manimejia on January 11, 2009 at 7:29pm
Version:6.x-1.0-alpha» 6.x-1.0-alpha2

I'm actually using the latest alpha...

#2

Posted by manimejia on January 17, 2009 at 12:51am

Diagnosis

In clearing a out all other IE compatibility issues, I have narrowed this one down to the following (I think):

  • in IE 7 for Windows, at least...
  • IE does not like to scroll "position:absolute" or "position:relative" IMG elements, at least while they're inside an "overflow:auto" scrolling DIV
  • The above also applies to "position:static" IMG elements inside "position:absolute" or "position:relative" parent elements inside an "overflow:auto" scrolling DIV.

Example

If there is even just a single VR view with images, put inside a scrolling DIV, it will scroll with the DIV content but in a "chopy" sort of way. It seems to only repositions the images when the animation is active. (javascript re-instructs the browser to put the image at "such and such" an absolute location) This is a bug with IE, but I believe VR should have a workaround built in.

Workaround

I'm not sure what the "universal" solution would be, but here's what I've done for my particular site. (at: cyrusmejia.openfacestudio.com)

  1. First, I decided to dissable VR for all IE browsers, because:
  • Due to my site layout, ALL VR instances will prolly end up on a page that scrolls
  • I also have PNG shadows behind ALL images in the VR content (which IE does NOT like to fade)
  • In this site the VR effects are really just an optional eye candy, and I'd prefer the design and user experience not be compromised.
  • I added the following to the header of my page.tpl.php file AFTER all other SCRIPT tags to dissable the javascript for IE only: <!--[if IE]><script type="text/javascript">Drupal.behaviors.views_rotator = function(context) {}</script><![endif]-->
  • I modified the view-view-rotator.tpl.php file to HIDE all VR items (via "display:hidden) except the first, (see : http://drupal.org/node/357809) so browsers with out VR working will see only one item.
  • Seeing as the Javascript is what tells VR items to display:absolute, we get normal display:static when the script is dissabled. Done with mods

    Now a ViewsRotator view will scroll properly on the page in IE, at the cost of disabling VR for that browser.

    What's Next?

    Any other ideas, solutions?
    Any real fixes to this problem?
    M.M.

    • #3

    Posted by manimejia on January 18, 2009 at 8:04pm
    Title:Multiple VR instances don't scroll with page content - in Win IE 7» Views Rotator does not scroll with page content - in Win IE 7
    nobody click here