weitere Rubriken
PhilosophieTräumeOrteEsoterikLiteraturAstronomieHelpdeskGruppenSpieleGamingFilmeMusikClashVerbesserungenAllmysteryWillkommenEnglishGelöscht
Diskussions-Übersichten
BesuchtTeilgenommenAlleNeueGeschlossenLesenswertSchlüsselwörter
Schiebe oft benutzte Tabs in die Navigationsleiste (zurücksetzen).

Do it yourself: CSS für Profil und Blog

6.253 Beiträge, Schlüsselwörter: Allmystery, Hilfe, Welt, Bilder, Frieden, Profil, Farbe, Design, Html, Schrift, DIE + 18 weitere
----
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 20:33
@du_selbst

Nimm direkt das hier::)

PS: Habs nochmal korrigiert.



a:hover {
animation-name:myfirst;
animation-duration:2s;
animation-timing-function:linear;
animation-delay:2s;
animation-iteration-count:infinite;
animation-direction:alternate;
animation-play-state:running;

-moz-animation-name:myfirst;
-moz-animation-duration:2s;
-moz-animation-timing-function:linear;
-moz-animation-delay:2s;
-moz-animation-iteration-count:infinite;
-moz-animation-direction:alternate;
-moz-animation-play-state:running;

-webkit-animation-name:myfirst;
-webkit-animation-duration:2s;
-webkit-animation-timing-function:linear;
-webkit-animation-delay:2s;
-webkit-animation-iteration-count:infinite;
-webkit-animation-direction:alternate;
-webkit-animation-play-state:running;

-o-animation-name:myfirst;
-o-animation-duration:2s;
-o-animation-timing-function:linear;
-o-animation-delay:2s;
-o-animation-iteration-count:infinite;
-o-animation-direction:alternate;
-o-animation-play-state:running;

-ms-animation-name:myfirst;
-ms-animation-duration:2s;
-ms-animation-timing-function:linear;
-ms-animation-delay:2s;
-ms-animation-iteration-count:infinite;
-ms-animation-direction:alternate;
-ms-animation-play-state:running;

}


@-moz-keyframes myfirst
{
0% {-moz-transform: scale(1, 1)}
25% {-moz-transform: scale(1, 0.5)}
50% {-moz-transform: scale(1, 0)}
75% {-moz-transform: scale(1, -0.5)}
100% {-moz-transform: scale(1, -1)}
}

@-webkit-keyframes myfirst
{
0% {-webkit-transform: scale(1, 1)}
25% {-webkit-transform: scale(1, 0.5)}
50% {-webkit-transform: scale(1, 0)}
75% {-webkit-transform: scale(1, -0.5)}
100% {-webkit-transform: scale(1, -1)}
}

@-o-keyframes myfirst
{
0% {-o-transform: scale(1, 1)}
25% {-o-transform: scale(1, 0.5)}
50% {-o-transform: scale(1, 0)}
75% {-o-transform: scale(1, -0.5)}
100% {-o-transform: scale(1, -1)}
}

@-ms-keyframes myfirst
{
0% {-ms-transform: scale(1, 1)}
25% {-ms-transform: scale(1, 0.5)}
50% {-ms-transform: scale(1, 0)}
75% {-ms-transform: scale(1, -0.5)}
100% {-ms-transform: scale(1, -1)}
}

@keyframes myfirst
{
0% {transform: scale(1, 1)}
25% {transform: scale(1, 0.5)}
50% {transform: scale(1, 0)}
75% {transform: scale(1, -0.5)}
100% {transform: scale(1, -1)}
}


melden
Anzeige
----
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 20:34
Sowas lernt man nicht. Es ist einfach irgendwann plötzlich da.


melden
----
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 20:45
setz animation-delay auf 0


melden
du_selbst
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 20:47
okay, =) ja ich hab alles doppelt und dreifach xD mom



@Dr.BT




.a:hover {

-webkit-transition:All 1.2306s linear;
-moz-transition:All 1.2306s linear;
-o-transition:All 1.2306s linear;
-webkit-transform: rotate(-4deg) scale(1) skew(-5deg) translate(0px);
-moz-transform: rotate(-4deg) scale(1) skew(-5deg) translate(0px);
-o-transform: rotate(-4deg) scale(1) skew(-5deg) translate(0px); }


.body{background-color:#000000;}a{color:#transparent;text-decoration:none;text-align:justify;font-size:1em;}a:hover{color:#fff;}a:hover{

-webkit-transition:All 1.2306s linear;
-moz-transition:All 1.2306s linear;
-o-transition:All 1.2306s linear;
-webkit-transform: rotate(-4deg) scale(1) skew(-5deg) translate(0px);
-moz-transform: rotate(-4deg) scale(1) skew(-5deg) translate(0px);
-o-transform: rotate(-4deg) scale(1) skew(-5deg) translate(0px); }


.inactive{background:#000000;color:#888888;font-family:times;font-size:2em;font-weight:bold;text-align:justify;height:80%;width:90%;border:10px;}
.active{background:#000000;color:#333333; height:80%; width:80%; border:0px; wrap=soft}

.p{text-align:justify;padding-left:50px;padding-right:50px;}
.div{text-align:justify;padding-left:50px;padding-right:50px;}
.span class="gad-head" style="font-size:5.0em;font-weight:bold;}
</style>



.userfunction {display: none; font-size: 10px; padding-bottom: 4px; text-align: right; width: 700px;}



.profile_info {display: none;}
.profile_links
</style>



.body

.small
.header {background: none; background-color: transparent;}
img.heart {visibility: hidden;}
a.attitel
.topnav
.topnav a
chat_count
.sufu
.tabnav
.tabnav a {background: none; background-color: transparent;}
.a.a_more
.moreMenu

.main
.head_links
.head_links a
.profile_links
.profile_links a
.profile_links a img
.profile_info {display: none;}

.infoleiste {visibility: transparent;}
.mcell_status {display: none;}
.msg {visibility: hidden;}
.mcell_inhalt
.mcell_inhalt a
a.at_in
a.at
.ben_o
a.at_bold
.mcell2
.mcell_inhalt2



</style>




a, a.man, a:link, a:visited{color:#ffffff} a:active, a:hover{color:#transparent}td, table, tr, span, li, p, div, textarea, DIV {color:#ffffff; background-color:transparent} td, li, p, div, a.navbar:link{#transparent}

div.mcell, div.mcell2, div.mcell_inhalt2 {visibility:hidden;}

div.infoleiste, div.mcell_inhalt, div.header {background-color:transparent;}

div.tabnav a {background-color:transparent;}

div.userfunction, div.header, div.tabnav a {background-image:none;}

.sufu, .sufu:focus {margin-left:-10; color:#999999; background-color:#111111;}.gb_post_text img, .gb_post_text_np img { display: none; }div.gb_post_text img[src^="http://static.allmystery.de/upics/f8ab62_tod.jpg"] { display:true; }h2 { display: inline; font-size: 14px; margin-left: 100px; /* nach Bedarf verschieben */ } ul#gb_posts { display: block; list-style-position: outside; list-style-type: none; margin: 0 auto; padding: 0; width: 650px; } #gb_post_wrap { height: 90px; margin: 0 auto; position: relative; width: 650px; }

</style>







body{background-color:#000000;border:none;color:#000000;font-family:none;font-size:16px;color:#ffffff;}



.footer {display: none;}

</style>






und dann das noch lol



<body bgcolor="000000">
<link rel="stylesheet" type="text/css" href="http://nospace.ch/files/style.css">


melden
du_selbst
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 20:48
oh xD das letzte hats direkt übersetzt hihi... hab ich mir alles so bischen zusammengebastelt merkt man wahrscheinlich ;-)


melden
----
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 20:50
samal? Kauf dir ne Putzfrau.


melden
du_selbst
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 20:52
xD das war vorher noch schlimmer ;-) @Dr.BT


melden
----
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 20:56
Sorry. Abgelehnt. Bring Ordnung rein. Entfern alles unnötige, verschmelz doppelte Einträge oder lösch sie und bring Struktur rein. Dann bastel ich dir die Animation rein. So nicht.


melden
du_selbst
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 21:02
okay dokay meld mich in einer woche nochmal danke trotzdem =) @Dr.BT


melden
----
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 21:04
Das hier funktioniert. Test es und bieg es dir zurecht.
.main {
animation-name:myfirst;
animation-duration:2s;
animation-timing-function:linear;
animation-iteration-count:infinite;
animation-direction:alternate;
animation-play-state:running;

-moz-animation-name:myfirst;
-moz-animation-duration:2s;
-moz-animation-timing-function:linear;
-moz-animation-iteration-count:infinite;
-moz-animation-direction:alternate;
-moz-animation-play-state:running;

-webkit-animation-name:myfirst;
-webkit-animation-duration:2s;
-webkit-animation-timing-function:linear;
-webkit-animation-iteration-count:infinite;
-webkit-animation-direction:alternate;
-webkit-animation-play-state:running;

-o-animation-name:myfirst;
-o-animation-duration:2s;
-o-animation-timing-function:linear;
-o-animation-iteration-count:infinite;
-o-animation-direction:alternate;
-o-animation-play-state:running;

-ms-animation-name:myfirst;
-ms-animation-duration:2s;
-ms-animation-timing-function:linear;
-ms-animation-iteration-count:infinite;
-ms-animation-direction:alternate;
-ms-animation-play-state:running;

}










@-moz-keyframes myfirst
{
0% {-moz-transform: scale(1, 1)}
25% {-moz-transform: scale(1, 0.5)}
50% {-moz-transform: scale(1, 0)}
75% {-moz-transform: scale(1, -0.5)}
100% {-moz-transform: scale(1, -1)}
}

@-webkit-keyframes myfirst
{
0% {-webkit-transform: scale(1, 1)}
25% {-webkit-transform: scale(1, 0.5)}
50% {-webkit-transform: scale(1, 0)}
75% {-webkit-transform: scale(1, -0.5)}
100% {-webkit-transform: scale(1, -1)}
}

@-o-keyframes myfirst
{
0% {-o-transform: scale(1, 1)}
25% {-o-transform: scale(1, 0.5)}
50% {-o-transform: scale(1, 0)}
75% {-o-transform: scale(1, -0.5)}
100% {-o-transform: scale(1, -1)}
}

@-ms-keyframes myfirst
{
0% {-ms-transform: scale(1, 1)}
25% {-ms-transform: scale(1, 0.5)}
50% {-ms-transform: scale(1, 0)}
75% {-ms-transform: scale(1, -0.5)}
100% {-ms-transform: scale(1, -1)}
}

@keyframes myfirst
{
0% {transform: scale(1, 1)}
25% {transform: scale(1, 0.5)}
50% {transform: scale(1, 0)}
75% {transform: scale(1, -0.5)}
100% {transform: scale(1, -1)}
}


melden
du_selbst
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 21:16
@Dr.BT
da werd ich noch bischen üben müssen,


das Ding funktioniert zwar, aber verdreht oben mit unten statt links rechts, und bleibt nicht stehen,


ich werd mich mal ans aufräumen machen, und überlege nochmal was es genau sein soll.


melden
----
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 21:20
Wolltest du nicht vertikale Drehung?


melden
du_selbst
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 21:26
Spiegelschrift so wie bei mirror6 auf dem Profil und bei hover umdrehen ähnlich wie bei darkdeep auf dem profil, sone Mischung sollte es werden. @Dr.BT


melden
----
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 21:26
was ist hiermit anstelle des oberen?:
.main {
animation-name:myfirst;
animation-duration:2s;
animation-timing-function:linear;
animation-iteration-count:infinite;
animation-direction:alternate;
animation-play-state:running;

-moz-animation-name:myfirst;
-moz-animation-duration:2s;
-moz-animation-timing-function:linear;
-moz-animation-iteration-count:infinite;
-moz-animation-direction:alternate;
-moz-animation-play-state:running;

-webkit-animation-name:myfirst;
-webkit-animation-duration:2s;
-webkit-animation-timing-function:linear;
-webkit-animation-iteration-count:infinite;
-webkit-animation-direction:alternate;
-webkit-animation-play-state:running;

-o-animation-name:myfirst;
-o-animation-duration:2s;
-o-animation-timing-function:linear;
-o-animation-iteration-count:infinite;
-o-animation-direction:alternate;
-o-animation-play-state:running;

-ms-animation-name:myfirst;
-ms-animation-duration:2s;
-ms-animation-timing-function:linear;
-ms-animation-iteration-count:infinite;
-ms-animation-direction:alternate;
-ms-animation-play-state:running;

}




@-moz-keyframes myfirst
{
0% {-moz-transform: scale(1, 1)}
25% {-moz-transform: scale(0,5, 1)}
50% {-moz-transform: scale(0, 1)}
75% {-moz-transform: scale(-0,5, 1)}
100% {-moz-transform: scale(-1, -1)}
}

@-webkit-keyframes myfirst
{
0% {-webkit-transform: scale(1, 1)}
25% {-webkit-transform: scale(0,5, 1)}
50% {-webkit-transform: scale(0, 1)}
75% {-webkit-transform: scale(-0,5, 1)}
100% {-webkit-transform: scale(-1, -1)}
}

@-o-keyframes myfirst
{
0% {-o-transform: scale(1, 1)}
25% {-o-transform: scale(0,5, 1)}
50% {-o-transform: scale(0, 1)}
75% {-o-transform: scale(-0,5, 1)}
100% {-o-transform: scale(-1, -1)}
}


melden
du_selbst
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 21:31
ui es wird langsam =) das geht in die richtige richtung =) nur sollte es jetzt noch stehenbleiben ...


melden
----
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 21:33
Das hier ist strikt bei hover. Wenn das ganze am kippen ist und keinen Kontakt zum Cursor hat stoppt es da es keine "feste Animation" ist:

Spiegelschrift:

a {
-moz-transform:scale(1,-1)
-webkit-transform:scale(1,-1)
-o-transform:scale(1,-1)
-ms-transform:scale(1,-1)
transform:scale(1,-1)

-moz-transition: all 2s;
-webkit-transition: all 2s;
-o-transition: all 2s;
-ms-transition: all 2s;
transition: all 2s;
}

umdrehen bei hover innerhalb 2 sekunden:

a:hover {
-moz-transform:scale(1,1)
-webkit-transform:scale(1,1)
-o-transform:scale(1,1)
-ms-transform:scale(1,1)
transform:scale(1,1)

-moz-transition: all 2s;
-webkit-transition: all 2s;
-o-transition: all 2s;
-ms-transition: all 2s;
transition: all 2s;

}


melden
----
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 21:34
Drehen nur bei hover:

.main:hover {
animation-name:myfirst;
animation-duration:2s;
animation-timing-function:linear;
animation-iteration-count:infinite;
animation-direction:alternate;
animation-play-state:running;

-moz-animation-name:myfirst;
-moz-animation-duration:2s;
-moz-animation-timing-function:linear;
-moz-animation-iteration-count:infinite;
-moz-animation-direction:alternate;
-moz-animation-play-state:running;

-webkit-animation-name:myfirst;
-webkit-animation-duration:2s;
-webkit-animation-timing-function:linear;
-webkit-animation-iteration-count:infinite;
-webkit-animation-direction:alternate;
-webkit-animation-play-state:running;

-o-animation-name:myfirst;
-o-animation-duration:2s;
-o-animation-timing-function:linear;
-o-animation-iteration-count:infinite;
-o-animation-direction:alternate;
-o-animation-play-state:running;

-ms-animation-name:myfirst;
-ms-animation-duration:2s;
-ms-animation-timing-function:linear;
-ms-animation-iteration-count:infinite;
-ms-animation-direction:alternate;
-ms-animation-play-state:running;

}




