Skitter – JavaScript, AJAX, jQuery – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu
Reklama

Skitter – JavaScript, AJAX, jQuery – Fórum – Programujte.comSkitter – JavaScript, AJAX, jQuery – Fórum – Programujte.com

 
Hledat
Moderní platforma pro vytvoření vašeho nového webu – Wix.com.
Nyní už můžete mít web zdarma.
Vybavení pro Laser Game
Spuštěn Filmový magazín
Laser Game Brno

Toto vlákno bylo označeno za vyřešené.
Poohlížíte se po nové práci? Programátor
Sefiros0
Návštěvník
1. 9. 2013   #1
-
0
-

Hoj,

na netu jsem našel knihovnu skitter.js která dělá opravdu pěkné animace s obrázky. Nepřišel jsem však na to jak to dělá. Pokud vím tak DOM nenabízí žádné API k manipulaci s obrázky. Používá snad tato knihovna canvas (tam už jde přistupovat k hodnotám jednotlivých pixelů)? Použití canvasu se mi však nezdá neb není ještě 100% kompatibilita se všemi prohlížeči (možná - nevím jistě tak mne neberte za slovo). 

Nahlásit jako SPAM
IP: 80.188.252.–
peter
~ Anonymní uživatel
3462 příspěvků
3. 9. 2013   #2
-
0
-

link, odkaz = kod; kod zadny, nic ke zkoumani neni k dispozici, tedy problem vyresen. Prispevek je pouze oznameni, ze jsi nic nenasel v necem, co mas kdesi u sebe na disku..Auto ve tve garazi ti mechanik ve sve dilne asi tezko muze prozkoumat.

JS DOM manipulace s obrazky nema. JS tez ne. Vsechno delaji bud css filtry nebo js knihovny.

http://www.skitter-slider.net/documentation
Podle dokumentace a ze jsem musel link pracne hledat googlem (asi 2s), je to postavene na pravdepodobne jquery.
Jquery ma veci obvykle vyresene crossbrowser-ove.
Podle kodu na uvodni strance

	<script type="text/javascript" src="/js/jquery-1.8.1.min.js"></script>
	<script type="text/javascript" src="/js/history.js"></script>
	<script type="text/javascript" src="/js/history.adapter.jquery.js"></script>
	<script type="text/javascript" src="/js/jquery.easing.1.3.js"></script>
	<script type="text/javascript" src="/js/jquery.animate-colors-min.js"></script>
	
	<script type="text/javascript" src="/js/jquery.skitter.min.js"></script>

je videt, ze to pouziva jquery, plugin easing s transitnimi efekty, krivky prechodu. Pak tam je plugin na animaci css barev http://www.bitstorm.org/…r-animation/. A pak samotny skitter, ktery asi resi komplet galerii.
V download na google tam maji i dalsi furu js, ale ten se asi nepouziva http://code.google.com/…wnloads/list .
Nenasel jsem kod neminimalizovany.
Minifikovany kod, kdyz pretahnu do pspad, kliknu menu html - preformatovat strukturovany css a pustim vyhledavani canvas, tak mi slovo canvas nenajde. Dole je seznam slov pro minifikaci.

Takze, jestli to spravne chapu, tak to vyuziva ciste manipulaci s html objekty, s canvasem by to pracovat nemelo. Smutne je, ze to potrebuje 150k kodu jquery :) Na http://slayeroffice.com/ bys nasel animacek, ktere jsou jen v js / js-dom. Ja mam zas takovy pokus taky s pluginem easing, ktery ma asi 15k kodu a je bez jquery.
http://peter-mlich.wz.cz/…slide-pp.htm
 

Nahlásit jako SPAM
IP: 193.84.207.–
Sefiros0
Návštěvník
7. 9. 2013   #3
-
0
-

díky za odpověď, kód knihovny jsem sem nechtěl strkat. Ptal jsem se proto že jsem přemýšlel jakým způsobem rozsekali ty obrázky. Teď už je mi to víceméně jasné. Stejný obrázek v tuně divů se skrytým přeteklým obsahem, jen pokaždé jinak umístěný. 

Nahlásit jako SPAM
IP: 80.188.252.–
Zjistit počet nových příspěvků

Přidej příspěvek

Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!

Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 9 hostů

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032019 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý