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ě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.
Jde o CSS sprite.
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.
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ůvodně odeslal Krupajz
---------- Příspěvek doplněn 15.06.2014 v 14:17 ----------
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.
