Autor Zpráva
Paulí
Profil
Dobrý den,
prosím vás o radu.
Chtěl bych abych když najedu na text se objevila nad ním bublina, do který si můžu dát obrázky a odkazy. Díky za rady. s pozdravem Paulí.
Akacko
Profil
1) vubec netušim oč se ma jednat
2) to spiš vypada na JS
Paulí
Profil
no má to vypadat něco jako tato funkce :
<p id="pokus"><a href="index.php">Nad tímto pokusným textem se objeví bublina.</a></p>
<script>
document.getElementById("pokus").title="<img src="1.gif>"
</script>
ale tak aby se neobjevil NÁPIS "<img src="1.gif>" ale aby se objevil OBRÁZEK "1.gif"
Paulí
Profil
ale pokud někdo ví, jak na to přes css nebo script, tak klidně může poradit
K.
Profil *
Tohle ti takhle nepujde. Do titlu se dava uz jen text nikoliv tagy. Budes to muset udelat nejakym skriptem u uzivatele. Neco jako si udelat nekde normalne neviditelny <span> a po najeti na odkaz ho zobrazit a presunout k odkazu.
koudi
Profil
ale pokud někdo ví, jak na to přes css nebo script, tak klidně může poradit
To vypadá jako kdyby jsi to chtěl dělat přeš php...
Akacko
Profil
no možna by to šlo pomoci cotojatek. Ale nezkoušel jsem tam davat obrazky, tak nevim jestli to pojede.
Paulí
Profil
no to cotojatek je ideální, až na to, že když popohnu myší po textu, tak ten rámeček jde za myškou, nešlo by to udělat tak, aby tam ten rámeček zůstal, protože v tom rámečku chci mít odkazy ??
Paulí
Profil
nechci otravovat, ale nějak mi zatím nikdo neodpověděl ...
Pavel Strejček
Profil
to bude tím, že jsi ve špatné fóru
Pavel Prochazka.zde.cz
Profil *
Paulí sice nejak neumim javascript ale zvladnuljsem to:

radky:

if (X + objTooltip.offsetWidth < document.body.offsetWidth-10) { objTooltip.style.left = eval(X + 8) + "px"; } else { objTooltip.style.left = eval(X - 8 - objTooltip.offsetWidth) + "px"; }
if (Y - objTooltip.offsetHeight > 10) { objTooltip.style.top = eval(Y - objTooltip.offsetHeight) - 8 + "px"; } else { objTooltip.style.top = Y + "px"; }


nahrad temato:

objTooltip.style.left = minX + 30 + "px";
objTooltip.style.top = minY - 30 + "px";
Pavel Prochazka.zde.cz
Profil *
Paulí sice nejak neumim javascript ale zvladnuljsem to:

radky:

if (X + objTooltip.offsetWidth < document.body.offsetWidth-10) { objTooltip.style.left = eval(X + 8) + "px"; } else { objTooltip.style.left = eval(X - 8 - objTooltip.offsetWidth) + "px"; }
if (Y - objTooltip.offsetHeight > 10) { objTooltip.style.top = eval(Y - objTooltip.offsetHeight) - 8 + "px"; } else { objTooltip.style.top = Y + "px"; }


nahrad temato:

objTooltip.style.left = minX + 30 + "px";
objTooltip.style.top = minY - 30 + "px";
Paulí
Profil
eh ..... nějak to nefunguje ..... mám IE7 a když to upravím, jak jsi říkal, tak když najedu na odkaz, tak se nestane nic ....
Paulí
Profil
jo promiň .... jde to ..... ale ten rámeček zmizí, když na něj chci najet ..... já tam potřebuji mít odkazy ....
Pavel Prochazka.zde.cz
Profil *
Paulí to je jasne ze to zmizi, jedna se totoz jen o napovedu a ne kontextovou nabytku....

script uprav takto:
najdi si misto kde se testuje zda je mys uz mimo odkaz a nachazi se nad napovedi, tam neprovadej zruseni nabytky.
Otazkou je zda to vybec pujde... Nejak jsem nestudoval ten script.
habendorf
Profil
kontextovou nabytku....

OMG
djlj
Profil
habendorf
Copak? Já dělám běžně kupuju nábytek napsanej v javascriptu ;).
mav
Profil *
CSS:

.thumbnail{position: relative;}

.thumbnail:hover{ background-color: transparent;padding: 0px; }

.thumbnail span{ position:absolute;
z-index:2;background-color: lightyellow; padding: 0px;
border: 1px dashed gray; visibility: hidden;

}

.thumbnail span img{
padding: 3px;}

.thumbnail:hover span{
visibility: visible; position: absolute;left:0px;top:-120px;

}

A.thumbnail:link {font-family:arial;font-size:12px;COLOR: #000000; cursor: hand; TEXT-DECORATION: none;}
A.thumbnail:active {font-family:arial;font-size:12px;COLOR: #000000; cursor: hand; TEXT-DECORATION: none;}
A.thumbnail:hover {font-family:arial;font-size:12px;COLOR: #000000; cursor: hand; TEXT-DECORATION: none;}
A.thumbnail:visited {font-family:arial;font-size:12px;COLOR: #000000; cursor: hand; TEXT-DECORATION: none;}

vlastní code:

<a class="thumbnail" href="#">
<img src="#" border="0" alt="#">
<span>
<strong>text blalbalba</strong>
<p > blabalblalblalblabl</p>
<img src="#" border="0" >
</span></a>


Místo křížků napiš cestu. V css muzes zmenit barvu pozadi atd, ve vlastím kodu potom usporadani obrazku i textu je taky libovolne...
Toto téma je uzamčeno. Odpověď nelze zaslat.