CODEWITHSUNDEEP
jquerycssmargin
ThisBetterWork
ThisBetterWork

Reputation: 503

jquery doesn't seem to recognize left-margin, what can I do?

I don't use jquery very often, but I wanted to animate a side bar. I have a 670px sidebar menu with a -670 left-margin. On mouseover, I would like the left-margin to change to 0px...exposing the hidden content. On mouseout it should return to -670. It seems like the code I wrote may have worked if I were just dealing with the margin(all four sides), instead of left-margin(only the left). But when I specify left-margin in my code I get errors. What are my options?

right now I have "margin" instead of "left-margin", but that's just a place holder. here's my code: 

<script type="text/javascript">

//menu pull out
$(document).ready(function() {
 $('#left_menu').mouseover(function() {
  $('#left_menu').animate({
     margin: 0
  }, 1000, function() {
  });
});

//menu close
$('#left_menu').mouseout(function() {
  $('#left_menu').animate({
    margin:-670
  }, 1000, function() {

  });
});
});
</script>

Upvotes: 0

Views: 333

Answers (2)

jQuerybeast
jQuerybeast

Reputation: 14510

Try:

$(document).ready(function() {
 $('#left_menu').mouseover(function() {
  $('#left_menu').animate({
     marginLeft: '0px'
  }, 1000, function() {
  });
});

//menu close
$('#left_menu').mouseout(function() {
  $('#left_menu').animate({
    marginLeft: '-670px'
  }, 1000, function() {

  });
});
});

Upvotes: 1

defau1t
defau1t

Reputation: 10619

Are you writing left margin as margin-left, if that is the case it wont work, you should use leftMargin instead.

Upvotes: 1

Related Questions