Płynne przejście z ekranu ładowania do strony głównej

0

Cześć,

Mam sobie taki kod: https://jsfiddle.net/b92gsx5c/, HTML jest troszkę do poprawy, no ale nie w tym rzecz. Chodzi mi o uzyskanie efektu który jest mniej - więcej widoczny w tym co wkleiłem, czyli przejście z ekranu ładowania płynnie do głównej treści strony. Teraz nie jest płynny przez progi w @keyframes, czcionka jest wrzucona do head więc też jej nie widać, no ale aspekty wizualne zostawię sobie na później, jak będę miał szkielet :) w tym momencie animacja jest ok, natomiast jakoś ucina mi ten górny element nav (staje się nieklikalny, coś go przykrywa tylko nie mogę dojść do tego co...), do tego ikonki na dole są widoczne w trakcie rozpoczęcia animacji, powinny się pojawić po animacji. Założyłem sobie, że na razie będę wykorzystywał tylko HTML i CSS, bez JS. Macie pomysł co tutaj popsułem? + ewentualne uwagi na temat samego css byłyby mile widziane. Samo przejście szczerze mówiąc zrobiłem troszkę "na czuja" ale nie mam innego pomysłu na ten moment, niedawno zacząłem naukę. Może @Desu coś poradzi? :)

0

Cały Twój zamysł jest bez sensu. ładowanie bez js? Przecież to w js sprawdzasz czy strona się załadowała...
Menu zasłania Ci loader-wrapper. Po załadowaniu strony powinien mieć display: none;

0

Nie wiem czy osiągniesz ten efekt w CSS. Musisz po wykonaniu animacji ją schować do "display: none". Ostatecznie możesz pobawić się jeszcze z-indexami.

0
Świetny Terrorysta napisał(a):

Cały Twój zamysł jest bez sensu. ładowanie bez js? Przecież to w js sprawdzasz czy strona się załadowała...
Menu zasłania Ci loader-wrapper. Po załadowaniu strony powinien mieć display: none;

W sumie może moje założenie jest kijowe, miałem najpierw sobie ogarnąć html/css, dopiero później zacząć z JSem. Może go rzeczywiście powoli wprowadzę żeby nie utrudniać sobie życia, tym bardziej, że już mam pomysł jak to ma wyglądać wizualnie. @CeKa dzięki, nie wpadłem na display: none... :)

1 użytkowników online, w tym zalogowanych: 0, gości: 1