From 94b352a2b2753031262e259b38dcf8b2471b7915 Mon Sep 17 00:00:00 2001 From: paulmart-n Date: Wed, 27 Dec 2023 16:08:07 +0100 Subject: [PATCH] alles relativ --- about.html | 4 +-- animations.js | 26 ++++++++-------- index.html | 7 +++-- style.css | 82 ++++++++++++++++++++++++++++----------------------- 4 files changed, 66 insertions(+), 53 deletions(-) diff --git a/about.html b/about.html index 55d7f9b..2ede06f 100644 --- a/about.html +++ b/about.html @@ -23,8 +23,8 @@
-

/ˈdaɪ.ə.lekt/
-

AI steckt nicht nur im Namen.

+

/ˈdaɪ.ə.lekt/

+

AI steckt nicht nur im Namen.

diff --git a/animations.js b/animations.js index bbf8857..e3107b6 100644 --- a/animations.js +++ b/animations.js @@ -6,21 +6,20 @@ $(document).ready(function () { uplabel = document.getElementById("filelabel") upline = document.getElementById("formline") upbtn = document.getElementById("upload") - if (upbtn != null) {upbtn.addEventListener ("click", ButtonPress)} - var height1 = $("#eins").height (); - var height2 = $("#zwei").height (); - if (height1 < 300) {height1 += 550}; - console.log (height1, height2); $("#fileselect").change(function() { uplabel.textContent = this.files[0].name + " (Klick zum Ändern)" changeFile () }); + if (upbtn != null) {upbtn.addEventListener ("click", ButtonPress)} $(window).scroll(function () { + var height1 = $("#eins").height (); + var height2 = $("#zwei").height (); + var screenheight = $("body").height(); var pos = $(this).scrollTop (); - if (stage ==1 && pos-200 >= height2) { moveBlobs ("225vh", 600, 2)} - else if (stage == 2 && pos < height2 ) { moveBlobs ("95vh", 1000, 1)} - else if (stage == 0 && pos+600 >= height1){ moveBlobs ("95vh", 1000, 1)} - else if ((stage == 1 && pos < height1-450)) { moveBlobs (0,0,0) } + if (stage == 1 && pos-(screenheight/4.5) >= height2) { moveBlobs ("225vh", "31vw", 2)} + else if (stage == 2 && pos-(screenheight/1.9) < height2 ) { moveBlobs ("95vh", "52vw", 1)} + else if (stage == 0 && pos+(screenheight/1.5) >= height1){ moveBlobs ("95vh", "52vw", 1)} + else if ((stage == 1 && pos < height1-(screenheight/2))) { moveBlobs (0,0,0) } }) } ) @@ -58,7 +57,7 @@ function moveBlobs (t, r, to) { setTimeout (function () { $("#blobs").css ({ 'top': t, - 'right': r + 'px', + 'right': r, 'animation': '',}); $("#green").css ({ 'animation': 'appear 0.4s -0.075s ease-in' }) $("#blue").css ({ 'animation': 'appear 0.4s 0s ease-in' }) @@ -88,17 +87,20 @@ function changeFile (){ function ButtonPress () { upbtn.setAttribute ('disabled', 'disabled') - uplabel.setAttribute('hidden', 'hidden') - upline.setAttribute('hidden', 'hidden') document.body.style.cursor = "progress" $("#fileupload").css ({ 'cursor': 'not-allowed', 'animation': 'text-in-out 1s' }) + $("#formline").css ({ + 'animation': 'border-out 1s' + }) $("#upload").css ({ 'cursor': 'not-allowed', }) setTimeout (function () { + uplabel.setAttribute('hidden', 'hidden') + upline.setAttribute('hidden', 'hidden') upbtn.value = "Verarbeite..." $('#upload').css ({'padding-top': '3vw'}) }, 500) diff --git a/index.html b/index.html index 04454a2..49124a8 100644 --- a/index.html +++ b/index.html @@ -23,7 +23,8 @@
-

DAIA
LECT

+

DAIA
+ LECT

@@ -42,7 +43,9 @@
-

MIT HILFE VON
KI ALLE

MENSCHEN VERSTEHEN

+

MIT HILFE VON
+ KI ALLE

+

MENSCHEN VERSTEHEN