Norlist popouts not working in IE9

Search engine friendly UL list type menu for Actinic V8 and V9. Styled by CSS and animated by a small JavaScript.
Post Reply
Firework
Posts: 3
Joined: Wed Aug 29, 2012 7:34 am

Norlist popouts not working in IE9

Post by Firework »

Hi,

I have recently been making my website a little easier on the eye and added gradients to the Norlist menu. Norlist still works fine in Safari, Chrome and Firefox but not in IE9. The menus do not pop out.

I hate explorer but do not want to compromise appearance on all browsers for the sake of it's weakness. Menu can be seen via the link below:

http://www.thepartyshopuk.co.uk

For reference I am also using Actinic V9. Any ideas anyone?

Thanks in advance.

PS. If anybody happens to view via Firefox, I know the home page is a little screwed up. I have sorted it now but simply not uploaded yet.
Firework
Posts: 3
Joined: Wed Aug 29, 2012 7:34 am

Re: Norlist popouts not working in IE9

Post by Firework »

PS. Forgot to mention I am using Norlist for Actinic V9 - V2.0.

Thanks.
norman
Site Admin
Posts: 1252
Joined: Sat Feb 07, 2004 9:55 pm

Re: Norlist popouts not working in IE9

Post by norman »

NorList works fine in IE9 for me and other users. You must have something unique on your site that's breaking it.

Try temporarily removing your many other JavaScripts (I see at least 7 and you're loading jQuery twice). If that fixes it restore them one by one until you find the culprit.
Norman
Firework
Posts: 3
Joined: Wed Aug 29, 2012 7:34 am

Re: Norlist popouts not working in IE9

Post by Firework »

Hi Norman,

Thanks for the help. I have solved the problem and feeding back for anybody else who has similar issues. I tried removing some of the javascripts which gave some success but not quite in the way I hoped.

In the end I found a comment on another forum suggesting that the gradient filter shown doesn't play so nice with z-index (See below)

background: rgb(163,81,149); /* Old browsers */
background: -moz-linear-gradient(top, rgba(163,81,149,1) 0%, rgba(103,45,95,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(163,81,149,1)), color-stop(100%,rgba(103,45,95,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(163,81,149,1) 0%,rgba(103,45,95,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(163,81,149,1) 0%,rgba(103,45,95,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(163,81,149,1) 0%,rgba(103,45,95,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(163,81,149,1) 0%,rgba(103,45,95,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a35195', endColorstr='#672d5f',GradientType=0 ); /* IE6-9 */

In the end I have just had to settle for a plain flat colour on explorer.

I am by no means a coding expert though so I would be grateful if you could point out where I am loading Jquery twice.

Once again thanks for your help Norman and I hope the above may be of help to others.
norman
Site Admin
Posts: 1252
Joined: Sat Feb 07, 2004 9:55 pm

Re: Norlist popouts not working in IE9

Post by norman »

Glad you found a solution. In weird cases like yours, I've often had to delete half the suspect code and see if that help. If it does, delete half of that half, etc. to narrow it down. If it turns out to be a CSS file, do the same binary chop on the CSS contents until the offending line is isolated.

As for the duplicated jQuery, I see near the top of your Overall Layout (looking at live sites generated code):

Code: Select all

<script language="javascript" type="text/javascript" src="party-supplies/jquery-1.4.4.min.js"></script>
<script language="javascript" type="text/javascript" src="party-supplies/jquery.form.js"></script>
<link href="party-supplies/jquery.bubblepopup.v2.3.1.css" rel="stylesheet" type="text/css" />
<script src="party-supplies/jquery.bubblepopup.v2.3.1.min.js" type="text/javascript"></script>
<script src="party-supplies/ajaxcart.js" type="text/javascript"></script>
And then a bit later down:

Code: Select all

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="party-supplies/fadeslideshow.js">
So it looks like you're loading jquery-1.4.4 to run bubblepopup from your own site and then a little later loading jquery-1.4.2 to run fadeslideshow from Google. Deleting the second load of jQuery should be safe.

P.S. I also see a spurious </actinic:block> just above the second bit of code above.

P.P.S. You may be able to use a background image for the NorList cells to maintain a browser independent gradient.
Norman
Post Reply