CODEWITHSUNDEEP
javascriptjqueryinternet-explorerinternet-explorer-7
Xand94
Xand94

Reputation: 717

Jquery animation not working in IE7

I'm in the process of finishing up a site and just working on making it ie7 compat, however theres one basic script that moves 3 tabs up/down and it's failing to work what so ever. the code is below.

 $(document).ready(function() {
     $('.lower').click(function() {

    $('#range-dropdown').animate({
    top: '315',
  }, 2000, function() {});
  $('#range-dropdown2').animate({
    top: '0',
  }, 2000, function() {});
      $('#range-dropdown3').animate({
    top: '0',
  }, 2000, function() {});
      $('.rangelist-container').animate({
    top: '715',
  }, 2000, function() {});
      $('#dropdown-holder').animate({
    marginBottom: '120px',
  }, 2000, function() {});
   });


   $('.lower1').click(function() {
   $('#range-dropdown2').animate({
    top: '315',
  }, 2000, function() {});
      $('#range-dropdown').animate({
    top: '0',
  }, 2000, function() {});
      $('#range-dropdown3').animate({
    top: '0',
  }, 2000, function() {});
     $('.rangelist-container').animate({
    top: '715',
  }, 2000, function() {});
        $('#dropdown-holder').animate({
    marginBottom: '120px',
  }, 2000, function() {});


    });

  $('.lower2').click(function() {
  $('#range-dropdown3').animate({
    top: '315',
  }, 2000, function() {});
    $('#range-dropdown').animate({
    top: '0',
  }, 2000, function() {});
    $('#range-dropdown2').animate({
    top: '0',
  }, 2000, function() {});
    $('.rangelist-container').animate({
    top: '715',
  }, 2000, function() {});
        $('#dropdown-holder').animate({
    marginBottom: '120px',
  }, 2000, function() {});


  });
 });

any help would be greatly appreciated

*all css values are declared in the stylesheet.

Upvotes: 0

Views: 2321

Answers (2)

mu is too short
mu is too short

Reputation: 434685

You have stray trailing commas all over the place, for example:

$('#range-dropdown').animate({
    top: '315', // <----------------- Right here
}, 2000, function() {});

Remove those so that it looks like this:

$('#range-dropdown').animate({
    top: '315'
}, 2000, function() {});

IE7 gets upset by those trailing commas but most other browsers let it slide and DWIM (Do What I Mean) instead of complaining.

Upvotes: 2

Blender
Blender

Reputation: 298206

Try explicitly stating the units. You are saying '315', but what units is that in? Feet? Meters? Centimeters? Use '315px', as it explicitly states the units.

Also, you don't need to write function() {} over and over. Just omit it completely.

Upvotes: 1

Related Questions