| Autor | Zpráva | ||
|---|---|---|---|
| quatzael Profil |
#1 · Zasláno: 4. 3. 2014, 14:24:03
Existuje nějaká efektivní metoda jak z jednotlivých obrázků sestavit CSS SPRITE?
Jde mi o to, že už jsem začal dělat projekt s tím, že co jeden obrázek to jeden soubor. A v editoru je sice mám někde uložený vektorově, ale mezi tisíci dalšími drafty, takže je už těžký pro mě všechno spolehlivě dohledat. Každopádně mám ty obrázky vyexportovaný jako formát .png. A to co bych potřeboval je nějak všechny nahrát do nějakýho editoru, který by je nějak seskupil vedle/pod sebe, případně abych já si je tam mohl nějak sám setřídit. A nejlepší by bylo, kdyby i ukazoval aktuální polohu každýho jednotlivýho obrázku, abych to do CSS mohl jenom přepsat a nemusel to dopočítávat. Důležitý je, aby takto vyexportovaný soubor zachoval původní kvalitu obrázku a nijak je nepřeformátovával. Zkoušel jsem to v inkscapu a nejsem si moc jistej jestli zachovává obrázky tak jak původně byly.. |
||
| Bubák Profil |
#2 · Zasláno: 4. 3. 2014, 14:49:52
quatzael:
„Zkoušel jsem to v inkscapu a nejsem si moc jistej jestli zachovává obrázky tak jak původně byly..“ Neměl jsem s tím problém. Jako nastavení rozměrů jsem dal pixely a pozice pro bitmapy jsem zadával vždy jako celé číslo. Kdybych měl třeba v bitmapovém obrázku 1 px čáru, pokud ji vložím na celočíselnou pozici, zůstane ostrá po exportu do PNG ostrá. Ale pokud bych ji o půlpixel posunul (což ve vektorovém editiru je možné), pravděpodobně bych po exportu dostal 2px širokou 50% šedou čáru, "rozmazaninu". |
||
| nemeja Profil |
#3 · Zasláno: 4. 3. 2014, 14:57:22
Strawberry o tom psal na jecas.cz, je tam i služba, která ti projede současný stránky a uloží ikonky do spritu. Samozřejmě tam je i generátor spritu z více obrázků, což by jsi využil nejspíš ty :-)
|
||
| quatzael Profil |
nemeja:
Díky, to je zhruba co jsem potřeboval. I když jsem spíš chtěl použít přímo nějakej editor, abych si mohl sestavit sprite sám přehledněji, dát si související obrázky vedle sebe apod.. Zkoušel jsem ten script co napsal Strawberry a nějak mi nefunguje to načítání CSS souboru. Má tam tenhle řádek: <link rel="stylesheet" href="./css-sprite.php"> Index jsem si dal do složky sprite a v ní mám složku png s tím css souborem a obrázkama. Takže to mám takhle: <link rel="stylesheet" href="./sprite/png/css-sprite.php"> nemeja: Každopádně mi to teda píše: Warning: Invalid argument supplied for foreach() in ... on line 14 Takže přepokládám, že je to tím, že se nenačetlo to CSS.. |
||
| Bubák Profil |
#5 · Zasláno: 5. 3. 2014, 11:43:59
quatzael:
„Vůbec ani nechápu co tam dělá ta tečka před tím lomítkem.“ Tečka je aktuální adresář, takže s touto nápovědou byl měl odhalit, co zápis ./ znamená.
„nějak mi nefunguje to načítání CSS souboru“ Chybná cesta k CSS souboru, používej takové zápisy cesty k souborům, které ti vyhovují, není nutné kopčit vše do posledního detailu. |
||
| quatzael Profil |
#6 · Zasláno: 5. 3. 2014, 11:52:32
Bubák:
Tak by mi ale mělo potom fungovat tohle: <link rel="stylesheet" href="./png/css-sprite.php"> |
||
| anonymníí Profil * |
#7 · Zasláno: 5. 3. 2014, 11:54:07
quatzael:
Takže nepotřebuješ vyrobit sprite (ten si ccheš udělat sám), ale pouze hromadně narvat obrázky do editoru? Photoshop (a jistě i mnohé další) umožňují vložení vícerých souborů do jednoho "plátna", prostým přetaženýím označených souborů z, třeba, totalcomanderu. |
||
| quatzael Profil |
#8 · Zasláno: 5. 3. 2014, 11:58:39 · Upravil/a: quatzael
Bubák:
Tak jsem to dal všechno do jedný složky a spustilo se mi to. Objevila se stránka s jednotlivými obrázky a elementy, ale žádný sprite.png se mi nevygeneroval.. anonymníí: No to asi bude lepší řešení.. Ale budu to muset udělat opravdu až na konci celýho projektu, protože bych to asi nesčetněkrát zase předělával... anonymníí: Já bych docela rád kdyby to šlo v tom inkscapu. Importovaný obrázky se sice trochu rozmažou v tom inkscapu, ale pak se zřejmě vyexportujou zpátky zase jako původní. Jen nevím jak lze do inkscapu hromadně vložit víc obrázků.. Shiftem to označit všechno nejde.. |
||
|
Časová prodleva: 10 let
|
|||
0