Question

I’ve tried running this through the w3c validator and can’t seem to find my error. I’m hoping some extra eyes can find what I’m doing wrong.

JQuery

$(function() { 
$('#play').click(function() { $('#slides').cycle('toggle'); return false; });   

$('#slides').cycle({ 
    fx:    'none',
prev:  '#prev',
next:  '#next', 
    speed: '1000', 
    timeout: 2000 
}); 

$('#slides').cycle('pause');

$('.pause').toggle(
  function() {
    $('#pausectrl').attr({src: 'images/pause1.png', class: 'paused'});
  },
  function() {
    $('#pausectrl').attr({src: 'images/play1.png', class: 'playing'});
  }
);

$('.playing').live("mouseover", function() {
  $(this).attr('src','images/play2.png');
});

$('.playing').live("mouseout", function(){
  $(this).attr('src','images/play1.png');
});

$('.paused').live("mouseover", function() {
  $(this).attr('src','images/pause2.png');
});

$('.paused').live("mouseout", function(){
  $(this).attr('src','images/pause1.png');
}); });

You can view the page here MMA Sample Slideshow

Answer 1

For Internet Explorer, you have to add quotes to the “class” identifier.

Change your class to "class" and that should be working 😉

Example:
$('#pausectrl').attr({src: 'images/play1.png', class: 'playing'});
becomes $('#pausectrl').attr({src: 'images/play1.png', "class": 'playing'});