Comments on: CSS2 řešení: efektní stylování odkazujícího obrázku

By: Kahi

Kahi — Sun, 17 Feb 2008 11:30:45 +0000

[15] Popisky plovoucích obrázků se mi dělají snadno. O šířku bloků se nestarám, to vypočítává Texy. Já jen napíšu `[* jak-jsem-videl-slony/slon-c14.jpg >] *** Tak tenhle se mi fakt líbil`

By: Radek Matěj

Radek Matěj — Sun, 17 Feb 2008 09:34:26 +0000

Osobně mi připadá ideální Filosofovo řešení s prázdým spamem, který je ale dobré přidávat JavaScriptem pro obrázky, které vedou na zvětšeninu. Napříiklad pomocí "jQuery":http://jquery.com/ je to na pár řádků.

Řeším ale jiné problémy: Pokud chci mít lupu v pravém horním rohu, nenašel jsem jiné řešení, než formátovat odkaz jako blokový element. Stýská se mi po inline-block.

Druhý problém a zároveň otázka na tebe =) — jak řešíš caption plovoucích obrázků? Jak udělat, aby delší caption (v tvém případě element ) s delším textem nevytékalo z pod obrázku. Vidím, že nastavuješ, stejně jako já, šířku obalujícího elementu (figure-right). Jediné efektivní řešení, abych šířku nemusel ručně psát, mi připadá opět JavaScript.

By: Kahi

Kahi — Sun, 27 Jan 2008 17:24:41 +0000

Ještě by zasloužilo reakci:

[1] napsal:

Osobně to řeším prázdným elementem… potřebuji totiž řešení DNES

reaguji: to je možná funkční, ale samo o sobě ne plnohodnotné řešení. Ne vždy má kodér kontrolu nad obsahem. Span navíc je něco navíc. Čili tvé řešení samo o sobě (třeba bez spanu generovaného pomocí JS) není plnohodnotné. Mé řešení je plnohodnotné, zato jen teoreticky :-).

[3] napsal:

„obrázek je na backu odkazu a odkaz je pozicován z-indexem nad obrázek“

reaguji: nezkoušel jsem, ale jestli to funguje spolehlivě, může to být lepší řešení než Filosofovo (se spanem navíc).

By: PJ

PJ — Fri, 25 Jan 2008 22:11:00 +0000

[12] Diky moc, a promin mi ty zmatky, co jsem v noci vyvadel. :)

By: Kahi

Kahi — Fri, 25 Jan 2008 11:08:03 +0000

[10] s tím spanem to vypadá nějak takto:

a {
        position:relative; }

a span {
        position:absolute; right:0; bottom:0;
        width:32px; height:32px;
        background:url(zoom.png) no-repeat;}

 href="photo.jpg"> src="t_photo.jpg" alt="" />

ad komentáře – něco s tím udělám