Forums

Google Calendar Events
Possible IE8 display issues (15 posts)

  1. torndownunit
    Member
    Posted 1 year ago #

    Hey there. Overall I am loving the plug-in, thanks a lot for creating it.

    I just ran into an issue though. I am using the plug-in with the Weaver theme, and I only have NextGen Gallery and Fast Secure Contact Form installed plug-in wise.

    On this page: http://www.orangevillefairgrounds.ca/wordpress/

    In IE, if you go to the sidebar/widget and mouse over a test event (there is one on March second), the popup is displaying behind everything. You can see it just peaking out behind the theme/main content area.

    Do you have any suggestions how to fix this? It's not happening in Firefox or Safari. But the IE issue is a big one and I am seeing in on 3 different computers.

    Thanks!

  2. Ross Hanney
    Member
    Posted 1 year ago #

    Hi again,

    Strange! I not 100% sure, but it seems to be related to the following section of IE specific HTML / CSS that appears on your pages:

    <!--[if lte IE 8]>
    <style type="text/css" media="screen">
    #container, #primary, #secondary, #altleft, #altright, #ttw-top-widget, #ttw-bot-widget, #ttw-site-top-widget, #ttw-site-bot-widget, #per-page-widget, #wrapper{
      behavior: url(http://www.orangevillefairgrounds.ca/wordpress/wp-content/themes/weaver/js/PIE/PIE.php); z-index:9999; position:relative; }
    </style>
    <![endif]-->

    Specifically, the z-index:9999; part.

    Is this something you have added yourself? Or perhaps it has been added by your theme or a plugin (although I'm fairly sure the two plugins you mention wouldn't add this).

    If possible, you could try removing the above code from your site, to see if it is indeed the cause of the issue. Obviously, if the code does something important, this won't be long-term solution!

    Ross.

  3. torndownunit
    Member
    Posted 1 year ago #

    Hi, I just got your response through email though I don't seem to see it here. Odd.

    It's definitely not code I added myself because I don't even know where it is lol. If you tell me where I should delete it from, I will give it a try. Is it just part of the main CSS?

    I am using Weaver, which is a pretty common theme. If it is Weaver specific code, I can ask about it on their forum as well.

    Thanks

  4. Ross Hanney
    Member
    Posted 1 year ago #

    Hi again,

    Apologies for the delayed reply.

    I don't think it is part of the main stylesheet, as it is added to the <head> of the page directly. I'm not familiar with Weaver, but it could be related to a theme option you have enabled / disabled, possibly something to do with CSS3 rendering in IE?

    Ross

  5. torndownunit
    Member
    Posted 1 year ago #

    hey, there is actually a settings box in weaver to disable the code! I found out about it when I asked on their forum.

    The code is related to adding drop shadows and rounded corners in IE8. It's a shame to remove it for that reason.

    Is there a way I can maybe hide the popups on just the sidebar instead? I have the text listings for the events showing below it anyway. And I have the big calendar that can have the popups on another page (it only seems to have the issue with the widget, not the big calendar).

    Thanks for the great support! Best support I have had with a plug-in.

  6. Ross Hanney
    Member
    Posted 1 year ago #

    Hi again,

    I downloaded Weaver and had a play around, and I think I might have figured out a fairly simple workaround that should allow the IE8 features and the plugin tooltips to work together.

    Try adding the following CSS to the end of the plugin stylesheet (google-calendar-events/css/gce-style.css):

    #container, #primary, #secondary, #altleft, #altright, #ttw-top-widget, #ttw-bot-widget, #ttw-site-top-widget, #ttw-site-bot-widget, #per-page-widget, #wrapper{
    	z-index:1000 !important;
    }

    I have tested in IE7 and IE8 (and Chrome, Firefox, Safari, Opera), and this seems to do the trick for me, so hopefully it will work for you too! Let me know if you're still having problems.

    Ross

  7. torndownunit
    Member
    Posted 1 year ago #

    Wow thanks a ton! I will be working on that site in the a.m. tomorrow, and I will let you know how it goes.

  8. torndownunit
    Member
    Posted 1 year ago #

    For future reference the solution the developer posted worked.

    Unfortunately, there was another issue with Weaver and the method it uses to produce rounded corners in IE8 conflicting with NextGen Gallery's lightbox functions. So I ended up having to disable the code in the theme in the end instead of using the workaround.

    Thanks for the help though Ross!

  9. guylwalker
    Member
    Posted 10 months ago #

    I am using the Hulk theme from Themeforest.net and have encountered the same problem.

    It seems to me that we should be able to set the z-index of the tooltip popup div that holds the event info so that it shows on top of anything else in our themes... Is this something you can add to your setup properties (and css styles)?

  10. Ross Hanney
    Member
    Posted 10 months ago #

    Hi guylwalker,

    Is this definitely the same issue (the tooltips appearing behind things in IE), or do the tooltips just not appear at all?

    Either way, could you provide a link to your site, so I can take a look at the problem?

    Ross.

  11. guylwalker
    Member
    Posted 10 months ago #

    definitely the same issue. the tooltips appear except it's cut off by the green header at the top of the page.

    try http://guylwalker.com/?cat=7.

    i tried the workaround you suggested (change the z-order of the template object that hides the tooltip). i had to set mine to 6000, though, for it to work. but there should be a way to force the tooltip to the top of the z-order by allowing us to set it in the settings.

  12. Ross Hanney
    Member
    Posted 10 months ago #

    The theme adds z-index:9999 to the entire header, which is causing the hidden tooltip problem. However, adding the following to a custom stylesheet should get around the issue:

    .gce-qtip{
        z-index:10000 !important;
    }

    This isn't something that warrants a new plugin option, in my opinion. It's pretty edge-case, and the solution (above) is fairly simple.

    Ross.

  13. guylwalker
    Member
    Posted 10 months ago #

    thanks ross! that workaround works great when added to the gce-style.css file. you mentioned "custom stylesheet"... does this plugin load a custom stylesheet that survives updates? if not, adding the change to the gce-style.css will break on the next update.

  14. Ross Hanney
    Member
    Posted 10 months ago #

    The plugin allows you to specify a URL to a custom stylesheet. If you place this stylesheet somewhere "safe", it won't get overwritten during updates. Somewhere outside of the WordPress directory structure is probably safest.

    Ross.

  15. guylwalker
    Member
    Posted 10 months ago #

    awesome! i'll do just that! thanks for being so responsive.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic