css sprite tehnika

[Kristabs]

Kāds izmanto šo tehniku veidojot lapas? Pamēģināju sataisīt sprite png setu vienai esošai lapai un man tas png sanāca par kādiem 30% smagāks nekā sagrieztas mazās bildītes. Man lielākās bailes, ka varētu būt problēmas ar bg pozicionēšanu, jo propertijs position tiek izmantots, lai attēlotu vajadzīgo vietu no lielā attēla. Tad sanāk wrapot vēl vienā elementā, kuru arī pozicionēt. Liekas, ka šādi viss tiek sarežģīts, nevis atvieglots.

 

Ja kāds izmantojis vai izmanto, tad padalieties pieredzē par plusiem un mīnusiem.

 

Atradu http://css-tricks.com/css-sprites-what-the...ow-to-use-them/ , tieši komentāros var lasīt plusus/mīnusus.

Edited April 15, 2008 by Kristabs

[Roze]

Plusi:

Viss vienā bildē - viens http requests = ātrāk (bildei nevaidzētu sanākt lielākai nekā atsevišķām maziņām (tad jaskatās ko attiecīgā grafiskā perga kopā līmējot ir ne tā izdarījusi))

 

Mīnusi:

Jākne nemērā.

Pozicionēšanas murgi.

Jaunu elementu pievienošanas sistēma.

Ne vienmēr visur vajag visas ikonas.

 

 

Jēdzīgākais kur to var izmantot manā skatijumā ir onMouseover kur var piemēram kā bgimagi pabīdīt.

[Kristabs]

+/- tā arī biju aizdomājies, ka pārspīlēt nevajag (saliekot visu saitu). Ja tiešām ir vairāku img + hover efektu izvēlne, tad konkrēti tai arī taisīt sprites būs efektīvi. Pie tam, tajā gadījumā visdrīzāk būs vienāda izmēra grafikas, kuras daudz vieglāk dinamiski vadīt ārā, kā arī vieglāk pievienot.

 

Ja vienā setā būs viens liels headeris, tad izmētātas ikonas, tad gan ar izvadi, gan jaunu pievienošanu varētu būt lielāks čakars.

[localhero]

Lai attelotu hover ideali. Nav vajadzigs bilzu preloadings. Protams ne visur der. Naglu var iedzit ari ar cirvi.