I created a slideshow that works fine in the latest versions of FF, Safari, and IE. I am now trying to do a write-up on my wordpress blog and am porting the slideshow over but I’m experiencing a conflict in IE8. You can see the slideshow at http://jontakiff.com/variable-width-slideshow/ . One of the images is a little too wide but that’s a minor detail. The problem is that in IE8, the slideshow will move the images, but many of the lines of the script are not being executed…the images don’t center and the side panels don’t animate like they’re supposed to. I’m a bit confused because it’s not like it doesn’t work at all in IE8. I’m currently using WordPress verson 3.0.
I used this piece of code to (which has worked well on many occasions) to avoid conflicts.
jQuery(document).ready(function($)
I imagine this might be part of the problem. The script and html work just fine in IE when not within wordpress. As soon as I port the html and script to wordpress (and initialize with that snippet), it’s totally buggy in IE. Using the regular $(function() initializer results in the script not working on at all. Any thoughts? Thanks very much.
Read how to correctly include jQuery and enqueue scripts in WordPress: http://codex.wordpress.org/Function_Reference/wp_enqueue_script and https://wordpress.stackexchange.com/questions/14205/including-jquery-in-wordpress to avoid conflicts.
Use Firebug with Firefox, or in Chrome or Safar or IE8, use the developer tools to see what’s loading on your site and catch the JS errors.