Errors using IE8

[Paul Spiller]

I am using the Elite template and although my design works as expected even with css modifications on safari and others, it fails using IE8 on windows 7 (which does not really surprise me).

However, even your demo site has errors using IE8. The attached screen shot of the errors are similar as my site. I may of course caused a few more problems with my css changes which I will address but these ones concern me.

Can these be addressed.

It would be nice to start with a clean sheet especially if I am tweaking css.

Paul

Attachments:

1. 

   elite-demo-errors.png
   

[Bill Robbins]

Paul,

Thank you for your business first of all. Sorry for the trouble there. It looks like the animation that I added to the theme last Thursday is causing the trouble with IE 8. The animation uses the section tag which is a HTML5 element that IE 8 doesn’t support natively. The theme uses a HTML5 shiv so that IE 8 will recognize those elements, but evidently that is not keeping the javascript happy.

I will look at changing the script and theme so that it will not use that tag if possible. Until then, you could always remove the animation. Here’s how:

1. Go to the Appearance section in your WordPress control panel and select Edit.
2. From the list of files on your right, choose scripts.php
3. Find these line:

   
   wp_enqueue_script('modernizr');
   wp_enqueue_script('classie');
   wp_enqueue_script('scroller');
   

   and delete them and save your changes.

4. Next edit the custom-js.php file and find this spot:

   
   // Page Animations
   	new cbpScroller( document.getElementById( 'cbp-so-scroller' ) );
   

   and delete it and save your changes.

That will remove animation script and should hopefully take care of that warning for you.

If I can make the change to the script, I’ll include it in the next theme update. Either way I’ll include a method to disable it without having to edit the theme.

Thanks,
Bill

[Paul Spiller]

Bill,
Thanks for the prompt reply.
I had the updates turned off and so I think I have an older version as those lines are not in scripts.php.

However, it may have worked out fine as you found a problem that needed attention.

I think I also found my problem – for some reason IE8 was in “compatibility view” mode. When I turned that off those problems went away (why they would force a browser to work like an older one that has many problems with sites is beyond me).

I have modified the template css (to suit a clients requirements) such that responsiveness is gone such that I removed most of the responsiveness section of style.css (as per one of your posts) but left the code there that it would have used for a particular size screen – in effect setting a fixed layout.

This works fine in safari, firefox, chrome but IE actually crashes when I go the the shop page. Just mentioned it as you may be able to give me a clue – I am going to look further before requesting help.

I would understand if you are reluctant to help with modified code.

Thanks Paul

[Bill Robbins]

Hey Paul,

I’d be glad to take a look for you. Can you send me the URL to your shop page? Also which version of IE are crashing there?

Thanks,
Bill

[Paul Spiller]

Thanks again Bill,

Lets take a reset here. I am my own worst enemy. I modified the css too much – all worked fine on safari but good old IE8 had conniptions. After restoring back to normal these problems went away.
However I am still wanting to modify the css somewhat (more carefully) and will contact you if I run into something I cannot resolve. As I say, I modify and all works well in everything except IE8 – keeps one on their toes but sometimes this way lays madness.

Paul

[Bill Robbins]

Working through IE bugs can be such an exercise in frustration.

One bit of help that’s built into the theme is a HTML class that’s added for IE versions. It’s a hook you can use to apply styles only to the version of IE giving trouble. Here they are:

html.ie8 -- Internet Explorer 8
html.ie9 -- Internet Explorer 9

so to target a div in IE 8 only you could use this:

html.ie8 div#content {
    styles go here
}

and that would only affect the #content div when viewed with Internet Explorer 8.

Let me know if you run into trouble,
Bill

[Author]

Posts