Autor Zpráva
karel novotný
Profil *
Ahoj, mám obrázek, třeba

a potřeboval bych, aby se mi po najetí myši zobrazil přes něj další obrázek. Asi takle

vím že by to šlo řešit nějaký absolutně napozicovaným skrytým prvkem, ale zajímá mě, jestli na to nění nějaká vychytávka nebo jestli už to někdo neřešil a nemá nějaký elegantní řešení. děkuju za rady.
Petr ZZZ
Profil
Můžeš spojit dva obrázky do jednoho (natvrdo, v nějakém grafickém editoru), výsledný obrázek dát na pozadí a pomocí CSS ho na hover přesouvat. Podívej se třeba na menu 2 na Bubákově stránce. (Tady v diskusi jsi např. toto řešení nenašel? Stejný dotaz je tu tak jednou týdně.)
karel novotný
Profil *
jasně to já chápu, ale není to pro mě elegantní řešení. těch podkladovech obrázků jsou mraky a spustu znich přidávám přímo z internetu bez toho, abych je měl na disku. navíc bych je musel editovat manuálně.
panther
Profil
karel novotný:
obrázek, který se má zobrazovat nahoře, bude vždy stejný? Pak není co řešit a při :hoveru měň jeho visibility, resp. display.
karel novotný
Profil *
ano, to je jedna možnost, taky ji zmiňuji v prvním příspěvku. ale zajímá mě, jestli neexistuje nějaké jiné, elegantnější řešení..
panther
Profil
karel novotný:
jestli neexistuje nějaké jiné, elegantnější řešení..
nemyslím si, tohle mi přijde elegantní až až :-)
karel novotný
Profil *
když říkám elegatní, tak myslím pouze přes css. tak abych nemusel zasahovat do html
Petr ZZZ
Profil
Reaguji na karla novotného:

CSS je už z principu soubor prezentačních předpisů, zatímco jazykem HTML kóduješ vlastní obsah. Máš-li jednou takové, podruhé makové a potřetí zase jiné páry obrázků, jedná se o změny obsahu, což spadá pod HTML. Mohl bys sice měnit v CSS cesty a názvy obrázků, na které se pořád stejné HTML odvolává, ovšem dostávat – předpokládám na stejné adrese a na stejná klíčová slova – co chvíli něco jiného, to bych asi nebyl nadšený ani jako uživatel, ani jako vyhledávač.

Snad ještě k tomu mnou odkázanému příkladu – jednoduchou úpravou to můžeš dělat i s dvěma samostatnými obrázky. Vtip odkázaného řešení je ten, že se načítá jen jeden obrázek. Se dvěma obrázky se může stát, že se druhý nenačte nebo se načte trochu později a pak to nevypadá hezky.

přidávám přímo z internetu bez toho, abych je měl na disku
Jen se zeptám – autorská práva máš ošetřena?
Chamurappi
Profil
Reaguji na karla novotného:
tak abych nemusel zasahovat do html
To jsou vstupní podmínky spíš pro extrémní řešení, než pro elegantní.
Jak přesně vypadá to HTML, do něhož nechceš zasahovat? Je obrázek obalen do něčeho, s čím si lze hrát?
karel novotný
Profil *
Petr ZZZ:
CSS je už z principu soubor prezentačních předpisů
ano vím, ale css má třeba atribut backround:, proto se ptám, myslel jsem, jestli neexistuje něco jako foreground:, nebo něco na ten způsob.
Petr ZZZ
Profil
Existuje pseudotřída :hover. (Mou otázku ohledně autorských práv jsi asi přehlédl, že?)
karel novotný
Profil *
ano, existuje. ale těžko s ní přidám do popředí obrázek, nebo se pletu? prává mám ošetřený, nemusíš mít strach ;-)
dranel91
Profil
karel novotný:
Shrnu to. CSS nemá žádnou vlastnost foreground, protože co je vpředu, to je důležité a důležitý je obsah a ten je psán v HTML. CSS pouze řídí jeho formu. Pokud to jsou tedy stěžejní obrázky, mající nějakou informační hodnotu, pak je vhodné použít tag <img> a obrázky měnit např. pomocí výše zmíněné vlastnosti visibility resp. display a preudotřídy :hover. Pokud nemají žádnou informační hodnotu a jsou to pouhá pozadí, pak je to práce CSS, které si s tím poradí díky své vlastnosti background.
Trejpa
Profil
karel novotný:
Mají-li být na stránce dva nezávislé obrázky nad sebou, bude muset být každý v jiném HTML elementu. Buď jeden jako běžný obrázek a druhý napozicovaný nad ním nebo oba jako pozadí ve dvou vnořených blocích (příklad). Bez úpravy HTML kódu s tím nehneš.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: