JS fix for IE6 menu width issues

Vaska A / 2008-10-13 10:39:00   

I've been meaning to post this forever...never got around to it. Think I first created this a year ago...woops.

This snip of code requires Jquery to run (so be sure that it follows after your jquery.js file loads up). It will force IE6 and below to use a pixel value for the width of the #menu div. The reason we need this is because IE6- ends up using a percentage value - nothing we can do about it. Except throw some javascript at the problem.

  1. function ndxz_contented() 
  2. ¬†¬†¬†¬†var frame_x = $('body').width(); 
  3. ¬†¬†¬†¬†$('#menu').css('width', 215);
  4. ¬†¬†¬†¬†$('#content').css('width', frame_x-215);
  5. }
  6. $(document).ready( function() { ndxz_contented(); } );
  7. $(window).resize( function() { ndxz_contented(); } );

I recommend putting all of this into a file called ie.js and linking to your template and then using a conditional comment to call it up. We already have an IE6 and below statement for the css so let's just put it there.

  1. <!--[if lte IE 6]>
  2. <link rel='stylesheet' href='http://www.site.com/ndxz-studio/site/theme/ie.css' type='text/css' />
  3. <script type='text/javascript' src='http://www.site.com/ndxz-studio/site/js/ie.js'></script>
  4. <![endif]-->

If you have adjusted the width of your menu in your style.css and ie.css files you will also need to adjust the width in this script from 215 to whatever the new value is.

This will become an official plugin when the new version is released.

sfbuckaroo / 2009-04-16 00:47:11   

Vaska, does the second bit of code completely replace the "IE6 and below" section of the template's index.php file? thanks.

Vaska A / 2009-04-16 07:49:17   

I guess...because it includes that part as well (the ie.css part)...

andre / 2009-05-20 18:47:49   

Hi,

I'm trying to fix some errors on my (andreberger.com.br) site and just find this thread. And I really can't understand where each code goes, what to do with those instructions...

So I wrote the next retarded-oriented questions, for people like me be able to have a website working on IE6.

If someone can have the patience to help with an step-by-step explanation of this procedure, I appreciate your help:

1)How I can "be sure that it follows after your jquery.js file loads up"?

2)This first lines of code (1-8), I should write them on textedit and save like a new file, name "ie.js"?

3)I link this "ie.js" just moving that file to my template folder and adding this second lines of code (1-4) on the "ie.css" file?

4)Should I add something to my "index.php" file?

Vaska A / 2009-05-20 18:55:59   

NOOOOOOOOOOOOOOOOOOOOOO PATIENCE!

Ok, I'm kidding.

;)

Vaska A / 2009-05-20 18:58:39   

1. By making sure that it loads after jquery.js...so it simply follows it further in the page.
2. Yes.
3. See #4.
4. Yes, don't add the code in #3 to the ie.css...add it to your template (index.php)...after #1.

Hope this makes more sense. My intention was to create this...released it fast...planned to rewrite it later.

andre / 2009-05-20 19:06:08   

Thank you very much, now I'm not so afraid to mess with this and just turn my site worst.

Picahouette / 2009-06-05 10:10:24   

I m still struggling to understand some of this...so I would appreciate if I could get a little more help...
1. I have created a new file: ie.js, but how can it go after the jquery.js in the site/js?
I have uploaded it to my ftp but it stacks in an alphabetical order, therefore before jquery.js
2.The second line of text, I am supposed to put it in my site/index.php file, in order to "call it up"...
after #1....sorry but where is #1? first line of text?
Thanks

Picahouette / 2009-06-05 11:11:36   

mmmh....seem to have resolved the second part of my question (patience pays off!!),
however, still don t know how I can load the ie.js after the jquery.js?
am I supposed to change the order in the site/index.php file?

Picahouette / 2009-06-06 14:12:33   

anyone out there who can answer this last one?

Vaska A / 2009-06-06 14:20:05   

Yes.

Picahouette / 2009-06-07 09:19:13   

cheers

This thread has been closed, thank you.