« 1 2 »
Autor Zpráva
N
Profil *
#1 · Zasláno: 9. 8. 2011, 16:39:23
Odpovědět Citovat
hoj, mam tenhle skript: 

    function displayMenu(elementID)
    {
    var id;
        
        id = "buttonMenu" + elementID;
        document.all.item(id).style.display = "";
    }


kterej mi zaručí, že se zobrazí daný box s IDčkem.

Volám to takto: 


            <a href="#" onMouseOver="displayMenu('1')">nástěnka</a>
            <a href="#" onMouseOver="displayMenu('2')">pracovna</a>
            <a href="#" onMouseOver="displayMenu('3')">správa obsahu</a>
            <a href="#" onMouseOver="displayMenu('4')">uživatelé</a>
            <a href="#" onMouseOver="displayMenu('5')">nastavení</a>
            <a href="#" onMouseOver="displayMenu('6')">úložna</a>
            <a href="#" onMouseOver="displayMenu('7')">zakázky</a>
            <a href="#" onMouseOver="displayMenu('8')">technická podpora</a>


Ovšem, když najedu na 3 tak se mi všechny zobrazené boxi s ID 1,2,3,4,5,6 zobrazují pod sebou a nemizí. Potřeboval bych, aby když najedu na 1 se zobrazila 1 a byla tam do té doby, než bych najel na 2 a nezmizela. Našel jsem jen pouze takovou funkci, že když jsem sjel z odkazu tak to zmizelo hned, což je nežádoucí. Potřebuji, aby tam zobrazovaný div s ID vydržel až do najetí na další odkaz a pokud tak uživatel neučiní, aby tam zůstal pořád. Děkuji moc.

Zbytek: 

<div id="buttonMenu1" style="display: none"> 
    text, který se zobrazí dál
    </div>
hunter_dave
Profil
#2 · Zasláno: 9. 8. 2011, 18:40:17 · Upravil/a: hunter_dave
Odpovědět Citovat
uprava 
function displayMenu(elementID)
    {  
        id = "buttonMenu" + elementID;
        document.getElementById(id).style.display = "block";
    }
function hideMenu(elementID)
    {  
        id = "buttonMenu" + elementID;
        document.getElementById(id).style.display = "none";
    }
    
<a href="#" onMouseOver="displayMenu('1')" onMouseOut="hideMenu('1')">nástěnka</a>

mělo by to pomoct
N
Profil *
#3 · Zasláno: 9. 8. 2011, 18:44:38
Odpovědět Citovat
Ano, tuto možnost jsem zkoušel také, ale já se potřebuji po divu pohybovat kurzorem tak, aby mi obsah nezmizel do té doby, než najedu na další políčko v menu. Tudíž abych mohl si třeba vybrat z nabídky a nezmizel mi daný obsah. Tady mi to řeší jen to, že když sjedu z odkazu zase obsah zmizí. Prosím o pomoc s tím, aby zůstalo dokud nebude kurzor myši na dalším odkazu.
hunter_dave
Profil
#4 · Zasláno: 9. 8. 2011, 18:44:57
Odpovědět Citovat
Můžu doporučit ještě jednoduchou animaci, zkus opacity(css vlastnost) nebo rect(js funkce).
php
Profil *
#5 · Zasláno: 9. 8. 2011, 18:46:04
Odpovědět Citovat
tak si někam na s tránku přidej 
<input type='hidden' id='visible_item' value='' />


a tu funkci si uprav na tohle 
 function displayMenu(elementID){
 
   var id = 'buttonMenu' + elementID
   
   if ( $('visible_item').value != "" )   $($('visible_item').value).style.display = "none";
   
   $(id).style.display = "block";
   $('visible_item').value = id;
    
 }
 
 zápis $(id) / $('visible_item') se dá nahradit:  document.getElementById(id) / document.getElementById('visible_item')
