Autor Zpráva
ppooler
Profil
#1 · Zasláno: 19. 11. 2006, 19:02:32 · Upravil/a: ppooler
Odpovědět Citovat
...ani nevím přesně jak to pojmenovat, takže nemá smysl používat vyhledávač a raději založím nový thread.

Chtěl bych nějaký link ,kde by bylo trochu popsáno, jak se dají udělat takovéty "okýnka"- které se při přejetí kurzoru na odkaz (nejčastěji v drobečkové navigaci) "vysunou" a jejich obsah jsou další odkazy,nebo jen text.

Jako je např. tady
http://www.amsoft.cz/index.html
hugo
Profil *
#2 · Zasláno: 19. 11. 2006, 19:04:21
Odpovědět Citovat
hledej "drop-down menu"
treba na http://cssplay.co.uk
Anonymní
Profil *
#3 · Zasláno: 19. 11. 2006, 19:13:54
Odpovědět Citovat
http://css.interval.cz/clanky/vysouvaci-menu-rozcestnik/
ppooler
Profil
#4 · Zasláno: 20. 11. 2006, 12:36:06
Odpovědět Citovat
Díky, to je ono-podle tohoto návodu by neměl být probém takové menu udělat ,ale nakonec jsem usoudil ,že tento prvek nevyužiji,leda trochu jiný,podobný...

Proto píšu do tohoto threadu ,které má neutrální název:Jak udělat...

Jak udělat klikací mapu která by využívala těchto "okýnek" při najetí myši(kurzoru)-její podklad by byl velký obrázek ?


Prostě chci využít toho,že jeden nejmenovaný program umí intuitivně vytvářet klikací mapy,a já bych tak přidělil bližší informace při najetí na objekty na této
stránce...na celém obrázku-, jen nevím jak zapsat správně značku s atributem ,která "způsobí"- tento html efekt ...

Lze toho docílit bez CSS nebo Javascriptu- teba nějakým atributem <area title... ?
ppooler
Profil
#5 · Zasláno: 20. 11. 2006, 15:00:07 · Upravil/a: ppooler
Odpovědět Citovat
Tady podle toho není uplně jisté ,jestli je pro atribut title ve značce area podpora ze strany prohlížečů:
http://www.jakpsatweb.cz/html/obrazky.html#area
ppooler
Profil
#6 · Zasláno: 20. 11. 2006, 17:10:07
Odpovědět Citovat
Zkoušel jsem přidat tuto deklaraci ,ale nefungujeto ani ve FF 
nohref="title="text text text">
ppooler
Profil
#7 · Zasláno: 20. 11. 2006, 17:51:38 · Upravil/a: ppooler
Odpovědět Citovat
Bohatě by mi stačil odkaz na stránku ,kde je toto použito- ve zdr.kódu už bych si to našel...
ppooler
Profil
#8 · Zasláno: 20. 11. 2006, 17:58:51
Odpovědět Citovat 
<img src="manual.jpg" alt="" usemap="#ImageMapImageMap0" style="position: absolute; left: 125px; top: 110px; width: 714px; height: 1056px; z-index: 0;" align="top" border="0" height="1056" width="714">

<a href="manual.html"> <map name="ImageMapImageMap0">

<area shape="circle" coords="319,41,32" title="ahoj">

<area shape="rect" coords="288,94,523,145" title="ahoj">

<area shape="rect" coords="288,181,546,226" title="ahoj">

<area shape="rect" coords="309,326,413,354" title="ahoj">

<area shape="rect" coords="35,518,218,538" title="ahoj">

<area shape="rect" coords="23,897,416,917" title="ahoj">

<area shape="rect" coords="26,975,298,1021" title="ahoj">

<area shape="rect" coords="426,1011,666,1027" title="ahoj">

<area shape="polygon" coords="600,958,505,957,531,999,425,999,477,919,494,942,599,943" title="ahoj">

<area shape="circle" coords="41,688,9" title="ahoj">

</map>



<map name="ImageMapImageMap0">

<area shape="circle" coords="319,41,32" title="ahoj">



<area shape="rect" coords="288,94,523,145" title="ahoj">

<area shape="rect" coords="288,181,546,226" title="ahoj">

<area shape="rect" coords="309,326,413,354" title="ahoj">

<area shape="rect" coords="35,518,218,538" title="ahoj">

<area shape="rect" coords="23,897,416,917" title="ahoj">

<area shape="rect" coords="26,975,298,1021" title="ahoj">

<area shape="rect" coords="426,1011,666,1027" title="ahoj">

<area shape="polygon" coords="600,958,505,957,531,999,425,999,477,919,494,942,599,943" title="ahoj">

<area shape="circle" coords="41,688,9" title="ahoj">

</map>



Co je teda v tomto kódu špatně ?
Bubák
Profil
#9 · Zasláno: 20. 11. 2006, 18:06:46
Odpovědět Citovat
ppooler
O co se pokoušíš, o tohle?
<area href="#" title="popis" shape=rect coords="10,20,90,100">
ppooler
Profil
#10 · Zasláno: 20. 11. 2006, 18:13:46
Odpovědět Citovat
Už jsem to na 99% vyřešil,ale do té bubliny se vejde jen asi 30 znaků,a to už v rámci html asi nijak nevyřeším...
Časová prodleva: 1 měsíc
Luba
Profil *
#11 · Zasláno: 23. 12. 2006, 11:39:31
Odpovědět Citovat
Cau mam tento přiklad:var scriptsOn = ( ( browser == "IE" ) || ( browser == "NN" ) ) ? true : false;

