Я пытаюсь заставить Jquery анимировать несколько длинных макетов по горизонтали, но не могу заставить их работать.Я подозреваю, что это серьезная проблема, но пытался часами и не может ее исправить.Пожалуйста, помогите и спасибо заранее.
Я пытаюсь заставить "innerlonglayout" прокручиваться горизонтально нажатием кнопки.
вот мой код:
<div id="innermask">
<div id="innerlonglayout">
<div class="container-bits">Content Here</div>
<div class="container-bits">Content Here</div>
<div class="container-bits">Content Here</div>
<div class="container-bits">Content Here</div>
<div class="container-bits">Content Here</div>
<div class="container-bits">Content Here</div>
</div>
</div>
<div class="boxmenu">
<span id="2002"><img src="images/butt_2002.png"></span>
<span id="2003"><img src="images/butt_2003.png"></span>
<span id="2004"><img src="images/butt_2004.png"></span>
<script>
$("#2002").click(function() {
$("#2002").parent().parent().parent().children().children().animate({position:'fixed',left:'30px'}, "slow");
});
$("#2003").click(function() {
$("#2002").parent().parent().children().children().animate({position:'fixed',left:'-300px'}, "slow");
});
$("#2004").click(function() {
$("#2002").parent().parent().children().children("#innerlonglayout").animate({position:'fixed',left:'-600px'}, "slow");
});
</script>
</div>
А вот и мой CSS:
#innermask{
width:500px;
height:250px;
border:1px solid #cc61b8;
overflow:hidden;
}
#innerlonglayout{
width:10000px; // just an example
}
.container-bits{
width:250px;
height:498px;
float:left;
}