@-moz-keyframes myfirst
{
0% {-moz-transform: scale(1, 1)}
25% {-moz-transform: scale(0,5, 1)}
50% {-moz-transform: scale(0, 1)}
75% {-moz-transform: scale(-0,5, 1)}
100% {-moz-transform: scale(-1, -1)}
}

@-webkit-keyframes myfirst
{
0% {-webkit-transform: scale(1, 1)}
25% {-webkit-transform: scale(0,5, 1)}
50% {-webkit-transform: scale(0, 1)}
75% {-webkit-transform: scale(-0,5, 1)}
100% {-webkit-transform: scale(-1, -1)}
}

@-o-keyframes myfirst
{
0% {-o-transform: scale(1, 1)}
25% {-o-transform: scale(0,5, 1)}
50% {-o-transform: scale(0, 1)}
75% {-o-transform: scale(-0,5, 1)}
100% {-o-transform: scale(-1, -1)}
}


melden
du_selbst
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 21:35
Es dreht jetzt zwar moment ich versuch noch das andere.


melden
du_selbst
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 21:38
@Dr.BT

titel drehen nur bei hover:
komisch, also der Anfang ist richtig, bis es verschwindet, aber dann sollte es weiterdrehen bis spiegelverkehrt und dann stehenbleiben ... weisst du wie ich meine?


melden
Anzeige
----
ehemaliges Mitglied

Lesezeichen setzen

Do it yourself: CSS für Profil und Blog

22.07.2012 um 21:38
Warte.


melden
230 Mitglieder anwesend
Konto erstellen
Allmystery Newsletter
Alle zwei Wochen
die beliebtesten
Diskussionen per E-Mail.

Themenverwandt
Anzeigen ausblenden