Komentář k příspěvku: 'Plně obrázková tlačítka bez preloadu' http://typomil.com/typofilos/2006/01/plne-obrazkova-tlacitka-bez-preloadu/ převážně nasírací Thu, 28 Aug 2008 00:10:54 +0000 http://wordpress.org/?v=2.6 Od: rybiska http://typomil.com/typofilos/2006/01/plne-obrazkova-tlacitka-bez-preloadu/#comment-818 rybiska Wed, 17 Jan 2007 15:33:23 +0000 http://typomil.com/typofilos/?p=18#comment-818 <texy>Prosím o návrh řešení problému udělal jsem dvě tlačítka a každé je v jiném zobrazení stejného divu oba obrázky mají však rozdílnou výšku. při použití posunu pozadí přes Mozilla FF, Opera 9.0, Netscape 8.02 vše funguje na příkazy a.ikona { background-image: url(../ico/ikona1.gif); background-repeat: no-repeat; background-position: bottom; } a.ikona:hover { background-position: top; } ale v IE 6.0+ mi to dělá to, že při hover zobrazuje pozadí buttonu správně ale při běžném stavu zobrazuje pozadí butonu jakoby bylo dáno na střed divu Prosím o návrh řešení problému

udělal jsem dvě tlačítka a každé je v jiném zobrazení stejného divu oba obrázky mají však rozdílnou výšku.

při použití posunu pozadí přes Mozilla FF, Opera 9.0, Netscape 8.02 vše funguje na příkazy

a.ikona
{

background-image: url(../ico/ikona1.gif);
background-repeat: no-repeat;
background-position: bottom;
}

a.ikona:hover
{
background-position: top;
}

ale v IE 6.0+ mi to dělá to, že při hover zobrazuje pozadí buttonu správně ale při běžném stavu zobrazuje pozadí butonu jakoby bylo dáno na střed divu

]]> Od: MiSHAK http://typomil.com/typofilos/2006/01/plne-obrazkova-tlacitka-bez-preloadu/#comment-151 MiSHAK Wed, 08 Feb 2006 14:44:44 +0000 http://typomil.com/typofilos/?p=18#comment-151 No lze to jeste zmensit vynechanim left a top, to jsou default hodnoty :-) a ty uvozovky jsou taky zbytecne, protoze se uvadi vzdy URL resp. URI obrazku ;-] No lze to jeste zmensit vynechanim left a top, to jsou default hodnoty :-) a ty uvozovky jsou taky zbytecne, protoze se uvadi vzdy URL resp. URI obrazku ;-]

]]> Od: Jiří Bureš http://typomil.com/typofilos/2006/01/plne-obrazkova-tlacitka-bez-preloadu/#comment-133 Jiří Bureš Wed, 25 Jan 2006 19:33:20 +0000 http://typomil.com/typofilos/?p=18#comment-133 To Hondrej: Význam je hlavně v problikávání (resp. opožděném vykreslování) obrázků po najetí myší na ještě nenačtený obrázek. V případě Pixyho řešení se načte jediný obrázek, který obsahuje všechny stavy. Při klasickém řešení se samostatnými obrázky se načtou zobrazené obrázky a obrázky akcí (hover) se načítají až při najetí myší. To způsobí, že se stávající obrázek vymže a do načtení dalšího je na pozici jen prázdný čtyřúhelník. To Hondrej: Význam je hlavně v problikávání (resp. opožděném vykreslování) obrázků po najetí myší na ještě nenačtený obrázek. V případě Pixyho řešení se načte jediný obrázek, který obsahuje všechny stavy. Při klasickém řešení se samostatnými obrázky se načtou zobrazené obrázky a obrázky akcí (hover) se načítají až při najetí myší. To způsobí, že se stávající obrázek vymže a do načtení dalšího je na pozici jen prázdný čtyřúhelník.

]]> Od: Hondrej http://typomil.com/typofilos/2006/01/plne-obrazkova-tlacitka-bez-preloadu/#comment-132 Hondrej Wed, 25 Jan 2006 17:40:10 +0000 http://typomil.com/typofilos/?p=18#comment-132 <texy>Jen tak orientačně. Jsem si jist, že užívání 1 obrázku obsahujícího 2 různé "podobrázky" má smysl zejména v tom, že jeho velikost je menší než velikost těchto 2 podobrázků, avšak separovaných každý do 1 souboru. Máte někdo ponětí, k jakému ušetření (a jestli vůbec k nějakému) dojde? Jen tak orientačně. Jsem si jist, že užívání 1 obrázku obsahujícího 2 různé “podobrázky” má smysl zejména v tom, že jeho velikost je menší než velikost těchto 2 podobrázků, avšak separovaných každý do 1 souboru.

Máte někdo ponětí, k jakému ušetření (a jestli vůbec k nějakému) dojde?

]]> Od: crackonosh http://typomil.com/typofilos/2006/01/plne-obrazkova-tlacitka-bez-preloadu/#comment-131 crackonosh Wed, 25 Jan 2006 08:01:25 +0000 http://typomil.com/typofilos/?p=18#comment-131 Zipper> Zápisy: <strong>a.button:hover span</strong> a <strong>a.button span:hover</strong> by vlastně čistě teoreticky měly mít stejný efekt. Díky za upozornění na chybu, sladil jsem kódy ukázek a příkladů na verzi <strong>a.button:hover span</strong>, kterou uvádíš ty — je to tak lepší. S definicí obrázku pro „a“ máš pravdu, i bez ní to funguje (teď přemýšlím, proč jsem ji tam vlastně dal, takže to mažu). Ale pokud není definováno a.button:hover, nefungují obrázky v IE 5. V IE 6 se mi odmítalo pozadí vrátit do výchozí pozice, proto tuto část považuji za nutnou. Díky. Zipper> Zápisy:
a.button:hover span
a a.button span:hover
by vlastně čistě teoreticky měly mít stejný efekt.

Díky za upozornění na chybu, sladil jsem kódy ukázek a příkladů na verzi a.button:hover span, kterou uvádíš ty — je to tak lepší.

S definicí obrázku pro „a“ máš pravdu, i bez ní to funguje (teď přemýšlím, proč jsem ji tam vlastně dal, takže to mažu). Ale pokud není definováno a.button:hover, nefungují obrázky v IE 5. V IE 6 se mi odmítalo pozadí vrátit do výchozí pozice, proto tuto část považuji za nutnou. Díky.

]]> Od: zipper http://typomil.com/typofilos/2006/01/plne-obrazkova-tlacitka-bez-preloadu/#comment-130 zipper Tue, 24 Jan 2006 19:45:25 +0000 http://typomil.com/typofilos/?p=18#comment-130 Jinak v kódu příkladu je... jde o příklad 1, omlouvám se za dva posty :-/ Konrétně ten druhý hover není a.button span:hover, ale a.button:hover span. Jinak v kódu příkladu je… jde o příklad 1, omlouvám se za dva posty :-/ Konrétně ten druhý hover není a.button span:hover, ale a.button:hover span.

]]> Od: zipper http://typomil.com/typofilos/2006/01/plne-obrazkova-tlacitka-bez-preloadu/#comment-129 zipper Tue, 24 Jan 2006 19:41:48 +0000 http://typomil.com/typofilos/?p=18#comment-129 Používám pouze <code> a.button { ... } a.button span { ... background: url('button.gif') left top no-repeat; } a.button:hover span { background-position: 0 -50px; }</code> a všude mi to funguje (bez definice obrázku na pozadí pro a). Jinak v kódu příkladu je něco jiného než je v ukázce kódu ;) Používám pouze

a.button {
...
}
a.button span {
...
background: url('button.gif') left top no-repeat;
}
a.button:hover span {
background-position: 0 -50px;
}
a všude mi to funguje (bez definice obrázku na pozadí pro a). Jinak v kódu příkladu je něco jiného než je v ukázce kódu ;)

]]> Od: crackonosh http://typomil.com/typofilos/2006/01/plne-obrazkova-tlacitka-bez-preloadu/#comment-128 crackonosh Tue, 24 Jan 2006 12:35:16 +0000 http://typomil.com/typofilos/?p=18#comment-128 Hever: W3C validator (<a href"http://jigsaw.w3.org/css-validator/">http://jigsaw.w3.org/css-validator/</a>) považuje prázný span za korektní. Pokud by tě tato drobnost trápila, není problém span vyplnit třeba nedělitelnou mezerou. Osobně to považuji za celkem zbytečné, nicméně — je to řešení. Hever: W3C validator (http://jigsaw.w3.org/css-validator/) považuje prázný span za korektní. Pokud by tě tato drobnost trápila, není problém span vyplnit třeba nedělitelnou mezerou. Osobně to považuji za celkem zbytečné, nicméně — je to řešení.

]]> Od: Hever http://typomil.com/typofilos/2006/01/plne-obrazkova-tlacitka-bez-preloadu/#comment-127 Hever Tue, 24 Jan 2006 12:29:33 +0000 http://typomil.com/typofilos/?p=18#comment-127 Pixyho řešení jsem zaregistroval poprvé, používal jsem vždycky jiné. Zajímalo by mě, jak je to s prázným span tagem ... můj HTML validator Tidy (rozšíření firefoxu) říká, že by to tak být nemělo. Pixyho řešení jsem zaregistroval poprvé, používal jsem vždycky jiné. Zajímalo by mě, jak je to s prázným span tagem … můj HTML validator Tidy (rozšíření firefoxu) říká, že by to tak být nemělo.

]]>