#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    4
    Rep Power
    0

    Red face Expanding Element


    I have an element that I have expanded using a simple hover. However, the iFrame inside the element blocks the hover effect inside older version of IE. (Not sure about newer versions since I'm on my Mac.)

    Is there a way to bypass that and let the DIV stay expanded with the cursor is over the iFrame.

    It's the agenda calendar to the left on ardmoreconventioncenterDOTcom
  2. #2
  3. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4304
    Welcome to DevShed Forums, zero118.

    Not with CSS. If the page loaded into the iframe is on the same domain as the parent page, it may be possible to fix that with JavaScript. However, I see that you're loading Google Calendar in it, so I'm afraid you'll need to rethink this.

    Do you mean that you tested in IE5 for MacOS? That very old browser has many differences from versions of IE for Windows. Or perhaps you mean that you've got WinXP running in a virtual machine?
    Spreading knowledge, one newbie at a time.

    Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    4
    Rep Power
    0
    Sorry, yes. I tested on IE 7 on Windows 2003 Server because it's all I can connect to right now.

    If it works in IE 8+ I think it will be alright but I can't test in it.

    Unfortunately I need to load the Google Calendar API through the iFrame because no parser I can find will work properly with their new ways of doing things and I don't ave the time or patience to write my own.

    It works great in Chrome and Safari on Mac but I am concerned about it with IE. I don't suppose you could check it on a newer version and let me know about any suggestions...?
  6. #4
  7. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4304
    Ah. Remote desktop.

    It's not working in any of IE8, IE9, IE10, and the preview version of IE11.

    Actually, on second thought, it might still be possible to do this with JavaScript, but it might be necessary to have a little space around the edges of "#upcoming_events" before it was hovered. It might be possible to add a transparent element within it to overlap the iframe to detect the mouse before widening "#upcoming_events" and removing itself.

    *** Thread Moved ***
    Last edited by Kravvitz; August 31st, 2013 at 02:05 AM.
    Spreading knowledge, one newbie at a time.

    Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  8. #5
  9. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    4
    Rep Power
    0
    Not perfect at JavaScript but a fast learner. I'm entirely open to possibilities. I think things like this, especially involving an iFrame, can contribute to the community as well.

    I can modify anything needed :-) I appreciate the help. Will check back with you in the morning
  10. #6
  11. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2013
    Posts
    4
    Rep Power
    0
    I've tried a couple of different ways like this post
    jsfiddleDOTnet/MHDhT/

    Just couldn't get it to work :-/
  12. #7
  13. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4304
    Spreading knowledge, one newbie at a time.

    Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).

IMN logo majestic logo threadwatch logo seochat tools logo