idanoo/interesting.rocks
1
0
Fork 0
mirror of https://github.com/idanoo/interesting.rocks synced 2025-07-01 05:32:19 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Boop

Browse source
This commit is contained in:
Daniel Mason 2025-05-12 16:54:38 +12:00
parent 3d7b6a51a4
commit 3767986aed
Signed by: idanoo
GPG key ID: 387387CDBC02F132
2 changed files with 32 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

34
index.html
View file

@ -6,6 +6,7 @@
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>interesting.rocks</title>
<link rel="icon" href="./favicon.ico" type="image/x-icon">
<script src="jquery-3.7.1.slim.min.js"></script>
<style>
body {
margin: 0;
@ -23,9 +24,9 @@
margin: 0 0 50px 0;
}
.rotate {
/* .rotate {
animation: rotation 5s infinite linear;
}
} */
img {
margin-top: 5px;
@ -61,8 +62,8 @@
<h1>interesting.rocks</h1>
<div class="rockcontainer">
<div class="rockrow">
<img src="rock1.png" alt="rock" class="rotate">
<img src="rock2.png" alt="rock" class="rotate">
<img src="rock1.png" alt="rock" class="rotate" width="474" height="316">
<img src="rock2.png" alt="rock" class="rotate" width="474" height="369">
</div>
<div class="rockrow">
<img src="rock3.png" alt="rock" class="rotate">
@ -70,5 +71,30 @@
</div>
</div>
</main>
<script>
let x = 10;
let boop;
function setSpeed() {
x = x/2;
if (x < 0.01) {
clearInterval(boop);
$('.rockcontainer').css('animation', 'rotation 5s infinite linear');
$('.rotate').each(function(index , element) {
$(element).css('animation', 'rotation 5s infinite linear');
});
return
}
$('.rotate').each(function(index , element) {
$(element).css('animation', 'rotation ' + x + 's infinite linear');
});
}
$(function() {
boop = setInterval(setSpeed, 500);
});
</script>
</body>
</html>

2
jquery-3.7.1.slim.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long