Diskuze: keyframe

Naučíme tě pracovat na home-office.

Zjistit více...

Aktivity

saeQ

Člen

saeQ:1.11.2014 18:07

ahoj , snazim sa spravit automaticky slider pomocou css avsak mam problem s keyframe
http://jsfiddle.net/ocdhjvqq/2/

v keyframe mam nadstavene

@-webkit-keyframes slide {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -800px;
 }

}

avsak animacia ide len do -100px a potom sa zastavi , poradi mi dakto ?

Editováno 1.11.2014 18:08

Odpovědět

1.11.2014 18:07

Neaktivní uživatel

Tvůrce

Neaktivní uživatel:1.11.2014 18:19

Řádek

-webkit-animation: slide 10s  infinite;

který jsi přiřadil selektoru #k by jsi měl přiřadit elementu #two, neboť chceš hýbat s celou skupinou, ne jen s jedním čtverečkem...

Nahoru Odpovědět

1.11.2014 18:19

Neaktivní uživatelský účet

saeQ

Člen

saeQ:1.11.2014 18:22

ked to pridam do #two tak sa hybe cely div a nie len jeho obsah , ked to pridam do #k tak sa hybe len obsah , avsak animacia sa zastavi pri
margin-left:-100px a nie pri margin-left:-800px;

Nahoru Odpovědět

1.11.2014 18:22

Uživatel sítě

Tvůrce

Uživatel sítě :1.11.2014 18:29

Ano, protože ty pohneš pouze s #k, ale ostatní selektory protože jsou navzájem obtékání se pohnou taktéž.

Nahoru Odpovědět

1.11.2014 18:29

Chybami se člověk učí, běžte se učit jinam!

saeQ

Člen

saeQ:1.11.2014 18:35

no ved , ale problem je v tom ze sa animacia skonci skorej nez je zadefinovane ,

Nahoru Odpovědět

1.11.2014 18:35

Neaktivní uživatel

Tvůrce

Neaktivní uživatel:1.11.2014 19:00

Ona stále pokračuje správně, jen ty to okem nevidíš, neboť pohybuješ pouze elementem k, který po 100px "přejede přes svůj začátek" a ostatní elementy, se kterými nehýbáš ti zůstanou stát na místě..

Zkus je všechny obalit do divu a pohybovat s tím divem, neboť pohybem jednoho elementu těžko rozpohybuješ všechny tak jak by jsi chtěl...

Nahoru Odpovědět

1.11.2014 19:00

Neaktivní uživatelský účet

saeQ

Člen

saeQ:1.11.2014 19:03

tak potom preco ked sa prvy krat k posunie dozadu o 100px , posunu sa vsetky elementy?

Nahoru Odpovědět

1.11.2014 19:03

Neaktivní uživatel

Tvůrce

Neaktivní uživatel:1.11.2014 19:09

To přesně nevím, zřejmě to bude tím, že samovolně se ti elementy nepřesunou před začátek rodičovského elementu.

Nahoru Odpovědět

1.11.2014 19:09

Neaktivní uživatelský účet

Uživatel sítě

Tvůrce

Uživatel sítě :1.11.2014 19:11

Protože přikážeš pouze jednomu selektoru jít do mínusu, ostatní se zastaví o hranici šířky selektoru two.

Nahoru Odpovědět

1.11.2014 19:11

Chybami se člověk učí, běžte se učit jinam!

saeQ

Člen

saeQ:1.11.2014 19:27

http://designshack.net/…photobanner/ robim to podla tohoto kde ma tiez zadefinovanu len jednu animaciu do zaporu a funguje to

Nahoru Odpovědět

1.11.2014 19:27

Uživatel sítě

Tvůrce

Uživatel sítě :1.11.2014 19:48

Ok na demu příkladu z té stránky to mají na celém elementu ve kterém jsou ty obrázky tudíž:

-webkit-animation: slide 10s  infinite;

přepiš na

-webkit-animation: slide 10s linear infinite;

Dále to smaž z #k a dej to k #two.

A v poslední řadě změň pozici v animaci margin-left: -550px; na více dle počtů elementů v obsahu.
Ber v potaz i okraje elementů 1px na každé straně. Takže si odečti třeba 10 px z pozice do - leva, pokud budeš mít 5, atd..

Akceptované řešení
+20 Zkušeností

Nahoru Odpovědět

1.11.2014 19:48

Chybami se člověk učí, běžte se učit jinam!

saeQ

Člen

saeQ:1.11.2014 20:51

Dik , uz to funguje , ale v tom demu maju animaciu na prvom obrazku a nie na celom elemente v ktorom su obrazky

Nahoru Odpovědět

1.11.2014 20:51

Uživatel sítě

Tvůrce

Uživatel sítě :1.11.2014 21:25

A jo a funguje to myslím si tím, že se navzájem neobtékají..

Nahoru Odpovědět

1.11.2014 21:25

Chybami se člověk učí, běžte se učit jinam!

Neaktivní uživatel

Tvůrce

Neaktivní uživatel:1.11.2014 22:57

Obdobně jsem ti odpověděl hned na začátku

Nahoru Odpovědět

1.11.2014 22:57

Neaktivní uživatelský účet

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 14 zpráv z 14.