hunter_dave
Profil
#6 · Zasláno: 9. 8. 2011, 18:46:39
Odpovědět Citovat
takže klasické rozbalovací menu?
mám to udělaný u sebe na stránkách .. http://field.cz
N
Profil *
#7 · Zasláno: 9. 8. 2011, 18:49:08
Odpovědět Citovat
Dost dobře nechápu k čemu ten input a kam ho umístit.
N
Profil *
#8 · Zasláno: 9. 8. 2011, 18:50:03
Odpovědět Citovat
Princip je podobný, ovšem zde se bude měnit celý DIV BOX, text i s odkazy bude jiný podle toho, na kterou položku v menu najedete.
php
Profil *
#9 · Zasláno: 9. 8. 2011, 18:52:06
Odpovědět Citovat
ten input tam je proto aby si pamatoval poslední zobrazený obsah, aby si věděl, když najedeš na další odkaz, který máš schovat
a dej si ho někam, kde máš ty odkazy, třeba hned pod ně, to je jedno 
.
.
.
<a href="#" onMouseOver="displayMenu('5')">nastavení</a>
<a href="#" onMouseOver="displayMenu('6')">úložna</a>
<a href="#" onMouseOver="displayMenu('7')">zakázky</a>
<a href="#" onMouseOver="displayMenu('8')">technická podpora</a>
<input type='hidden' id='visible_item' value='' />
N
Profil *
#10 · Zasláno: 9. 8. 2011, 18:52:34
Odpovědět Citovat
[#2] hunter_dave

Tato možnost je funkční, jen bych potřeboval, aby když najedu myší mimo odkaz nebo se pohyboval v daném divu, který se zobrazuje. (Mimo najetí na jiný odkaz.) Aby zůstal div stále stejný.
N
Profil *
#11 · Zasláno: 9. 8. 2011, 18:54:43
Odpovědět Citovat
Skript: 

 function displayMenu(elementID){
 
   var id = 'buttonMenu' + elementID
   
   if ( $('visible_item').value != "" )   $($('visible_item').value).style.display = "none";
   
   $(id).style.display = "block";
   $('visible_item').value = id;
    
 }


Odkazy: 

 <div class="topMenu">
            <a href="#" onMouseOver="displayMenu('1')" onMouseOut="hideMenu('1')">nástěnka</a>
            <a href="#" onMouseOver="displayMenu('2')">pracovna</a>
            <a href="#" onMouseOver="displayMenu('3')">správa obsahu</a>
            <a href="#" onMouseOver="displayMenu('4')">uživatelé</a>
            <a href="#" onMouseOver="displayMenu('5')">nastavení</a>
            <a href="#" onMouseOver="displayMenu('6')">úložna</a>
            <a href="#" onMouseOver="displayMenu('7')">zakázky</a>
            <a href="#" onMouseOver="displayMenu('8')">technická podpora</a>
            <input type='hidden' id='visible_item' value='' /> 
        </div>


Box: 

 <div class="buttonMenu" id="buttonMenu1" style="display: none"> 
   text
    </div>



Bohužel nefunguje.
php
Profil *
#12 · Zasláno: 9. 8. 2011, 18:56:04
Odpovědět Citovat
tak ještě tam zkus přidat tohle do tý funkce: 
 function displayMenu(elementID){
 
   var id = 'buttonMenu' + elementID
   
   if( $('visible_item').value != id ){
     
     if ( $('visible_item').value != "" )   $($('visible_item').value).style.display = "none";
     
     $(id).style.display = "block";
     $('visible_item').value = id;
     
}
}
N
Profil *
#13 · Zasláno: 9. 8. 2011, 18:57:55
Odpovědět Citovat
Bohužel, stále nefunguje.
php
Profil *
#14 · Zasláno: 9. 8. 2011, 18:58:48
Odpovědět Citovat
nefunguje tak jak si chtěl nebo vůbec nezobrauje?
N
Profil *
#15 · Zasláno: 9. 8. 2011, 19:01:44
Odpovědět Citovat
Nefunguje a ani nezobrazuje. Žádná chyba ani nic podobného. Ani náznak špatné funkčnosti.

Pro jistotu ještě poslím třídu, která je definována pro všechny tyhle boxíky. 

.buttonMenu {
    text-align: left;
    margin: 0px auto;
    width: 1000px;
    margin-top: 10px;
}
hunter_dave
Profil
#16 · Zasláno: 9. 8. 2011, 19:01:48
Odpovědět Citovat
nevidím důvod proč by script php nefungoval.
N
Profil *
#17 · Zasláno: 9. 8. 2011, 19:03:01
Odpovědět Citovat 
<SCRIPT LANGUAGE="JavaScript"><!--
function displayMenu(elementID){
 
   var id = 'buttonMenu' + elementID
   
   if( $('visible_item').value != id ){
     
     if ( $('visible_item').value != "" )   $($('visible_item').value).style.display = "none";
     
     $(id).style.display = "block";
     $('visible_item').value = id;
     
}
}
    
    // --></SCRIPT> 
</head>
<body>
    
    <div id="pageHeader">
        <div class="projectLogo">
            <a href="#"><img src="layout/images/mini-logo.png" alt="project logo"></a>
        </div>
        <div class="topIcons">
            <div class="home"><a href="#"><img width="22" height="9" src="layout/images/home.png" alt="Nástěnka"></a></div>
            <div class="site"><a href="#"><img width="26" height="9" src="layout/images/site.png" alt="Síť"></a></div>
            <div class="contact"><a href="#"><img width="24" height="9" src="layout/images/contact.png" alt="Kontakt"></a></div>
        </div>
        <div class="clear"></div>
        <div class="topMenu">
            <a href="#" onMouseOver="displayMenu('1')" onMouseOut="hideMenu('1')">nástěnka</a>
            <a href="#" onMouseOver="displayMenu('2')">pracovna</a>
            <a href="#" onMouseOver="displayMenu('3')">správa obsahu</a>
            <a href="#" onMouseOver="displayMenu('4')">uživatelé</a>
            <a href="#" onMouseOver="displayMenu('5')">nastavení</a>
            <a href="#" onMouseOver="displayMenu('6')">úložna</a>
            <a href="#" onMouseOver="displayMenu('7')">zakázky</a>
            <a href="#" onMouseOver="displayMenu('8')">technická podpora</a>
            <input type='hidden' id='visible_item' value='' /> 
        </div>
        <div class="pageLanguage">
            <a href="#"><img src="layout/images/cz.png" alt="Česky"></a>
            <a href="#"><img src="layout/images/de.png" alt="Německy"></a>
            <a href="#"><img src="layout/images/en.png" alt="Anglicky"></a>
            <a href="#"><img src="layout/images/it.png" alt="Italsky"></a>
        </div>
    </div>
    
    <div class="clear"></div>
 
    <div class="buttonMenu" id="buttonMenu1" style="display: none"> 
    text sds dsd s dsds dsd sd
    </div>
php
Profil *
#18 · Zasláno: 9. 8. 2011, 19:04:28
Odpovědět Citovat
hunter_dave:
„nevidím důvod proč by script php nefungoval.“
tady se jedná ale o javascript

tak jí zkus přepsat takhle: 
function displayMenu(elementID){
 
   var id = 'buttonMenu' + elementID
   
   if( document.getElementById('visible_item').value != id ){
     
     if ( document.getElementById('visible_item').value != "" )   
       document.getElementByID(document.getElementById('visible_item').value).style.display = "none";
     
     document.getElementById(id).style.display = "block";
     document.getElementById('visible_item').value = id;
     
}
}
N
Profil *
#19 · Zasláno: 9. 8. 2011, 19:08:19
Odpovědět Citovat
Momentálně se to chová tak, že se zobrazí požadovaný text, který je ukrytý ve schovaném boxu, ale při najetí na jiný odkaz při nově založeném boxu už nezmizí. Ovšem všiml jsem si, že když najedu na první odkaz zobrazí se první text správně a už nezmizí, bohužel ani ne když najedu na druhý odkaz, ale když najedu při refrešování poprvé na druhý odkaz zobrazí se správně druhý box, ale také už nezmizí, takže vlastně to už napevno zůstává... bohužel ale při najetí na jiný odkaz se to nezmění... ale pokrok :))
hunter_dave
Profil
#20 · Zasláno: 9. 8. 2011, 19:08:49
Odpovědět Citovat
už to vidim .. do inputu se nezapisuje číslo ale celý id divu .. to znamená bottonMenu+cislo
hunter_dave
Profil
#21 · Zasláno: 9. 8. 2011, 19:09:43
Odpovědět Citovat
poslední řádek v javascriptu .. document.getElementById('visible_item').value = elementID;
N
Profil *
#22 · Zasláno: 9. 8. 2011, 19:10:45
Odpovědět Citovat
[#19] N

Pořád trvá tento problém i po úpravě posledního řádku.
php
Profil *
#23 · Zasláno: 9. 8. 2011, 19:11:43
Odpovědět Citovat
zkus přepsat tnhle řádek 
 document.getElementByID(document.getElementById('visible_item').value).style.display = "none";

na tohle 
 document.getElementById(document.getElementById('visible_item').value).style.display = "none";
N
Profil *
#24 · Zasláno: 9. 8. 2011, 19:12:53
Odpovědět Citovat
Současný kód: 

function displayMenu(elementID){
 
   var id = 'buttonMenu' + elementID
   
   if( document.getElementById('visible_item').value != id ){
     
     if ( document.getElementById('visible_item').value != "" )   
       document.getElementById(document.getElementById('visible_item').value).style.display = "none";
     
     document.getElementById(id).style.display = "block";
     
     document.getElementById('visible_item').value = elementID;
     
}
}



Bohužel pořád to samé.
php
Profil *
#25 · Zasláno: 9. 8. 2011, 19:17:13
Odpovědět Citovat
tak ještě rozdělit ten display none možná 
  if ( document.getElementById('visible_item').value != "" )   {
        _id = 'buttonMenu' + document.getElementById('visible_item').value;
       document.getElementById(_id).style.display = "none";
       
       }
hunter_dave
Profil
#26 · Zasláno: 9. 8. 2011, 19:17:24
Odpovědět Citovat 
  <input type=text value="" id=backup>
  <br>
  <script type=text/javascript>
 function displayMenu(elementID){
 
   var id = 'buttonMenu' + elementID
   
   if ( document.getElementById('backup').value != "" ){
   document.getElementById(document.getElementById('backup').value).style.display = "none";
   }
   
   document.getElementById(id).style.display = "block";
   document.getElementById('backup').value = id;
    
 }
    </script>
<a href="#" onmouseover="displayMenu('1')" onmouseout="displayMenu('1')">menu</a>
<a href="#" onmouseover="displayMenu('2')" onmouseout="displayMenu('2')">menu</a>
<br>
<div id=buttonMenu1 style=display:none onmouseout="displayMenu('')">menu1a<br>menu2a<br>menu3a<br></div>
<div id=buttonMenu2 style=display:none onmouseout="displayMenu('')">menu1b<br>menu2b<br>menu3b<br></div>

zkousel sem to u sebe .. me to funguje
hunter_dave
Profil
#27 · Zasláno: 9. 8. 2011, 19:18:08 · Upravil/a: hunter_dave
Odpovědět Citovat
musí se tam přidat onmouseout .. k odkazům i divům .. jenom tomu inputu přidat type=hidden .. aby nebyl videt a divy a odkazy si dát kam chces
N
Profil *
#28 · Zasláno: 9. 8. 2011, 19:19:31
Odpovědět Citovat
Bohužel, kdybych to i zkusil nasadit, rozhodí mi to celou stránku + odkazy mají celkem jinou podobu.
hunter_dave
Profil
#29 · Zasláno: 9. 8. 2011, 19:20:24
Odpovědět Citovat
neříkám aby si to zkopíroval .. udělej to podle toho.
N
Profil *
#30 · Zasláno: 9. 8. 2011, 19:21:08
Odpovědět Citovat
Funguje to, ale ten text input tam mít nemůžu.
Téma pokračuje na další straně.
« 1 2 »

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Prosím používejte diakritiku a interpunkci.

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

0