152263 cazuri COVID-19 în Moldova
7060 – cazuri active
141975 – cazuri vindecate
3228 – cazuri fatale
Actualizarea datelor: 16 ianuarie 2021 ora 16:22


Rollover - Cum să schimbi o imagine (CSS)

La elaborarea site-urilor de multe ori ne punem în faţă probleme cu navigarea, ce fel de navigare foloseşti cum lucrează, va plăcea clientului / utilizatorului?

Rollover (roll over) din engleză s-ar traduce “a rota peste”, în design acest termen se foloseşte atunci cînd o imagine se schimbă cu alta cînd trecem cursorul peste.

Pentru a implimenta rollover se pot utiliza metode diferite, mai ales în JavaScript, însă dacă utilizatorul nu are activat acest limbah în browser ce se întîmplă? De aceea în ultimii ani rollover a trecut înspre CSS, mult mai operativ, mai eficient şi mai bun :)


Exemplul I

a.imagerollover1 {
display: block;
width: 200px;
height: 100px;
background-image: url(off.gif);
background-repeat: no-repeat;
}

a.imagerollover1:hover {
background-image: url(on.gif);
}

şi inserăm în documentul nostru .html

<a class=”imagerollover1″ href=”#”></a>

Exemplul II

a.imagerollover2 {
display: block;
width: 200px;
height: 100px;
text-decoration: none;
background: url("onoff.gif");
}

a.imagerollover2:hover {
background-position: -200px 0;
}

şi inserăm în documentul nostru .html

<a class=”imagerollover1″ href=”#”></a>

Exemplele le putem vedea aici.


Sursa
2009-02-28 14:09:15



Comenteaza





Ultimele 25 posturi adăugate

18:40:02Sfântul Cuvios Octavian de Volterra —» VIAŢA DE FAMILIE
16:28:30New Theme: Twenty Twenty One —» costica
15:47:49Moldova Curată: lista moldovenilor curați & Igor Șarov —» Gheorghe Erizanu
09:40:29Politica externă “cu ochii închiși” a Moldovei? —» Dionis Cenuşa
09:25:57“Terorism” moldovenesc în SUA. Atacul asupra Capitoliului —» Cojocari Vitalie
00:38:01bloody —» turn up the silence
17:53:05Iubiri trecute —» Frinturi din suflet de femeie
14:07:21Noul an: importanța trăirii în lumina veșniciei —» Moldova Creștină
14:00:23De ce nu sărbătoresc Ziua Îndrăgostiților și Dragobetele —» Sunt MAMĂ!
13:54:47La clătite, înainte! Rețeta celor mai delicioase clătite americane + o activitate pentru copii —» Sunt MAMĂ!
13:45:01President Sandu’s trip to Kyiv: Two memorandums; no mentioning of the Transnistrian conflict —» Dionis Cenuşa
13:26:13Maia Sandu, în cadrul vizitei oficiale la Kiev: „Ne dorim să fim mai mult decât vecini, ne dorim să fim prieteni” —» Elena Robu
09:46:405 ani de la explozia de la cafeneaua ”La Soacra” —» blog cultural
08:46:43300 de euro mită pentru a deveni ”șofer” în R. Moldova —» Elena Robu
06:32:31CUM SĂ FACI ORDINE ÎNTR-O ȚARĂ A CĂREI CONSTITUȚIE NU CORESPUNDE DISPOZIȚIEI MAIEI SANDU!? —» Sergiu Mocanu
04:48:28flamboyant —» turn up the silence
20:26:24Ce-ar fi oare să băgăm la dubă „street-racer”ii ilegali? Ei doar îs ucigași latenți! —» un alt blog
16:20:53Cine o însoțește pe Maia Sandu în prima vizită oficială în străinătate în calitate de președinte al țării —» Elena Robu
16:02:02Top vânzări decembrie 2020. Librăriile Cartier —» Gheorghe Erizanu
14:07:00Morse code – mandatory for militaries —» Dragostina Vicol – jurnalism militar
12:58:24De ce citesc tot mai puține cărți de parenting —» Sunt MAMĂ!
10:44:00A chemat poliția la biserică pentru mai multe nereguli —» Curaj.TV | Media alternativă
09:21:11După furtuna de zăpadă Filomena, Spania se pregăteşte pentru un val „nemaintâlnit” de frig —» Elena Robu
08:58:15Critică pe Igor Dodon și alții pentru iresponsabilitatea manifestată public la adresa oamenilor —» Curaj.TV | Media alternativă
08:23:46COVID-19: Noi măsuri care intră în vigoare de astăzi în Germania —» Elena Robu