<a> tag-nek háttér -- CSS
Szervusztok!
Java Script-et váltanám ki CSS-el a linkek dinamikus képcseréjénél.
out.println("<a id=\"toLeafLeft\" href=\"./" + getServletName() + "?page=" + leafLeft + "\"> </a>");
#toLeafLeft { background: url("./design/ic_bal.jpg") top left no-repeat; }
#toLeafLeft:hover { background-image: url("./design/ic_bal_akt.jpg"); }
Kérdésem az volna, hogy létezik-e elegánsabb megoldás a fentinél ahol is (szóköz) -el és a betűméret megfelelő kiválasztásával gondoskodom arról, hogy legyen valami tartalom mert különben nem látszódik a háttér?
--
sirkalmi
■ Java Script-et váltanám ki CSS-el a linkek dinamikus képcseréjénél.
out.println("<a id=\"toLeafLeft\" href=\"./" + getServletName() + "?page=" + leafLeft + "\"> </a>");
#toLeafLeft { background: url("./design/ic_bal.jpg") top left no-repeat; }
#toLeafLeft:hover { background-image: url("./design/ic_bal_akt.jpg"); }
Kérdésem az volna, hogy létezik-e elegánsabb megoldás a fentinél ahol is (szóköz) -el és a betűméret megfelelő kiválasztásával gondoskodom arról, hogy legyen valami tartalom mert különben nem látszódik a háttér?
--
sirkalmi
további kérdés
A következőket ismerem:
hover: az egérkurzor felette van
active: az egérgombot lenyomva tartom
link: még nincs látogatva
visited: már látogatott
Kéne egy olyan, hogy az éppen aktuális link tehát ami a címsorban van éppen. Van ilyen? Ha nincs az kellemetlen mert akkor nem tudok egységes stítus file-t csinálni mert ahány menüm van annyi féle kell, ugyanis az aktuálisnál ugyanazt szeretném megjeleníteni amit a többinél a :hover -nél adtam meg és, ha ezt nem tudom eseményhez kötni akkor egy sima <img> elemmel kell helyettesíteni. Remélem érthető voltam. :-)
Segítséget előre köszi!
--
sirkalmi
display:block
egy display: block után jol tudod majd méretezni és nem kell bele tartalom, de nem árt ha van, és azt meg text-indent-el eltolod a látható részből
background: url("./design/ic_bal.jpg") top left no-repeat;
display:block;
width:100px; /* vagy valamennyi*/
height:100px;/* vagy valamennyi*/
text-indent:-1000em;
}
#toLeafLeft:hover { background-image: url("./design/ic_bal_akt.jpg"); }
remélem értettem a kérdést:-D
működik!
Köszi!
--
sirkalmi
igen
értem
--
sirkalmi