function getCmdString( layerName, show )
{
strCmd = "";
if( browser == "IE" )
{
if( show )
{
strCmd = "document.all[ '" + layerName + "' ].style.visibility = 'visible'";
}
else
{
strCmd = "document.all[ '" + layerName + "' ].style.visibility = 'hidden'";
}
}
if( browser == "NN" )
{
if( show )
{
strCmd = "document.layers[ '" + layerName + "' ].visibility = 'show'";
}
else
{
strCmd = "document.layers[ '" + layerName + "' ].visibility = 'hide'";
}
}

return strCmd;
}
// --></SCRIPT>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript"><!--

var timer;

function RegisterImage(imgName, imgOn, imgOff)
{
if (scriptsOn) {
eval (imgName + "On = new Image()");
eval (imgName + "On.src = "" + imgOn + """);
eval (imgName + "Off = new Image()");
eval (imgName + "Off.src = "" + imgOff + """);
}
}

function ImageOver(imgName)
{
if (scriptsOn)
eval ("document." + imgName + ".src = " + imgName + "On.src");
}

function ImageOut(imgName)
{
if (scriptsOn)
eval ("document." + imgName + ".src = " + imgName + "Off.src");
}

RegisterImage ("Zacatek", "tlacitko2.gif", "tlacitko.gif");
RegisterImage ("Konec", "tlacitko2.gif", "tlacitko.gif");

function hidemenus( exc, imgName )
{
clearInterval(timer);
timer = null;
for (id=1; id<=2; id++)
{
if (id != exc)
{
eval( getCmdString( "mnui"+id, false ) );
ImageOut( imgName );
}
}
}

function outobject( imgName )
{
strCmd = "hidemenus(20, '" + imgName + "' )";
timer = setInterval( strCmd, 500 );
}

function quickhide( imgName )
{
ImageOut(imgName )
}

function onheader( hID, imgName )
{
ImageOver( imgName );
hidemenus(hID,imgName);
eval( getCmdString( "mnui"+hID, true ) );
}

function onobject()
{
clearInterval(timer);
timer = null;
}
//--></script>

<style>
<!--
table a { font-weight: bolder; font-family: Arial CE, Arial; text-decoration: none; font-size: 9pt; color: black }
a:hover { color: #55d700; text-decoration: underline}
.menubox { position: absolute; background-color: white; border-color: black; border-width: 1pt; border-style: solid; visibility:hidden }
.menulineitem { cursor:hand }
-->
</style>

</HEAD>
<BODY>

<table border="0" cellspacing="0" cellpadding="0" class="menuline">
<tr>
<td>
<a href="javascript:void(0)" id="i1" onmouseover="ImageOut('Konec'); onheader( '1', 'Zacatek' );ImageOver('Zacatek')" onmouseout="outobject( 'Zacatek' );" class="menulineitem">
<IMG SRC="tlacitko.gif" WIDTH=149 HEIGHT=26 BORDER=0 NAME=Zacatek>
</span>
</td>
<td>
<a href="javascript:void(0)" id="i2" onmouseover="ImageOut('Zacatek'); onheader( '2', 'Konec' );ImageOver('Konec')" onmouseout="outobject( 'Konec' );" class="menulineitem">
<IMG SRC="tlacitko.gif" WIDTH=149 HEIGHT=26 BORDER=0 NAME=Konec>
</span>
</td>
</tr>
</table>

<!--Menu 1-->

<table border="0" class="menubox" id="mnui1" style="left: 23; top: 35;">
<tr>
<td >
&nbsp;<a href="test.html" onmouseover="onobject(); ImageOut('Konec'); ImageOver('Zacatek');" onmouseout="outobject( 'Zacatek' );" onmousemove="onobject();" >A</a><br>
&nbsp;<a href="test.html" onmouseover="onobject(); ImageOut('Konec'); ImageOver('Zacatek');" onmouseout="outobject( 'Zacatek' );" onmousemove="onobject();" >B</a><br>
&nbsp;<a href="test.html" onmouseover="onobject(); ImageOut('Konec'); ImageOver('Zacatek');" onmouseout="outobject( 'Zacatek' );" onmousemove="onobject();" >C</a><br>
<td>
</tr>
</table>

<!--Menu 2-->

<table border="0" class="menubox" id="mnui2" style="left: 200; top: 35;">
<tr >
<td>
&nbsp;<a href="test.html" onmouseover="onobject(); ImageOut('Zacatek');ImageOver('Konec');" onmousemove="onobject();" onmouseout="outobject( 'Konec' );">jedna</a>
&nbsp;<a href="test.html" onmouseover="onobject(); ImageOut('Zacatek');ImageOver('Konec');" onmousemove="onobject();" onmouseout="outobject( 'Konec' );">dva</a>
<td>
</tr>
</table>



text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text
</BODY>
</HTML>
a nevim jak rozšiřit menu o dalsi položky se stejnyma vlastnostma?
Časová prodleva: 17 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0