Question

Hello I have some problems understading the Jquery API – especially the animate function: This is described in the api:

$('#clickme').click(function() {
  $('#book').animate({
    width: ['toggle', 'swing'],
    height: ['toggle', 'swing'],
    opacity: 'toggle'
  }, 5000, 'linear', function() {
      $(this).after('<div>Animation complete.</div>');
  });
}); 

Now I want to insert a width value of 100% and a height of 100%…but this is not working…can anyone help me out with the syntax?

$('#clickme').click(function() {
  $('#book').animate({
    width:'100%'['toggle', 'swing'],
    height:'100%' ['toggle', 'swing'],
    opacity:'toggle'
  }, 5000, 'linear', function() {
      $(this).after('<div>Animation complete.</div>');
  });
}); 

Thanks a lot!

Answer 1

'100%' ['toggle', 'swing'] is a syntax error. In the array, the first element tells jQuery how to adjust the value, and the second is the easing function. If you want to keep the swing easing function, you would use

width: ['100%', 'swing'],
height: ['100%', 'swing'],

Else, if you want to use the default easing, specify only '100%':

width: '100%',
height: '100%',