0
Итак, я пытаюсь использовать эффект анимации jQuery, редактируя поля для перемещения. Проблема в том, что когда я использую эффект анимации, он находится в div, который содержит большую часть моего содержимого на странице. . Маржа я редакция заканчивает тем, что по отношению к фактической странице, а не ДИВО это в Вот пример:Поля относительно текущего Div
<html>
<head>
<script src="javascript/jQuery-1.7.1.min.js" type="text/javascript"></script>
<style type="text/css">
#maincontent{
padding-bottom: 3em;
width: auto;
background:#fff;
text-align: left;
margin-left: 10%;
margin-right: 10%;
margin-top: 60px;
}
#animateBox
{
height: 100px;
width: 100px;
background: red;
position: absolute;
}
#moveLeft
{
display: none;
}
#moveRight
{
display: inline;
}
</style>
<script type="text/javascript">
$(document).ready(function() {
$('#moveRight').click(function() {
$("#animateBox").animate(
{"left": "+=200px"},"normal");
$('#moveRight').css('display', 'none');
$('#moveLeft').css('display', 'inline');
});
$("#moveLeft").click(function() {
$("#animateBox").animate(
{"left": "-=200px"},
"normal");
$('#moveLeft').css('display', 'none');
$('#moveRight').css('display', 'inline');
});
});
</script>
</head>
<body>
<div id="maincontent">
<div id="animateBox"></div>
<br />
<br />
<br />
<br />
<br />
<input type="button" id="moveRight" Value="Move Right" style="width: 100px">
<input type="button" id="moveLeft" Value="Move Left" style="width: 100px">
</div>
</body>
Есть ли способ исправить это? Благодарю.
Вы хотите, чтобы кнопка отошла от animatebox? – uday
Я не совсем понял вопрос, http://jsfiddle.net/G5H3T/, скрипку из приведенного выше кода. Теперь в чем проблема? –
Попробуйте очистить состояние, что вам нужно. – uday