views:

116

answers:

2

Arrg! My site (in progress) is working great so far in all browsers I've tested to-date (firefox, safari, chrome, and IE8) but not in IE7 (I dont know about IE6 or other browsers) .... I'm not positive but i think the issue has to do with the use of prepend() in my jQuery. the main issues are the main menu (should show up in the blue horizontal bar to the left of the logo) as well as the search box at the top right, both added using prepend. there are other issues throughout in IE7 so i'm not sure if I'm on track thinking it's from the jQuery or not, or if there is a typo somewhere in my current mess of css!

Here is the script I'm using for the main menu which is not working in IE7, but works in other browsers - does anyone see a problem here?

<script type="text/javascript">
<!--
$(function() {

/* ************************************** */
/* main menu */
/* ************************************** */
$("#bannerAreaWrapper").prepend("<div id='MainMenu'><a id='neutralsBtn' class='MainMenuModule' href='/neutrals-overview/'>Neutrals</a> <span class='bullet'>•</span> <a id='practicesBtn' class='MainMenuModule' href='/practices/'>Practices</a> <span class='bullet'>•</span> <a id='locationsBtn' class='MainMenuModule' href='/locations/'>Locations</a></div>");

});
-->
</script>

Here is the link to the site: http://www.agencydr.squarespace.com Help is appreciated!!

+1  A: 

your prepend function works fine when I run it through the dev toolbar script console on IE7 although it doesn't work on load. You are getting a js error on IE8 and two on IE7. The additional one on IE7 is to do with this function:

$('#LocationsMapWrapper').hover(function() {
   $('#LocationsMapWrapper #MapImage').animate({
      width: 600,
      height: 375,
      marginLeft: 550,
      marginTop: -20,
   }, "slow", "easeOutQuad");
 }

line 139 specifically

Try removing this and see if the navigation works as expected on page load

EDIT

Boom, got it.

Try removing the comma after 'marginTop: -20,' The last element shouldn't have this, think it affects all older browsers

lnrbob
yep!! that was it - i removed the whole bit i have for the locations map and now the menu and the search box show up as they should in IE7!! Thanks so much!! i had gone through and removed bits of code trying to track something like that down but i obviously missed it!!
VUELA
now i just need to figure out what's wrong with the map script!!
VUELA
just remove the comma after `marginTop: -20,` see my answer above
JungleFreak
Thanks!~ I removed the comma and it worked. Thanks so much!!
VUELA
+3  A: 

IE7 is finding two javascript errors in your site:

Expected identifier, string or number line 139
$('#LocationsMapWrapper').hover(function() {
   $('#LocationsMapWrapper #MapImage').animate({
      width: 600,
      height: 375,
      marginLeft: 550,
      marginTop: -20,                <---- remove comma
   }, "slow", "easeOutQuad");
 }

 'document.getElementById(...)' is null or not an object line 355
Shadowbox.setup(document.getElementById('Map').getElementsByTagName('area'), {width : 450, height : 400});
JungleFreak