Diskuze: Animace funkce onclick

HTML a CSS HTML a CSS Animace funkce onclick American English version English version

Avatar
Luke Trucino
Člen
Avatar
Luke Trucino:

Ahoj všem, prosím o radu.

Dělám mobilní navigaci všechny funkce fungují, výňatek jsem použil zde na js fiddle.
https://jsfiddle.net/…/pzjou2hd/4/
Problém je, že bych chtěl udělat animaci vykreslení opacity u třídy **.mobilenavlist ** vlastně úplně nejlepší by bylo kdybych animačně rozpohyboval jakékoliv změny co se provedou v javascriptu on click.

Díky moc za pomoc. Věřím že to konečně někdo rozlouskne, proč to nejde.

 
Odpovědět 14. října 0:07
Avatar
gorri
Člen
Avatar
Odpovídá na Luke Trucino
gorri:

Zkus to tam nahrát znovu nebo to nějak upravit. Není vidět nic. :(

 
Nahoru Odpovědět 14. října 10:49
Avatar
Odpovídá na Luke Trucino
Vojtěch Mašek (Woyta):

Použij místo .css() metodu .animate(),
například takhle:

$(e).animate({opacity: 1}, 300);

Manuál k metodě: http://api.jquery.com/animate/

Akceptované řešení
+20 Zkušeností
+1 bodů
Řešení problému
Nahoru Odpovědět 14. října 11:49
Výraz "to nejde" není v mém slovníku
Avatar
Ján Timoranský
Redaktor
Avatar
Odpovídá na Luke Trucino
Ján Timoranský:

Pri tomto nechceš používať opacity a display ale skús radšej kombináciu opacity a visibility.

Keď chceš menu schovať:

opacity: 0;
visibility: hidden;

A keď ho chceš zobraziť použi:

visibility: visible;
opacity: 1;

Samozrejme, display: none je lepšie, čo sa behu webu týka. Preto najlepšie urobíš, aby si to zanimoval pomocou visibility a po skončení animácie použi ešte display.

Nahoru Odpovědět  +1 14. října 20:48
Find what you love and let it kill you.
Avatar
Ján Timoranský
Redaktor
Avatar
Ján Timoranský:

Prikladám ešte JSFiddle

Nahoru Odpovědět 14. října 21:00
Find what you love and let it kill you.
Avatar
Luke Trucino
Člen
Avatar
 
Nahoru Odpovědět 19. října 7:45
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 6 zpráv z 6.