audio Playlist: ▼

.mp3/wav:

► Dr.Hook "Sylvias mother"

► Dire Straits "Sultans ..."

► James Last "Biscaya"

0 Mitglieder und 2 G�ste sind derzeit online:
(Als registrierter User sieht man hier nat�rlich etwas mehr.)
Sei dabei! Es macht Spa�, kostet nix und tut �berhaupt nicht weh !

03.02.2019 01:351549154124
cirrus minor hat das Thema Soundeffekt bei Bild-Mouseover erstellt.
19.01.2019 19:101547921434
cirrus minor hat das Thema Gruppen über DropDown Menüs verwalten erstellt.

2 Aktive User
0 Mitglieder und 2 G�ste sind Online

Besucherrekord
100 Benutzer gleichzeitig online (13.06.2024 02:29)

Besucherz�hler
Heute waren 7 G�ste , gestern 74 G�ste online

auch hier! -->> ...unsere Facebookseite besuchen.

Foreninformationen:

Forenthemen	47
Textbeitr�ge	2352
Mitglieder	5
Neuestes Mitglied

Letzte Foren-Beitr�ge:

HTML,CSS & Co. leicht gemacht f�r Einsteiger �

CSS ... kein Hexenwerk !

� Elemente stylen per CSS � �� Effekte �ber keyframes per CSS hinzuf�gen
� CSS keyframes (Beipiel)

Seite 3 von 4 � Seite 1 2 3 4 Seite �

Themen-Einstellungen

Thema drucken

Bereich wechseln

CSS ... kein Hexenwerk ! CSS allgemein Schriften stylen per CSS Elemente stylen per CSS � Fragen zur Auswahl von Elementen (Selektoren) � � hover Effekte �ber CSS hinzuf�gen �� Effekte �ber keyframes per CSS hinzuf�gen HTML ... mit kleinen Dingen anfangen HTML Seite, Aufbau, Einbindungen, Meta Tags usw. Java-Script ... im Anf�ngermodus Gro�e Ver�nderungen mit kleinen, einfachen Scripten herbeif�hren Xobor - Foren - Hilfe administrative Einstellungen der Xobor Software Einbindungen von Codes und Scripten in die Xobor Software "User - Ecke" "G�ste - Stube" G�ste schreiben uns, Mitglieder antworten

#31 | RE: CSS keyframes (Beipiel) datum

09.05.2018 00:40

Es funktioniert ja nun erstmal �ber den Forencode, in den man einen Smileylink einsetzen kann. An einer anderen L�sung arbeite ich noch.

... wer andern eine Grube gräbt, ist selbst der Grubengräber ! :-)

MfG, Admin

antworten

#32 | RE: CSS keyframes (Beipiel) datum

09.05.2018 00:42

Natürlich, das ist toll! Und bitte nehme es jetzt nicht wörtlich, wenn's nicht geht, kann ich auch damit leben...

antworten

#33 | RE: CSS keyframes (Beipiel) datum

09.05.2018 00:50

aber mit den drehenden Smileys kommst schon ganz gut zurecht, wie ich sehe !

... wer andern eine Grube gräbt, ist selbst der Grubengräber ! :-)

MfG, Admin

antworten

#34 | RE: CSS keyframes (Beipiel) datum

09.05.2018 00:56 (zuletzt bearbeitet: 09.05.2018 10:34)

Jeanie

Informationen anzeigen

Beitr�ge:	1439
Registriert seit:	14.04.2018
Wohnort:	NRW

Ja und man kann ja wahllos mehrere Smilies einf�gen, habe ich bei mir im Forum gerade in einem Beitrag gemacht
oder auch dieselben, wie man m�chte!

1
 
[smileydreh]...[/smileydreh]

und das dann �fter, dazwischen die Links!

antworten

#35 | RE: CSS keyframes (Beipiel) datum

09.05.2018 20:22 (zuletzt bearbeitet: 09.05.2018 20:41)

Eine Beschreibung zum Einbau eines selbst definierbaren Smileymen�s mit "Drehfunktion" gibt es hier: -->> Drehende Smileys per Iconbar

... wer andern eine Grube gräbt, ist selbst der Grubengräber ! :-)

MfG, Admin

antworten

#36 | RE: CSS keyframes (Beipiel) datum

