• User

    Position di uno script

    Gentilissimi,
    innanzi tutto un grandissimo complimento, per il lavoro che svolgete e per l'impegno sempre garantito.

    Avrei questo problema:
    Ho un menù in javascript che non riesco a posizionare dove vorrei.
    il fatto è che era stato creato per un semplice menù sinistro senza contare che l'index poi richiamava il menù in un frame. Quindi ho scoperto che lo script non può "sovarcare" nel frame adiacente...

    Questo è lo script incriminato:
    (quasi dimenticavo: vorrei ma non riesco a posizionarlo nella riga sottostante, in modo che non sia largo più di 150px... )

    #dropmenudiv{
    position:absolute;
    background-color: #F3DA99;
    border:1px solid black;
    border-bottom-width: 0;
    font:normal 10px Verdana;
    line-height:18px;
    z-index:100;
    }

    width: 100%;
    display: block;
    text-indent: 3px;
    border-bottom: 1px solid black;
    padding: 1px 0;
    text-decoration: none;
    font-weight: bold;
    }

    hover background color/
    background-color: #F9EDCD;
    }

    /* Sample CSS definition for the example list. Remove if desired */
    .navlist li {
    list-style-type: square;
    width: 135px;
    background-color: #EEEEEE;
    }

    </style>

    <script type="text/javascript">

    //Contents for menu 1 (Programme)
    var menu1=new Array()
    menu1[0]='<a href="programme/frm_programme.html" target="main">Scientific Programme</a>'
    menu1[1]='<a href="plenary/frm_plenary.html" target="main">Plenary Lectures</a>'
    menu1[2]='<a href="young/frm_young.html" target="main">Young Chemist</a>'
    menu1[3]='<a href="social/frm_social.html" target="main">Young Chemist</a>'

    //Contents for menu 2 (Accomodation)
    var menu2=new Array()
    menu2[0]='<a href="accomodation/frm_accomodation.htm" target="main">Accomodation</a>'
    menu2[1]='<a href="accomodation/frm_low_accommodation.htm" target="main">Low Cost Accomodation</a>'

    //Contents for menu 3 (Turin)
    var menu3=new Array()
    menu3[0]='<a href="information/frm_touristic.html" target="main">Touristic Inf.</a>'
    menu3[1]='<a href="information/turin/frm_turin.html" target="main">About Turin</a>'
    menu3[2]='<a href="getting/frm_getting.html" target="main">Public Transportation</a>'
    menu3[3]='<a href="information/frm_general.html" target="main">Weather & numbers</a>'
    menu3[4]='<a href="reaching/frm_reaching.html" target="main">Reaching Turin</a>'
    menu3[5]='<a href="information/piemonte/frm_piedmont.html" target="main">Abount Piedmont</a>'

    var disappeardelay=250 //menu disappear speed onMouseout (in miliseconds)
    var horizontaloffset=2 //horizontal offset of menu from default location. (0-5 is a good value)

    /////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: 160px" 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
    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().clientWidth-15 : window.pageXOffset+window.innerWidth-15
    dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
    if (windowedge-dropmenuobj.x-obj.offsetWidth < 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().clientHeight-15 : window.pageYOffset+window.innerHeight-18
    dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
    if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move menu up?
    edgeoffset=dropmenuobj.contentmeasure-obj.offsetHeight
    if ((dropmenuobj.y-topedge)<dropmenuobj.contentmeasure) //up no good either? (position at top of viewable window then)
    edgeoffset=dropmenuobj.y
    }
    }
    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")+obj.offsetWidth+horizontaloffset+"px"
    dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+"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)
    }

    </script>

    <td height="25" background="img_home/botto_menu.gif">&nbsp;&nbsp;&nbsp;&nbsp;<span class="testorosso">::</span>
      <a href="frm_programme.html" target="main" onMouseover="dropdownmenu(this, event, menu1, '165px')" onMouseout="delayhidemenu()" target="main" class="linkrosso">Programme &nbsp;</a></td>
    

    </tr>


  • User

    Quello che dovresti fare e mettere parte dello script nel frame adiacente, e con js lo comandi dal frame del menu.

    La logica sarebbe questa

    FrameMenu->ElementoMenu->OnMouseOver->Apre div nel frame vicino al menù all'altezza giusta.

    Tu ora invece fai questo

    FrameMenu->ElementoMenu->OnMouseOver->Apre div nel frame del menù stesso.

    Quindi non vedi tutto il div che compare xkè non si sovrapposiziona al frame limitrofo.
    Spero di aver capito cio che volevi e di averti dato la dritta giusta.
    Un'esempio non lo so fare però in rete c sono diversi js che fanno questo.


  • User

    Scusa non mi è chiaro, vuoi dire che il css che ora è nel frame menu devo esportarlo e importarlo nel index?


  • User

    no, devi dividere il codice js in + pagine web.
    Allora mi spiego, tu con il codice apri il menu sul frame dove c'è il menù.
    Ma tu lo devi aprire nel frame limitrofo. Quindi nel frame limitrofo devi creare gli oggetti da visualizzare, ma li comandi dal frame col menù. Ripeto farti un'esempio e cosa lunga e non ho il tempo di studiare sul codice xrò farei così, se cerchi in rete c sono diversi esempi su questo tipo di menù.

    Ti posto un'esempio trovato con google di quello che intendo.

    http://dhtml-menu.com/examples/ef3-crossframe-menu.html


  • User

    Grazie, mi sembra una soluzione logica,
    dammi solo un ragguaglio per favore:

    Il mio index apre 3 frame (menu, top, main)

    Cosa inseriresti nel menù e cosa nel index?


  • User

    non c'è possibilità di far apparire nella riga sottostante alla voce il mio menù dinamico, così risolverebbe il problema. Secondo te è questo il problema, lo spazio del mio frame menù?


  • User

    Sai cosa, per effettuare quello che mi proponi dovrei editare tutte le pagine del mio sito e richiamare per ognuna il menu che se no non apparirebbe...