Показать сообщение отдельно
  #10 (permalink)  
Старый 14.03.2019, 09:41
Аватар для Блондинка
Профессор
Отправить личное сообщение для Блондинка Посмотреть профиль Найти все сообщения от Блондинка
 
Регистрация: 24.02.2019
Сообщений: 806

Сообщение от Malleys
Вы просите одно, а ожидаете другое. Формулируйте свои вопросы более точно, указывайте все подробности.
я расчитывала что мне просто дадут формулы как высчитать время и угол отклонения в другую сторону при затухающих колебаниях, с подробными пояснениями этих формул

Сообщение от Malleys
Оно равно θ(t), где t принимает значения 0, 1/2 * T, T, 3/2 * T, 2 * T, ..., k/2 * T; k ∈ N.
с подробными пояснениями что значат буквы в этих формулах.

Сообщение от Malleys Посмотреть сообщение
Если вы хотели добавить префиксы, то вам ещё нужно добавить -webkit-border-radius и -moz-border-radius.
...............
исправила
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Математический маятник</title>
<style>
#mathematics_pendulum { width: 930px; height: 500px;  background: -webkit-linear-gradient(top, #ade6ad, #e6e6cc); background: -moz-linear-gradient(top, #ade6ad, #e6e6cc); background: -o-linear-gradient(top, #ade6ad, #e6e6cc); background: linear-gradient(to top, #ade6ad, #e6e6cc); -webkit-border-radius: 50px/35px; border-radius: 50px/35px; border: 1px solid #c0c0c0; position: absolute; }
#still_point { width: 1px; height: 1px; background: transparent; border-top: 45px solid #000080; border-left: 45px solid transparent; border-right: 45px solid transparent; border-bottom: 45px solid transparent; position: absolute; left: 420px; }
#pendulum {  width: 75px; height: 400px; display: inline-block; position: absolute; left: 428px; top: 45px; -webkit-transform-origin: 50% 0; -ms-transform-origin: 50% 0; transform-origin: 50% 0; }
#mathematics_pendulum.animation_demo #pendulum { -webkit-animation: pendulum-1 1.79s linear 0s 1 normal forwards; animation: pendulum-1 1.79s linear 0s 1 normal forwards; }
#pendulum_rod { width: 3px; height: 325px; background: #999999; border-radius: 2px; position: absolute; left: 36px; }
#point_pendulum { width: 75px; height: 75px; display: inline-block; -webkit-border-radius: 50%; border-radius: 50%; background: -webkit-radial-gradient(60% 40%, circle, #bfbfff, #00f); background: -o-radial-gradient(60% 40%, circle, #bfbfff, #00f); background: radial-gradient(circle at 60% 40%, #bfbfff, #00f); position: absolute; top: 325px; }
@-webkit-keyframes pendulum-1 { 0% { -webkit-transform: rotate(90deg); transform: rotate(90deg); } 100% { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } } @keyframes pendulum-1 { 0% { -webkit-transform: rotate(90deg); transform: rotate(90deg); } 100% { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } }
</style>
</head>
</head>
<body>
<div id="mathematics_pendulum" class="animation_demo">
<span id="still_point"></span>
<span id="pendulum">
<span id="pendulum_rod"></span>
<span id="point_pendulum"></span>
</span>
</div>
<script>
var a = document.querySelector("#mathematics_pendulum"); a.addEventListener("click", function() { a.classList.remove("animation_demo"); document.documentElement.clientWidth; a.classList.add("animation_demo"); });
</script>
</body>
</html>


Сообщение от Malleys
Вы просите одно, а ожидаете другое. Формулируйте свои вопросы более точно, указывайте все подробности.
Сейчас надеюсь что помогут вставить скрипт маятника с затухающими колебаниями в код представленный выше в этом посте, но со всеми необходимыми префиксами...
<script>{
	const pendulumElement = document.querySelector(".pendulum");
	var startTime;

	function setNewStartTime() {
		startTime = Date.now() / 1000
	}

	setNewStartTime();

	(function loop() {
		const t = Date.now() / 1000 - startTime;
		const θ = 0.5 * Math.PI * Math.cos(Math.sqrt(9.8) * t);
		const f = Math.exp(-.25 / Math.PI * t * t);
		pendulumElement.style.setProperty("--θ", `${f * θ}rad`);
		requestAnimationFrame(loop);
	})();

	pendulumElement.addEventListener("click", setNewStartTime);
}</script>

Последний раз редактировалось Блондинка, 14.03.2019 в 10:22.
Ответить с цитированием