Все работает отлично хорошо.Вот только сама прокрутка происходит по центру экрана.Тоесть не там где изначально создан этот <div id="flipBox"> а выше на экране.Неподскажите почему?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Test</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.7.2.custom.min.js"></script>
<script type="text/javascript" src="jquery.flip.min.js"></script>
<script type="text/javascript">
function Flip(){
jQuery(document).ready(function(){
jQuery("#flipBox").flip({
direction:"rl",
color:"#539127",
content: 'новый текст'
});
});
}
</script>
</script>
</head>
<body>
<form onsubmit="return false">
<div id="divi">
<div id="queston"></div>
</div>
<button id='send' name='send' onclick='checkAnswer()' >Проверить</button>
<button id="id1" type='reset'>Стереть Ответы</button>
<button id="id2" type='reset'>Начать тест заново</button>
<button id="id3" onclick="TrueAnswer()" >Показать правильный ответ</button>
<div><input style="width:200px; height:50px" type="text" id="output" readonly></input></div>
</form>
<div id="id4" onclick = "text()" style="border:5px solid black; width:100px ;height:100px">Здесь ваш текст</div>
<div id="animation" style="width:100px;height:100px;background:Black;color:White;text-align:center;" onclick="animate()" >Word</div>
<div id="flipBox" style="border:5px solid black; width:100px ;height:100px" onclick="Flip()">
Будем кувыркаться!
</div>
</body>
</html>
Но а если я делаю вот так
function Flip(){
$(document).ready(function(){
$("#id5").flip({
direction:"rl",
color:"#539127",
speed: 100,
content: 'новый текст'
});
});
}
<body>
<div id="id5" style="border:5px solid black; width:100px ;height:100px;background:#539127" onclick="Flip()">Что-то</div>
</body>
То все работает отлично и крутитса <div> в томже месте.Почему действие одно и тоже а выполняетса немного по другому?
И подскажите пожалуста.Как при повторном нажатии стили возвращались на первоначальные.Тоесть что-бы при повторном нажатии стили были не которые я указал здесь
color:"#539127",
content: 'новый текст'
А стили и текст которые были здесь
<div id="id5" style="border:5px solid black; width:100px ;height:100px;background:#539127" onclick="Flip()">Что-то</div>