Results 1 to 4 of 4

Thread: AnyLink Drop Down Menu

  1. #1
    Join Date
    Jan 2008
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question AnyLink Drop Down Menu

    1) Script Title: AnyLink Drop Down Menu

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...pmenuindex.htm

    3) Describe problem:
    First i cut and pasted to see how it would work with the text "as is".
    Once I updated with my information it wouldn't work.
    I'm not sure what I did wrong but would love any suggestions.
    I was able to see the menu with the titles...but no mouseover drop down...
    PLEASE help!!

    Thanks

  2. #2
    Join Date
    Sep 2005
    Location
    India
    Posts
    1,627
    Thanks
    6
    Thanked 107 Times in 107 Posts

    Default

    It would be better if you post either a link to your page or your source so that we can check the problem.

  3. #3
    Join Date
    Jan 2008
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    <a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu1, '150px')" onMouseout="delayhidemenu()">Duffel Bags</a> |
    <a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu2, '150px')" onMouseout="delayhidemenu()">Lunch Totes</a> |
    <a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu3, '150px')" onMouseout="delayhidemenu()">Backpacks</a> |
    <a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu4, '150px')" onMouseout="delayhidemenu()">Nap Mats</a> |
    <a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu5, '150px')" onMouseout="delayhidemenu()">Laundry Bags</a> |
    <a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu6, '150px')" onMouseout="delayhidemenu()">Blankets</a> |
    <a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu7, '150px')" onMouseout="delayhidemenu()">Cosmo Bag</a> |
    <a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu8, '150px')" onMouseout="delayhidemenu()">Personalized Stationery</a> |
    <a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu9, '150px')" onMouseout="delayhidemenu()">Clearance Items</a> |



    <style type="text/css">

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

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

    #dropmenudiv a:hover{ /*hover background color*/
    background-color: yellow;
    }

    </style>

    <script type="text/javascript">

    /***********************************************
    * AnyLink Drop Down Menu- © Dynamic Drive (www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    * Visit http://www.dynamicdrive.com/ for full source code
    ***********************************************/

    //Contents for menu 1,
    var menu1=new Array()
    menu1[0]='<a href="http://www.thegiftwhiz.com/smallduffel.html">Small Duffel</a>'
    menu1[1]='<a href="http://www.thegiftwhiz.com/mediumduffel.html">Medium Duffel</a>'

    //Contents for menu 2,
    var menu2=new Array()
    menu2[0]='<a href="http://www.thegiftwhiz.com/snacksquare.html">Snack Square</a>'
    menu2[1]='<a href="http://www.thegiftwhiz.com/lunchbox.html ">Lunch Box</a>'

    //Contents for menu 3,
    Menu3[0]='<a href="http://www.thegiftwhiz.com/smallbakcpack.html">Small Backpack</a>'
    Menu3[1]='<a href="http://www.thegiftwhiz.com/mediumbackpack.html">Medium Backpack</a>'

    //Contents for menu 4,
    Menu4[0]='<a href="http://www.thegiftwhiz.com/napmats.html">Nap Mats For Boys</a>'
    Menu4[1]='<a href="http://www.thegiftwhiz.com/napmats.html">Nap Mats For Girls</a>'

    //Contents for menu 5,
    Menu5[0]='<a href="http://www.thegiftwhiz.com/laundrybag.html">Laundry Bag</a>'

    //Contents for menu 6,
    Menu6[0]='<a href="http://www.thegiftwhiz.com/blankie.html">Blankets for Boys</a>'
    Menu6[1]='<a href="http://www.thegiftwhiz.com/blankie.html">Blankets for Girls</a>'

    //Contents for menu 7,
    Menu6[0]='<a href="http://www.thegiftwhiz.com/cosmobag.html">Cosmo Bag</a>'

    //Contents for menu 8,
    Menu8[0]='<a href="http://www.thegiftwhiz.com/kidscampstationery.html">Kids Camp</a>'
    Menu8[1]='<a href="http://www.thegiftwhiz.com/personalizedstationery.html">General</a>

    //Contents for menu 9,
    Menu9[0]='<a href="http://www.thegiftwhiz.com/clearance.html">Duffels</a>'
    Menu9[1]='<a href="http://www.thegiftwhiz.com/clearance.html ">Lunch Totes</a>
    Menu9[2]='<a href="http://www.thegiftwhiz.com/clearance.html">Small Backpacks</a>'
    Menu9[3]='<a href="http://www.thegiftwhiz.com/clearance.html ">Cosmo Bags</a>





    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+';background-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="-500px"
    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().clientWidth-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().clientHeight-15 : window.pageYOffset+window.innerHeight-18
    dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
    if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move up?
    edgeoffset=dropmenuobj.contentmeasure+obj.offsetHeight
    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

    </script>

  4. #4
    Join Date
    Feb 2006
    Posts
    236
    Thanks
    8
    Thanked 3 Times in 3 Posts

    Default

    well, for one, you are missing the array declarations for menus 3, 4, 5, 6, 7, 8, and 9. Add the appropriate missing line, like the one in red, in these 7 places. For example:
    Code:
    //Contents for menu 3,
    var menu3=new Array()
    Menu3[0]='<a href="http://www.thegiftwhiz.com/smallbakcpack.html">Small Backpack</a>'
    Menu3[1]='<a href="http://www.thegiftwhiz.com/mediumbackpack.html">Medium Backpack</a>'
    and you also may have a spelling error in 'smallbakcpack.html'

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •