Also ich bin ein kompletter Anfänger und deshalb doppelt begeistert. Was ich aber nicht verstanden/gesehen habe ist, wie kommt main.sass in die index.html Über .element ??? Was ich aber schon wo anders gelernt habe ist das man nicht makieren einfügen machen muss, sondern ein CSS Short dafür machen kann. Zumindest in Visual Studio Code Habe dich als Lesezeichen abgespeichert und immer mal wieder reinschauen. Vielen Dank für deine Videos
na klar, du musst nur die Swiggle Animation auf eine CSS Class legen und diese Class bei einem Click auf den Button legen, dann mti einem setTimeout nach der Animation die Class wieder entfernen
Würde gerne per CSS eine Postkarte animieren. Also die soll sich per links-klick horizontal an der Mittelachse drehen und dann die Rückseite zeigen. Ist das möglich?!
3 ปีที่แล้ว
Moin, sehr cooles Video. Bei mir werden einige CSS Eigenschaften nicht Autovervollständigt. box-shadow z.B. fehlt da noch irgendein Plugin für VSC? LG Marco
Gut, das Video ist von 2019, jetzt haben wir 2023. Dennoch, der Code wie auch Codepen ist nicht verlinkt. Codepen habe ich selber aber den Code als Ganzes zu sehen, wäre auch nach dieser Zeit echt nice gewesen...
Bei 68k Aufrufe nur 3k "Daumen hoch" ist schlichtweg eine Sauerei. Du versprichst etwas - du hältst es (du wirst niemals Politiker werden) und es sind Sachen, die jeder in einer Website realisieren kann und auch sollte.
Hallo, gibt es auch eine gute Möglichkeit die erstellen Elemente zu sortieren? Beispielsweise, wenn man vier solcher Divs mit unterschiedlichen H2 (Element, Text, Button, Container) hat und diese nach dem H2 alphabetisch sortieren möchte? Viele Grüße
Wenn dann mit JS :) du könntest alle Elemente in einem Array haben und dieses Array dann nach dem innerhtml sortieren und darauf die Elemente nacheinander dem DOM hinzufügen.
Theoretisch ja, du müsstest entweder einen Formatter nutzen der dir aus sass einfach css generiert oder aber die fehlenden Zeichen manuell hinzufügen :)
Cooles Video für Einsteiger 👌🏻 allerdings sollte das width oder das height Attribut niemals animiert werden, wenn es sich im allgemeinen um ein grösseres Projekt handelt. Das ist extrem schlecht für die Performance. Dann lieber dem Parent Element einen overflow: hidden geben und das ::after Element mit css „transform“ nach rechts bewegen.
Habe bei der HTML und bei der Sass datei genau das wie du hast eingegeben, aber wen ich die seite lade passiert steht nur elements da, es kommt aber keine animation oder so
hallo kannst du mir eine kurze video über css Twenty Seventeen Wordpress Hintergrundbild einfügen und Speichen usw machen besten dank du kannst auch mir per wahtapp video senden besten Dank für deine Bemühung
Ich bin immer noch kein Fan davon, die Schriftgröße beim body auf 10px zu setzen, da Browser nicht umsonst die Schriftgröße von 16px vorgeben und es nur verwirren würde, wenn etwas mit rem auf 32px gebracht werden soll, 2rem aber dann 20px sind. 16px sind einheitlich bei allen Browsern und dies zu überschreiben nur weil man dann einfacher "rechnen" kann ist für mich kein Vorteil sondern einfach Faulheit und kann unnötig für Verwirrung sorgen.
Hmm, also finde eigentlich schon das man etwas lernt, es ist kein Absolute Basics Video da es nicht nur 1. Punkt hat, sondern mehr eine Inspiration für verschiedene kleine mini Effekte.
![5 wichtige Webdesign Prinzipien die JEDER kennen sollte! [Tutorial]](http://i.ytimg.com/vi/X2YA2PFUwr0/mqdefault.jpg)
![5 wichtige Webdesign Prinzipien die JEDER kennen sollte! [Tutorial]](/img/tr.png)
![BESTER BUTTON EFFEKT Ever?? CSS Only Gummy Animation oO 👍 [TUTORIAL]](/img/n.gif)
So ein Video ist für mich persönlich Gold wert 💙👏
Freut mich wenn dir das Video gefällt :D
Aber sowas von Gold 😊
Muss mir dann doch mal SASS ansehen 😅
@@alff3461 sus
Von solchen Animationen wünschte ich gäbe es eine ganze Kategorie auf deinem Chanel, sehr cool, Danke
Wird in Zukunft immer mal wieder kommen solche Videos :)
Wie in der Mathe Vorlesung, Sekunde nicht hingeguckt direkt halbes Buch geschrieben.
xD das stimmt :D wobei es maximal eine Minute sein kann ;)
Richtig toll gemacht und super einfach erklärt... vielen Dank :)
Freut mich wenn dir die Videos gefallen :)
Super qualitativer Kanal den du da betreibst. Werde mir deine Videos anschauen und das Wissen zu nutze machen. Danke für deine mühe
LG
Also ich bin ein kompletter Anfänger und deshalb doppelt begeistert.
Was ich aber nicht verstanden/gesehen habe ist, wie kommt main.sass in die index.html
Über .element ???
Was ich aber schon wo anders gelernt habe ist das man nicht makieren einfügen machen muss, sondern ein CSS Short dafür machen kann. Zumindest in Visual Studio Code
Habe dich als Lesezeichen abgespeichert und immer mal wieder reinschauen.
Vielen Dank für deine Videos
Sehr sehr geile Animationen! Kann man echt super auf Buttons, Divs, Images etc. anwenden, mit was man ja eigentlich sehr oft interagiert!
Danke freut mich wenn dir das Video weiterhelfen konnte :)
nettes kleines video für anfänger :)
ein kleiner hint: animation-direction: alternate;
Gefällt mir sehr gut. Gut erklärt. Vielen Dank
nächstes mal den nervigen Uhrensound ausmachen
nächstes mal eine bessere Wortwahl wählen und sich auch mal bedanken👌🏻;)
Kurzer Tipp den Script Tag kannst du in den Header packen und das Attribut „defer“ hinzufügen. Hat den selben Effekt wie am Ende
Kurz. Knapp. Kompakt. Danke dir :)
Danke freut mich wenn es dir gefallen hat :)
Hammer Effekte...!
Super. Video hab ich mir gleich gespeichert. Wird mir bestimmt mal behilflich sein
hehe freut mich wenn es dir gefällt :)
coole Sache, hab gleich mal ein Abo da gelassen
Danke freut mich wenn dir das Video gefallen hat :)
Gibt es eine Möglichket , die " Swiggle " Animation dann auszuführen , wenn man auf den Button Clickt ? , Super Tutorial , Hab was neues gelernt ! 😄
na klar, du musst nur die Swiggle Animation auf eine CSS Class legen und diese Class bei einem Click auf den Button legen, dann mti einem setTimeout nach der Animation die Class wieder entfernen
@@UnleashedDesign Es hat Funktioniert ! , Danke ! 😄😄
Sehr cool gemacht!!
Freut mich wenn es dir gefällt :)
super geil :D
Richtig geiler Content
Danke freut mich wenn dir der Inhalt gefällt :)
Super erklärt, super Content!
Freut mich wenn es dir gefällt :)
Ich habe mal ne Frage: Was ist mit dem Semikolon hinter jeder Linie. Hast du das ausgeblendet?
Das ist in dem Video Sass kein reines CSS, das ist ein CSS Preprocessor :)
Hammer Video!
Danke :)
👌👍🏾 interessant!
Freut mich wenn es gefallen hat :)
endlich das was ich gesucht habe
Freut mich wenn dir da Video helfen konnte :)
sehr sehr cool
Danke freut mich wenn es dir gefällt :D
Sehr cooles Video. Vielen Dank :)
Danke, freut mich wenn es dir gefällt :)
Top video, danke.
Danke, freut mich wenn dir das Video geholfen hat :)
Hammer! :D
Danke Freut mich wenn es dir gefällt :)
Vielen Dank dafür
gerne :)
Gracias! Me sirvió mucho
Danke, sehr gut erklärt!
genial :D
So witzig, wie du hover sagst^^
Ein Grund warum ich keine Videos auf Englisch mache xD
wow! it was really very cool! Thanks!))
Thx, i hope you understand everything even when its in german :)
Geil! 💪🏼
Freut mich wenn dir das Video gefällt :)
Ich habe mein Job gemacht und gab für diese Video LIKE. Jetzt bist du dran und bring's mir bei.
Habe mich die ganze Zeit gefragt wie das klappt ohne den geschweiften Klammern und den Semikolons bis ich gesehen habe dass es eine Sass Datei ist😂😂😂
Gutes Video!
danke :)
Super Video 👍 Perfekt Kommentiere
Danke freut mich wenn es dir gefällt :)
hallo U..Bei timeline 3:25 weshalb wird hier ein & verwendet ? Würde es nicht ausreichen .effekt: anzugeben?
jein weil das & bedeutet wenn du Class A und Class B hast dann mach etwas ohne das & wäre es wenn Class B child von Class A ist mach etwas
Würde gerne per CSS eine Postkarte animieren. Also die soll sich per links-klick horizontal an der Mittelachse drehen und dann die Rückseite zeigen. Ist das möglich?!
Moin, sehr cooles Video. Bei mir werden einige CSS Eigenschaften nicht Autovervollständigt. box-shadow z.B. fehlt da noch irgendein Plugin für VSC? LG Marco
Hmmm also ich hab eig nur ein SASS Plugin sonst nichts
@@UnleashedDesign war wohl ein Bug im VSCode. Nach einem Neustart ging alles wie gehabt. 😀
Vielen Dank
Freut mich wenn es dir gefällt :)
SUPER DUPA MEGA NICEEEE > Wann kommt deine neue Seite endlich ? :(
Das dauert noch xD Inhalte fehlen :D
Mega Video! Klasse kurz und Knapp
wie ist .element::after .... &.effekt:hover...&::after in CSS??? ich habe mehrere Variante versucht, leider ohne Erfolg. Vielen Dank.
.element::after {} sollte funktionieren oder .element .effekt:hover {}
@@UnleashedDesign .element.effekt:hover {}
Gut, das Video ist von 2019, jetzt haben wir 2023. Dennoch, der Code wie auch Codepen ist nicht verlinkt. Codepen habe ich selber aber den Code als Ganzes zu sehen, wäre auch nach dieser Zeit echt nice gewesen...
Bei 68k Aufrufe nur 3k "Daumen hoch" ist schlichtweg eine Sauerei. Du versprichst etwas - du hältst es (du wirst niemals Politiker werden) und es sind Sachen, die jeder in einer Website realisieren kann und auch sollte.
Hallo,
gibt es auch eine gute Möglichkeit die erstellen Elemente zu sortieren? Beispielsweise, wenn man vier solcher Divs mit unterschiedlichen H2 (Element, Text, Button, Container) hat und diese nach dem H2 alphabetisch sortieren möchte?
Viele Grüße
Wenn dann mit JS :) du könntest alle Elemente in einem Array haben und dieses Array dann nach dem innerhtml sortieren und darauf die Elemente nacheinander dem DOM hinzufügen.
that was awesome brother . i like that
Hi blöde frage: wueso hast du keine css datei sondern eine sass?
Weil SASS quasi nach einem Compiling zu einer css wird :) jedoch viele Vorteile beim Schreiben bietet wie das nutzen von Variablen, vererbung usw.
@@UnleashedDesign ich hab die vorletzte und letzt animation nicht geschafft, weil ich nicht wusste, wie ich keyframes im detail schreiben soll :/
wofür wird das Code ( translate) benutzt?
Wie kann man dieses Vorschaukästchen am rechten Rand einfügen?
Das ist einfach nur mein Browser den ich im Video abschneide :D also wirklich einfach nur ein 1:1 Browserfenster klein gezogen.
@@UnleashedDesign okay Dankeschön aber der Code funktioniert bei mir leider trotzdem nicht ☹️
Sind das jez Effekte in sass oder css
Bzw kann ich die in ein css Script so schreiben?
Theoretisch ja, du müsstest entweder einen Formatter nutzen der dir aus sass einfach css generiert oder aber die fehlenden Zeichen manuell hinzufügen :)
warum gehen bei mir die farben nicht? also zb das $white usw funktioniert nicht?
Kann es sein das du die Farben nicht als dass Variable definiert hast ?
Wie macht man dass es sich animiert bei mir springt es vom einen auf den anderen?
mit animation und dann 0 % 25 50 75 100 % dann sollte es wesentlich smoother sein falls du überhaupt noch die frage hast
Welchen Editor benutzt du?
Ich nutze VSC :)
✅
Cooles Video für Einsteiger 👌🏻 allerdings sollte das width oder das height Attribut niemals animiert werden, wenn es sich im allgemeinen um ein grösseres Projekt handelt. Das ist extrem schlecht für die Performance.
Dann lieber dem Parent Element einen overflow: hidden geben und das ::after Element mit css „transform“ nach rechts bewegen.
die uhr ist sehr laut. sonst super
Ja das habe ich mir aufgeschreiben :P das nächste mal wird es die nicht mehr geben :D
Dieser Struggle alles in einer Minute zu schaffen xD
jap :D du glaubst nicht wie viele Versuche ich brauchte :D
dictionary.cambridge.org/de/aussprache/englisch/hover
viel erfolg! die tipps sonst super. like is raus, abo auch!
xD das ist der Grund warum meine VIdeos nicht in Englisch sind haha. Vielen Dank :)
Nicee
In Codepen funktioniert Codebeispiel 3 nicht, es verzieht die Seite nach unten links, nur noch das Wort ist da und die weiße Box weg.
Habe bei der HTML und bei der Sass datei genau das wie du hast eingegeben, aber wen ich die seite lade passiert steht nur elements da, es kommt aber keine animation oder so
ist bei mir genau so
Great video but that clock ticking is so annoying.
hallo
kannst du mir eine kurze video über css Twenty Seventeen Wordpress Hintergrundbild einfügen und Speichen usw machen besten dank du kannst auch mir per wahtapp video senden
besten Dank für deine Bemühung
Wo ist der Code man?
Ich würde sagen in der Beschreibung unter "Live Demo" ? ;)
Warum alles so schnell, gibt es dafür einen Grund?
Hallo, weil es in diesem Video der Catch war das es 7 Animationen in je 1 Minute sind :) andere Videos sind etwas langsamer
Wieso benutzt du keine {, } und ; ? :o
Das ist kein css und auch kein scss. Das ist sass.
Der schummelt doch und lässt das video schneller laufen 😁
nope :D 1:1 original Speed :)
Titel etwas falsch gewählt für Anfänger aber sonst super video👍🏼
inwiefern? Der Titel beschreibt perfekt das Video.
to hover [/ˈhʌvər/] 😜
Du sagst css machst aber sass
die klickende uhr nervt mega!
Hi,
Hi
Hi
hi
@@UnleashedDesign bist du auch telefonisch erreichbar?
8:13
??
Ich bin immer noch kein Fan davon, die Schriftgröße beim body auf 10px zu setzen, da Browser nicht umsonst die Schriftgröße von 16px vorgeben und es nur verwirren würde, wenn etwas mit rem auf 32px gebracht werden soll, 2rem aber dann 20px sind. 16px sind einheitlich bei allen Browsern und dies zu überschreiben nur weil man dann einfacher "rechnen" kann ist für mich kein Vorteil sondern einfach Faulheit und kann unnötig für Verwirrung sorgen.
das ist kein tutorial-----allenfalls ein Hopp Demo ...wo ist da ein lerneffect ???
Hmm, also finde eigentlich schon das man etwas lernt, es ist kein Absolute Basics Video da es nicht nur 1. Punkt hat, sondern mehr eine Inspiration für verschiedene kleine mini Effekte.