13.05.2018 20:36

Ich habe mir mal einen Text erstellt und bei mir in einem Beitrag drehen lassen, so sieht's aus!

antworten

#37 | RE: CSS keyframes (Beipiel) datum

13.05.2018 20:56

Ja, ist doch gut.oder ???

... wer andern eine Grube gräbt, ist selbst der Grubengräber ! :-)

MfG, Admin

antworten

#38 | RE: CSS keyframes (Beipiel) datum

13.05.2018 21:05 (zuletzt bearbeitet: 13.05.2018 21:06)

Ja, gefällt mir! Ich kann mir ja auch andere Dinge wie zum Beispiel Schilder mit Text oder irgendwas anderes erstellen und drehen lassen,
aber wie man sowas dann von rechts nach links oder umgekehrt bewegen könnte, wie Du das in dem Beispiel gemacht hast,
ist sicherlich komplizierter, oder?

antworten

#39 | RE: CSS keyframes (Beipiel) datum

13.05.2018 21:25

Du meinst den neuen Beitrag mit der Positionsver�nderung ?

... wer andern eine Grube gräbt, ist selbst der Grubengräber ! :-)

MfG, Admin

antworten

#40 | RE: CSS keyframes (Beipiel) datum

13.05.2018 21:30 (zuletzt bearbeitet: 13.05.2018 21:36)

Ja genau! Müsste man einen neuen css Eintrag vornehmen und dann den Forencode erstellen, danach die Gruppe und zum Schluß noch einen html Eintrag einfügen, so wie bei den drehenden Smilies?

antworten

#41 | RE: CSS keyframes (Beipiel) datum

13.05.2018 21:45

Wenn man das in der Iconbar verwenden m�chte, m�sste man im Prinzip �hnlich vorgehen. Oder man pickt sich einfach ein Element heraus, wie ich grad zum Test mal bei den Avataren der Beitr�ge gemacht habe.

... wer andern eine Grube gräbt, ist selbst der Grubengräber ! :-)

MfG, Admin

antworten

#42 | RE: CSS keyframes (Beipiel) datum

13.05.2018 21:58 (zuletzt bearbeitet: 13.05.2018 21:59)

Mit den Avataren ist der Hammer! Das gefällt mir besonders gut! Und wie müsste man da genau vorgehen? Aber dann ist manchmal der Anfang vom Text verdeckt oder könnte man das auch noch einstellen, dass das Ava nicht ganz so weit rüberrutscht?
edit: Ich habe gerade festgestellt, dass es nach dem Absenden nicht mehr so ist, also das wäre der Knüller...

antworten

#43 | RE: CSS keyframes (Beipiel) datum

13.05.2018 22:02

Das Avatar sollte eigentlich hinter dem Text verschwinden ?

... wer andern eine Grube gräbt, ist selbst der Grubengräber ! :-)

MfG, Admin

antworten

#44 | RE: CSS keyframes (Beipiel) datum

13.05.2018 22:12

Ja, jetzt ist es so, ich hatte meinen vorherigen Beitrag nochmal editiert! Und beim schreiben ist auch alles soweit ok! Nur bei der Vorschau rutscht das Ava über den Text, doch das ist ja nicht so wichtig, denn nach dem Absenden passt es! Und was müsste
man nun machen, um es hinzubekommen? Braucht man dafür einen css Eintrag?

antworten

#45 | RE: CSS keyframes (Beipiel) datum

13.05.2018 22:21 (zuletzt bearbeitet: 13.05.2018 22:21)

cirrus minor

Informationen anzeigen

Beitr�ge:	1193
Punkte:	426
Registriert seit:	10.04.2018

Mit diesem CSS Eintrag sollte es eigentlich wie hier gezeigt funktionieren:

1
2
3
4
5
6
7
8
9
10
11
 
@keyframes testmove {
    0%   {top: 0px; left: 0px; background: red;}
    25%  {top: 0px; left: 100px; background: blue;}
    50%  {top: 50px; left: 0px; background: green;}
    75%  {top: 50px; left: 100px; background: yellow; color: black}
    100% {top: 0px; left: 0px; background: red;}
}
.messageAvatar {position: relative;
    animation: testmove 5s infinite;
    animation-timing-function:ease-in-out;
}
 