Visualizzazione dei risultati da 1 a 7 su 7
  1. #1
    Utente di HTML.it
    Registrato dal
    Apr 2008
    Messaggi
    6

    Menu a tendina da JS esterno

    Ho scaricato dal sito l'esempio di menu a tendina e vorrei creare un file js contenente le seguenti righe:
    <ul>[*]Home[*]Classifiche[*]Calendari[*]Rose[*]Formazioni e Risultati[*]Registri Voti[*]Statistiche e TotoFantacalcio[*]<a href="#" onMouseover="return dropdownmenu(this, event, menu7, '150px')" onMouseout="delayhidemenu()">Studia le Formazioni[*]Forum[*]Invio Formazione [*]Regolamento [*]Albo D'Oro [*]Meteo [/list]
    in modo da poter richiamare in ogni pagina lo script e non dover ritrascrivere tutte le righe in ogni pagina del sito.
    Ho pensato di far precedere ogni riga del js da
    document.write (' ........')
    però funzione onMouseover non ne vuol sapere di funzionare.
    Sapete come fare ad aiutarmi?

  2. #2
    ciao, mi permetto di darti qualche consiglio

    io imposterei html così:
    Codice PHP:
    <div id="menu">
      ...
    qui ci va il menù che generi con il tuo script inserito nella sezione  head della tua pagina ...
    </
    div
    javascript:
    Codice PHP:
    // recupero id del div che contiene il menu
    var myDiv document.getElementById('menu');
    // attenzione agli apici e doppi apici
    var menu_html "
     <ul>[*][url='index.html']Home[/url][*]<a href='#' onClick='return clickreturnvalue()' onMouseover='dropdownmenu(this, event, menu1, \'150px\')'
     ...
    "
    ;
    myDiv.innerHTML menu_html
    la via più semplice è usare innerHTML, a grandi linee, questa potrebbe essere una soluzione

  3. #3
    Utente di HTML.it
    Registrato dal
    Apr 2008
    Messaggi
    6
    Premettendo che non sono molto esperto, ma io questa funzione non la conosco e per questo alexforum di chiedo di seguirmi un po'.
    il DIV dell'html dove c'è il menu si chiama 'navigation'
    nell' header dell'html ho il file "Menu.js" dal seguente contenuto:
    //Contents for menu 1
    var menu1=new Array()
    menu1[0]='Campionato'
    menu1[1]='Coppa Girone A'
    menu1[2]='Coppa Girone B'

    //Contents for menu 2, and so on
    var menu2=new Array()
    menu2[0]='Campionato'
    menu2[1]='Coppa'
    //Contents for menu 3, and so on
    var menu3=new Array()
    menu3[0]='N. Twenty Three'
    menu3[1]='L. K. Morfeus'
    menu3[2]='Desp. 1983'
    menu3[3]='Champions Team'
    menu3[4]='Gli Zii'
    menu3[5]='Baricentro Basso'
    menu3[6]='Balla coi Lupi'
    menu3[7]='Fantabatibomber'
    //Contents for menu 4, and so on
    var menu4=new Array()
    menu4[0]='Formazioni Prossima Giornata'
    menu4[1]='Risultati Ultima Giornata'
    //Contents for menu 5, and so on
    var menu5=new Array()
    menu5[0]='N. Twenty Three'
    menu5[1]='L. K. Morfeus'
    menu5[2]='Desp. 1983'
    menu5[3]='Champions Team'
    menu5[4]='Gli Zii'
    menu5[5]='Baricentro Basso'
    menu5[6]='Balla coi Lupi'
    menu5[7]='Fantabatibomber'
    //Contents for menu 6, and so on
    var menu6=new Array()
    menu6[0]='Statistiche'
    menu6[1]='FantaMister'
    menu6[2]='TotoFantacalcio'
    //Contents for menu 7, and so on
    var menu7=new Array()
    menu7[0]='Gazzetta'
    menu7[1]='Televideo'





    var menuwidth='165px' //default menu width
    var menubgcolor='lightyellow' //menu bgcolor
    var disappeardelay=250 //menu disappear speed onMouseout (in miliseconds)
    var hidemenu_onclick="yes" //hide menu when user clicks within menu?

    /////No further editting needed

    var ie4=document.all
    var ns6=document.getElementById&&!document.all

    if (ie4||ns6)
    document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';backg round-color:'+menubgcolor+'" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"></div>')

    function getposOffset(what, offsettype){
    var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
    var parentEl=what.offsetParent;
    while (parentEl!=null){
    totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
    parentEl=parentEl.offsetParent;
    }
    return totaloffset;
    }

    function showhide(obj, e, visible, hidden, menuwidth){
    if (ie4||ns6)
    dropmenuobj.style.left=dropmenuobj.style.top=-500
    if (menuwidth!=""){
    dropmenuobj.widthobj=dropmenuobj.style
    dropmenuobj.widthobj.width=menuwidth
    }
    if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
    obj.visibility=visible
    else if (e.type=="click")
    obj.visibility=hidden
    }

    function iecompattest(){
    return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
    }

    function clearbrowseredge(obj, whichedge){
    var edgeoffset=0
    if (whichedge=="rightedge"){
    var windowedge=ie4 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWid th-15 : window.pageXOffset+window.innerWidth-15
    dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
    if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
    edgeoffset=dropmenuobj.contentmeasure-obj.offsetWidth
    }
    else{
    var topedge=ie4 && !window.opera? iecompattest().scrollTop : window.pageYOffset
    var windowedge=ie4 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeig ht-15 : window.pageYOffset+window.innerHeight-18
    dropmenuobj.contentmeasure=dropmenuobj.offsetHeigh t
    if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move up?
    edgeoffset=dropmenuobj.contentmeasure+obj.offsetHe ight
    if ((dropmenuobj.y-topedge)<dropmenuobj.contentmeasure) //up no good either?
    edgeoffset=dropmenuobj.y+obj.offsetHeight-topedge
    }
    }
    return edgeoffset
    }

    function populatemenu(what){
    if (ie4||ns6)
    dropmenuobj.innerHTML=what.join("")
    }

    function dropdownmenu(obj, e, menucontents, menuwidth){
    if (window.event) event.cancelBubble=true
    else if (e.stopPropagation) e.stopPropagation()
    clearhidemenu()
    dropmenuobj=document.getElementById? document.getElementById("dropmenudiv") : dropmenudiv
    populatemenu(menucontents)

    if (ie4||ns6){
    showhide(dropmenuobj.style, e, "visible", "hidden", menuwidth)
    dropmenuobj.x=getposOffset(obj, "left")
    dropmenuobj.y=getposOffset(obj, "top")
    dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+"px"
    dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
    }

    return clickreturnvalue()
    }

    function clickreturnvalue(){
    if (ie4||ns6) return false
    else return true
    }

    function contains_ns6(a, b) {
    while (b.parentNode)
    if ((b = b.parentNode) == a)
    return true;
    return false;
    }

    function dynamichide(e){
    if (ie4&&!dropmenuobj.contains(e.toElement))
    delayhidemenu()
    else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
    delayhidemenu()
    }

    function hidemenu(e){
    if (typeof dropmenuobj!="undefined"){
    if (ie4||ns6)
    dropmenuobj.style.visibility="hidden"
    }
    }

    function delayhidemenu(){
    if (ie4||ns6)
    delayhide=setTimeout("hidemenu()",disappeardelay)
    }

    function clearhidemenu(){
    if (typeof delayhide!="undefined")
    clearTimeout(delayhide)
    }

    if (hidemenu_onclick=="yes")
    document.onclick=hidemenu
    ho creato e inserito nell'header il js come da te suggerito (prova.js) nel seguente modo:
    // recupero id del div che contiene il Menu
    var navigation = document.getElementById('menu');
    // attenzione agli apici e doppi apici
    var menu_html = "
    <ul> [*]Home [*]Classifiche[*]Calendari[*]Rose[*]Formazioni e Risultati[*]Registri Voti[*]Statistiche e TotoFantacalcio[*]<a href='#' onMouseover='return dropdownmenu(this, event, menu7, '150px')' onMouseout='delayhidemenu()'>Studia le Formazioni[*]Forum[*]Invio Formazione [*]Regolamento [*]Albo D'Oro [*]Meteo [/list]
    ";
    navigation.innerHTML = menu_html;
    e nel BODY dell'html che scrivo?? :master: :master:

  4. #4
    ciao,
    nel body dell' html devi scrivere

    Codice PHP:
    <div id="navigation"></div
    il div devere avere lo stesso id di quello che usavi nel tuo esempio


  5. #5
    Utente di HTML.it
    Registrato dal
    Apr 2008
    Messaggi
    6
    Ciao alexforum , prima di tutto ti ringrazio per la sollecitudine e poi però avrei la necessità tu mi controllassi la sintassi dei due js che ho inviato, perchè ho provato a modificare il tutto come dici tu ma non mi funziona, scusami per il disturbo.

  6. #6
    Utente di HTML.it
    Registrato dal
    Apr 2008
    Messaggi
    6
    mi dice 'navigation' valore nullo o non è un oggetto
    Forse c'è qualcosa che non va :master:

  7. #7
    Utente di HTML.it
    Registrato dal
    Apr 2008
    Messaggi
    6
    Finalmente ci sono riuscito.
    Ho abbandonato l'idea di alexforum e ho ripreso in mano quella che inizialmente avevo pensato, facendo precedere ogni riga nel JS da:
    document.write ('....')
    con la differenza che ho inserito il menu in una tabella e come per magia funziona.
    Grazie alexforum comunque per il suggerimento.

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.