logo
19.05.2014 16:46
1
Zdravím, chtěl bych se zeptat jak fungují obrázky které se po najetí myši mění mezi s sebou, ale jsou přitom jako jeden ?

viz.:
Název:  exitt.png
Zobrazení: 278
Velikost:  6,7 KB

Nějak to prostě nechápu.

Ale hlavní otázka zní, v jakém programu tyto obrázky upravovat ?

Jasně, jdou nahradit jinýma, ale málokdy se mi podaří trefit stejný roviny a pak to na stránkách skáče.

Předpokládám že se tato varianta používá k ušetření dat.
19.05.2014 16:56
2
Jde o CSS sprite.
19.05.2014 17:15
4
JavaScript to není, ten používám běžně http://www.klikzone.cz/javascript/uk...ajeti-mysi.php

Tyhle obrázky jsou na jiném principu právě...

Nejspíš tedy jde o CSS sprite, díky, to bude asi ono :) jdu to tedy nastudovat.
19.05.2014 17:18
5
Já používám v css img:hover{background-position......}
15.06.2014 14:08
6
Původně odeslal Krupajz
Já používám v css img:hover{background-position......}
Asi tak, prostě jen se posune pozice x nebo y, případně obě. A nemusí to být jen při událostech, klidně může být několik obrázků, hlavně třeba ikony, v jednom a jen se posunuje základní poloha pomocí css.

---------- Příspěvek doplněn 15.06.2014 v 14:17 ----------

Původně odeslal orda.cz
Zdravím, chtěl bych se zeptat jak fungují obrázky které se po najetí myši mění mezi s sebou, ale jsou přitom jako jeden ?

viz.:
Příloha 11376

Nějak to prostě nechápu.

Ale hlavní otázka zní, v jakém programu tyto obrázky upravovat ?

Jasně, jdou nahradit jinýma, ale málokdy se mi podaří trefit stejný roviny a pak to na stránkách skáče.

Předpokládám že se tato varianta používá k ušetření dat.

Hlavně musíš udržet přesné rozměry a polohy, například ta X: Jedno samotné je např. obrázek 50 na 50px. Obas pojené jsou 50px šířka, 100px výška. To musí být zachováno i když tam budeš chtít dát jiný obrázek, třeba s Y. A samozřejmě musíš pohlídat jednak velikost toho písmenka a také jeho přesnou polohu v obrázku, např. 3px od odkraje, jinak to bude právě poskakovat.

Je to hlavně kvůli úspoře místa a času, takhle se načte jen jeden obrázek ( může mít třeba 100 ikon - onrázků) a ten se pak poziciováním pomocí css přesně usadí. Pak při například události hover, se už nemusí čekat a načítat další obrázek, ale jen se ten obrázek posune, viz výše 100 x 50px o 50% nahoru nebo dolů, případně vodorovného uspořádnání do stran, dle potřeby, případně oboje, jeli-li to multikomplet, například 4 obrázky - 2nad sebnou, 2vedle sebe atp.