Results 1 to 2 of 2

Thread: Drop down menu and images help

  1. #1
    Join Date
    Nov 2007
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Drop down menu and images help

    1) Script Title:

    2) Script URL (on DD):

    3) Describe problem:

    I am using a drop down menu, the only issue I have is that when I click on one of the items in the menu it loads my picture in a new window and not in a frame in the same window as it is supposed to. Here is the relevant coding:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <link href="style.css" rel="stylesheet" type="text/css" />
    <title>Envirofresh Products</title>


    <link rel="stylesheet" href="thumbnailviewer.css" type="text/css" />

    <script src="thumbnailviewer.js" type="text/javascript">

    </script>

    <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 2, and so on
    var menu0=new Array()
    menu0[0]='<a href="http://cnn.com">Slurp N Fresh</a>'
    menu0[1]='<a href="http://msnbc.com">Slurp N Fresh Directions</a>'
    menu0[2]='<a href="http://news.bbc.co.uk">Pet Dental Care Tips</a>'

    //Contents for menu 1
    var menu1=new Array()
    menu1[0]='<a href="images/ef100a.jpg" rel="thumbnail">Get The Odor Out Pet Formula</a>'
    menu1[1]='<a href="http://www.freewarejava.com">Get The Odor Out Skunk Formula</a>'
    menu1[2]='<a href="http://codingforums.com">Get The Odor Out Sport Formula</a>'
    menu1[3]='<a href="http://www.cssdrive.com">Get The Odor Out Commercial Formula</a>'

    //Contents for menu 2, and so on
    var menu2=new Array()
    menu2[0]='<a href="http://cnn.com">SR-40 Stain Remover</a>'
    menu2[1]='<a href="http://msnbc.com">SR-40 Stain Remover Directions</a>'
    menu2[2]='<a href="http://news.bbc.co.uk">Stain removal Tips</a>'


    //Contents for menu 2, and so on
    var menu3=new Array()
    menu3[0]='<a href="http://cnn.com">3 In 1 Shampoos</a>'
    menu3[1]='<a href="http://msnbc.com">3 In 1 Colonges, Conditioners, and Detanglers</a>'



    var menuwidth='165px' //default menu width
    var menubgcolor='white' //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>

    </head>


    <body>
    <body background="images/wall.jpg" bgcolor="#00FFFF" text="#000080" link="#008000" vlink="#000080" alink="#00FF00">


    <div id="container">
    <div id="header">


    <ul>
    <li><a href="http://www.freewebsitetemplates.com">Home</a></li>

    <li><a href="http://www.freewebsitetemplates.coonClick="return clickreturnvalue()"m" onMouseover="dropdownmenu(this,

    event, menu1, '150px')" onMouseout="delayhidemenu()">Odor Products</a></li>

    <li><a href="http://www.freewebsitetemplates.com" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this,

    event, menu2, '150px')" onMouseout="delayhidemenu()">Stain Remover</a></li>

    <li><a href="http://www.freewebsitetemplates.com" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this,

    event, menu0, '150px')" onMouseout="delayhidemenu()">Pet Breath Freshener</a></li>

    <li><a href="http://www.freewebsitetemplates.com" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this,

    event, menu3, '150px')" onMouseout="delayhidemenu()">Shampoos and Colonge</a></li>


    </ul>
    </div>

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,925
    Thanks
    43
    Thanked 3,190 Times in 3,154 Posts
    Blog Entries
    12

    Default

    Quote Originally Posted by Sir Twonish View Post
    1) Script Title:

    2) Script URL (on DD):
    Warning: Please include a link to the DD script in question in your post. See this thread for the proper posting format when asking a question.


    Please post a link to the page on your site that contains the problematic code so we can check it out.


    Your page/code is in violation of Dynamic Drive's usage terms, which, among other things, state that the script credit must appear in the source code of the page(s) using the script. Please reinstate the notice first.


    Without the resources (scripts and images) for the code you give, it is hard to diagnose this. That's why I ask for a link to your page and a link to the scripts on DD.

    To avoid a DD usage terms violation, you need to include the script credit for the thumbnail script. I know that perhaps your actual page may have it, but I don't see it in your code from your post.

    Just in general, the thumbnail script needs to initialize the content from the menu script, but the menu script only adds the content to the page on demand, not as the page is loading as is expected by the thumbnail script.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

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
  •