HTML/XHTML - Dymek do obrazka.
widokówka - 2012-02-24, 16:12
Temat postu: Dymek do obrazka.
Hej, chciałabym, aby po najchaniu na obazek pojawiał sie dymek z informacjami. Nie chodzi mi o polecienie ALT, czy TITLE. Użyłam takiego kodu:
| Kod: | <div id="position: relative">
<img src="obrazek" onmouseover="document.getElementById('dymek').style.display = ''" onmouseout="document.getElementById('dymek').style.display = 'none'">
<div id="dymek" style="position: absolute; top: 50px; left: 50%; display: none">tekst</div>
</div> |
Problem jest taki, że chce, aby było kilka obrazków obok siebie, w kilku linjkach i po najechaniu na każdy, żeby pokazywało się co innego. Aktualnie jest tak, że pojawiają sie pionowo i każdy pokazuje to samo. Ponadto chciałabym, aby można było na ten dymek najechać myszką i np. wejść w link w ów dymku zawartym.
Ktoś jest w stanie pomóc?
Paheli - 2012-09-23, 20:33
nie wiem czy dobrze zrozumiałam o co Ci chodzi...
| Kod: | <style type="text/css">
body {
margin:30px; padding:0;
font:normal 12px verdana,sans-serif;
}
.chmurka3 {
position:absolute;display:none;left:0px;top:20px;
border:1px solid #6495ED;background-color:#FBFAF6;color:black;
padding:4px;font:italic normal 11px verdana,sans-serif;
}
</style>
<div style="margin:0px">
<span style="position:relative">
<a href="TU WPISUJESZ LINK" onmouseover="Chmurka(this,1)" onmouseout="Chmurka(this,0)" title="">
<img onmouseout="this.style.MozOpacity=0.80;this.filters.alpha.opacity=30;" onmouseover="this.style.MozOpacity=1;this.filters.alpha.opacity=100;" style="opacity: 0.8;" src="http://imageshack.us/a/img843/9379/chri02.jpg"> </a> <div class="chmurka3" style="display: none; ">
<center>TXT </center>
</div></span>
<span style="position:relative">
<a href="LINK" onmouseover="Chmurka(this,1)" onmouseout="Chmurka(this,0)" title="">
<img onmouseout="this.style.MozOpacity=0.80;this.filters.alpha.opacity=30;" onmouseover="this.style.MozOpacity=1;this.filters.alpha.opacity=100;" style="opacity: 0.8;" src="http://imageshack.us/a/img843/9379/chri02.jpg"></a> <div class="chmurka3" style="display: none; ">
<center>txt</center>
</div></span>
<script type="text/javascript">
function Chmurka(T,t){
T.title=''
T.parentNode.lastChild.style.display=t?'block':'none'
}
</script> |
ivall - 2015-10-22, 19:19
Oco chodzi z ivall!?
zapalniczka - 2015-10-24, 17:19
| ivall napisał/a: | | Oco chodzi z ivall!? |
Odkopałeś zapomniany temat sprzed 3 lat...
depsha - 2016-01-15, 13:19
A temat dalej nie rozwiązany, bo ten kod nie działa. Może ktoś go przystosować, aby on działa?
Disney - 2016-02-18, 23:51
Ja proponuje zrobić screen problemu i screeny tego jak ma to wyglądać. Wiadomo widzę jak coś wygląda, to jednocześnie mogę pomóc.
|
|
|
