648 posts
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $250,000+ on Envato Market
  • Made it to the Authors' Hall of Fame
  • Had an item featured on Envato Market
+8 more
theAlThemist says

Hey guys,

I have a strange problem and need your help.

Could you tell me what is wrong here (actually it is not wrong because it works fine in every browser except IE – in IE7 not working at all and in IE8 only the mask is visible but not the overlay container)

<script type="text/javascript">
$("#add_to_cart[rel]").overlay({
    oneInstance: false,
    closeOnClick: false,
    mask:'#000',
    top: (window.innerHeight / 2) - 60,
    left: (window.innerWidth / 2) - 60,
    onLoad: function() {
        setTimeout('$("#add_to_cart[rel]").data("overlay").close();', 1000);
    },
});
</script>

Any help would be appreciated. Thanks in advance!

1148 posts
  • Has referred 1+ members
  • Has sold $1,000+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 10+ items on Envato Market
+3 more
fillerspace says
<script type="text/javascript">
$("#add_to_cart[rel]").overlay({
    oneInstance: false,
    closeOnClick: false,
    mask:'#000',
    top: (window.innerHeight / 2) - 60,
    left: (window.innerWidth / 2) - 60,
    onLoad: function() {
        setTimeout('$("#add_to_cart[rel]").data("overlay").close();', 1000);
    }
});
</script>

See what I changed? There was an extra comma at the end, after the onLoad function declaration. Most browsers ignore this, but it breaks IE

648 posts
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $250,000+ on Envato Market
  • Made it to the Authors' Hall of Fame
  • Had an item featured on Envato Market
+8 more
theAlThemist says

Thank you fillerspace.

Unfortunately the only difference is that now IE7 also load the mask but not the modal container. And it doesn’t close after 1000 ms.

Really don’t understand… works like a charm in FF, Chrome and Safari(Win7)...

1148 posts
  • Has referred 1+ members
  • Has sold $1,000+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 10+ items on Envato Market
+3 more
fillerspace says

Weird…maybe look at this demo and see why it works:

http://flowplayer.org/tools/demos/overlay/modal-dialog.htm

648 posts
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $250,000+ on Envato Market
  • Made it to the Authors' Hall of Fame
  • Had an item featured on Envato Market
+8 more
theAlThemist says

This demo is using only the default settings and I need more than one instance to be available and automatic self close function. May be this is the problem. I’ll try with another version of jQuery – may be this is the problem.

Anyway, thank you for your help.

648 posts
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $250,000+ on Envato Market
  • Made it to the Authors' Hall of Fame
  • Had an item featured on Envato Market
+8 more
theAlThemist says

Finally made it. And the lesson is – never put modal window in container with relative position. IE hates this (and I hate IE). :)

3503 posts
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $750,000+ on Envato Market
  • Located in United States
  • Helps us moderate the forums
+10 more
sevenspark Moderator says

Finally made it. And the lesson is – never put modal window in container with relative position. IE hates this (and I hate IE). :)

Ah, the joys of cross-browser compatibility testing… I shudder to think the number of development hours that have been wasted solving IE’s temperamental glitches :|

Thanks for posting back your solution – glad you got it resolved :)

1148 posts
  • Has referred 1+ members
  • Has sold $1,000+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 10+ items on Envato Market
+3 more
fillerspace says

Glad it worked out!

Helpful Information

  • Please read our community guidelines. Self promotion and discussion of piracy is not allowed.
  • Open a support ticket if you would like specific help with your account, deposits or purchases.
  • Item Support by authors is optional and may vary. Please see the Support tab on each item page.

Most of all, enjoy your time here. Thank you for being a valued Envato community member.

Post Reply

Format your entry with some basic HTML. Read the Full Details, or here is a refresher:

<strong></strong> to make things bold
<em></em> to emphasize
<ul><li> or <ol><li> to make lists
<h3> or <h4> to make headings
<pre></pre> for code blocks
<code></code> for a few words of code
<a></a> for links
<img> to paste in an image (it'll need to be hosted somewhere else though)
<blockquote></blockquote> to quote somebody

:grin: :shocked: :cry: Complete List of Smiley Codes

by
by
by
by
by
by