Drop Down Menus slow?

I copies a drop down menu I use on my website to my wife’s website, but on hers it’s very slow to activate. Have to hold the arrow over the link for a moment or two. What would cause that to happen?

Too many possibilities to enumerate. Link?

As Black Max said above we can’t really guess without seeing the menu in action or at least a demo of the menu with the bug in place.:slight_smile:

Provide a link and we’ll take a look.

This has not been uploaded yet, and there are more changes to be made, but here is what I have so far. The links are not in place yet as far as categories, etc…


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta name="keywords" content="Food, Photography, Inquisitive Eye, Fay Stout">
        



<title>Photos</title>
<style type="text/css">

table {
margin: 20px;

}

 p:first-letter 
{font-size: large;
color: black;
}
 


img {
   border: 4px solid white;
   margin: 20px;
   }
   
   
   padding-left: 30px
   padding-right: 50px;
   margin: 20px;
  


   
   body{font-family: Verdana; impress;}
   
   h1 {font-size: 25px;}
   h2 {font-size: 35px;}
   h3 {font-size: 30px;}
  h4 {font-size: 20px:}
  
  text {font-weight: bold;}
  
  
   p
{
padding: 0;
margin: 0;
text-align: center;
font-weight: bold;

}
 
  
  
  #navbar {
   margin: 0;
   padding: 0;
   height: 1em; }
   
#navbar li {
   list-style: none;
   float: left; 
   }
   
#navbar li a {

   display: block;
   padding:  8px;
   background-color: black;
   color: #000;

   text-decoration: none; 
     }
   
#navbar li ul {
   display: none; 
   
   width: 10em; /* Width to help Opera out */
   background-color:  #69f;}
   
#navbar li:hover ul, #navbar li.hover ul {
   display: block;
   position: absolute;
   margin: 0;
   padding: 0; 
  
}
   
#navbar li:hover li, #navbar li.hover li {
   float: none; }
   
#navbar li:hover li a, #navbar li.hover li a {
   background-color: black;
   border-bottom: 1px solid #fff;
   color: #000; 
  }

#navbar li li a:hover {
   background-color: #8db3ff; }
 

 
 
     
  </style>
  </head>
  

 
  


 

   
 
<body>
 
 
<body bgcolor="black">




<div id="wrap">

    
      <ul id="navbar">
      
      <b>
      <!-- The strange spacing herein prevents an IE6 whitespace bug. -->
<font color="#8A360F">
      <li><a href="index.html"><font color="white">Home</a></li>
<li><a href="biophoto.html"><font color="white">Artist Bio</a></li>
      <li><a href="France.html"><font color="white">France</a>
      <ul>
      <li><a href="France2.html"><font color="red">Provence</a></li>
      <li><a href="France2.html"><font color="red">Brittany</a></li>
      <li><a href="France2.html"><font color="red">Normandy</a></li>
      <li><a href="France2.html"><font color="red">Languedoc</a></li>
      <li><a href="France2.html"><font color="red">Basque</a></li>
      <li><a href="France2.html"><font color="red">Paris</a></li>
      </ul>
      
         <li><a href="#"><font color="white">Travel</a>
     <ul>
      <li><a href="Travel.html"><font color="red">Texas Hill Country</a></li>
      <li><a href="Travel2.html"><font color="red">Louisana</a></li>
                    <li><a href="Travel3.html"><font color="red">Mexico</a></li>
                    <li><a href="Travel.html"><font color="red">Arkansas</a></li>
                    <li><a href="Travel2.html"><font color="red">Oregon</a></li>
                    
    </ul>
    
        <li><a href="Nature.html"><font color="white">Nature</a>
        <ul>
        <li><a href="Nature.html"><font color="red">Flowers & Fauna</a></li>
                    <li><a href="Photos2.html"><font color="red">Spiders</a></li>
                    <li><a href="Photos3.html"><font color="red">Butterflies</a></li>
                    <li><a href="Photos4.html"><font color="red">Landscapes</a></li>
                    
    </ul>

         </li>
        <li><a href="Research.html"><font color="white">Food</a></li>
        <li><a href="equipment.html"><font color="white">Portraits</a></li>
        <li><a href="Coinhunting.html"><font color="white">Black & White</a></li>   
        <li><a href="Clubs.html"><font color="white">Abstract</a></li>   
    
        <li><a href="Scattershooting.html"><font color="white">World Today</a></li>
    
        <li><a href="Malamute.html"><font color="white">In The Field</a></li>
        
        <li><a href="Latest.html"><font color="white">My Message</a></li>
        
        
        <li><a href="http://users3.smartgb.com/g/g.php?a=s&i=g35-69865-a1"><font color="white">Guest Book</a></li>
        </ul> 
    
    
      
   </div>      



<br>









<h2 align="center"><font color="white">Food</h2></center>
<h4 align="center"><font color="red">Click image to view full size</a></center>
<br>
<body bgcolor="black">
<a href="thumbs/IMG_1819thumb.jpg"><img src="http://www.sitepoint.com/forums/images/IMG_1819.jpg" width="225" height="165" border="0"></a>
<a href="thumbs/IMG_2507thumb.jpg"><img src="http://www.sitepoint.com/forums/images/IMG_2507.jpg" width="225" height="165" border="0"></a>
<a href="thumbs/IMG_1863_1thumb.jpg"><img src="http://www.sitepoint.com/forums/images/IMG_1863_1.jpg" width="225" height="165" border="0"></a>
<a href="thumbs/IMG_9494thumb.jpg"><img src="http://www.sitepoint.com/forums/images/IMG_9494.jpg" width="225" height="165" border="0"></a>
<a href="thumbs/IMG_2019_1thumb.jpg"><img src="http://www.sitepoint.com/forums/images/IMG_2019_1.jpg" width="225" height="165" border="0"></a>
<a href="thumbs/IMG_1821thumb.jpg"><img src="http://www.sitepoint.com/forums/images/IMG_1821.jpg" width="225" height="165" border="0"></a>
<a href="thumbs/IMG_1820thumb.jpg"><img src="http://www.sitepoint.com/forums/images/IMG_1820.jpg" width="225" height="165" border="0"></a>
<a href="thumbs/IMG_0811thumb.jpg"><img src="http://www.sitepoint.com/forums/images/IMG_0811.jpg" width="225" height="165" border="0"></a>
<a href="thumbs/IMG_2510thumb.jpg"><img src="http://www.sitepoint.com/forums/images/IMG_2510.jpg" width="225" height="165" border="0"></a>
<a href="thumbs/IMG_2018_1thumb.jpg"><img src="http://www.sitepoint.com/forums/images/IMG_2018_1.jpg" width="225" height="165" border="0"></a>
<a href="thumbs/IMG_2016thumb.jpg"><img src="http://www.sitepoint.com/forums/images/IMG_2016.jpg" width="225" height="165" border="0"></a>
<a href="thumbs/IMG_2360thumb.jpg"><img src="http://www.sitepoint.com/forums/images/IMG_2360.jpg" width="225" height="165" border="0"></a>
<a href="thumbs/capuccinothumb.jpg"><img src="http://www.sitepoint.com/forums/images/capuccino.jpg" width="225" height="165" border="0"></a>
<a href="thumbs/IMG_2044_1thumb.jpg"><img src="http://www.sitepoint.com/forums/images/IMG_2044_1.jpg" width="225" height="165" border="0"></a>
<a href="thumbs/IMG_2031thumb.jpg"><img src="http://www.sitepoint.com/forums/images/IMG_2031.jpg" width="225" height="165" border="0"></a>

<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>







  
   
   </body>
   </html>

In the words of a well known song “Stop Right there - before you go any further…” :slight_smile:

You can’t really abuse code like that and get away scott free I’m afraid.:wink:

Remove all the font tags and erroneous elements from that page.


      [B]  <b>
        <!-- The strange spacing herein prevents an IE6 whitespace bug. -->
        <font color="#8A360F">[/B]
        <li><a href="index.html"><font color="white">Home</a></li>
        <li><a href="biophoto.html"><font color="white">Artist Bio</a></li>


What’s that lone b element doing there and what are those deprecated font tags doing in there. You have a perfectly good “a” element that can be styled directly so there is no need for other tags especially the deprecated and badly nested font tag of all things.

Remove them all and start again with clean code.

Why have you got two opening body tags in there also?

This section is also broken.


<br>
<h2 align="center"><font color="white">Food</h2>
</center>
<h4 align="center">
<font color="red">Click image to view full size</a>
</center>
<br>


It should be:


<h2>Food</h2>
<p>Click image to view full size</p>


Dont use align=center and don’t use the center tag as it all be styled to suit with css as required.

All your thumbs should be in a list and not bare anchors next to each other. I assume those images are optimised and not a massive file size also.

The javascript for IE6 seems to be missing also.

However none of the above may explain the delay problem and may be an issue with something else on the page such as a script holding things up or images that are too heavy.

The only real way we could debug is by seeing the page itself. Although I strongly suggest though that you clean that code up as broken tags can cause strange things to happen in various browsers.

Paul hit the highlights – this is a NASTY case of “help, my outdated invalid markup doesn’t work”… many of us are thinking to ourselves “herpadurp” on that.

To add to what he said, not only are there tags placed incorrectly – like font and center, those tags have NO BUSINESS even being on a page that has a strict doctype!!! They’re what’s called “deprecated” – as in “do not use”.

It gets worse the further you dig – MULTIPLE body tags (you can only have one <body> and one </body> on a page), attributes that don’t even exist in STRICT like bgcolor, line breaks probably doing padding’s job, multiple unclosed tags, heading tags around elements that don’t actually appear to be headings…

It’s a total train wreck that I wouldn’t even try to salvage code from.

Again, thanks…I guess. I will go back to drawing board and try to learn new tricks. Is there no hope for a 70 year old who took a course or two, and now finds that what he learned is no longer valid?

Understand that the only constant is change, but I sometimes wonder if all this is really necessary. Being the old fart I am I cannot understand why rules are constantly changing, and who is the beneficiary of all this?

And yes, I am a cynic!

Yes there’s always hope :slight_smile: I’m 60 next year so I’m not that far behind you.

There is always a wrong way to do something and a right way to do something and if we don’t point it out then no one benefits.

All the above comments were meant constructively and to motivate you to do something about them. It’s only by getting your hands dirty that you will get on top of this stuff.

Don’t get disheartened but just roll your sleeves up and dive in.

Understand that the only constant is change, but I sometimes wonder if all this is really necessary. Being the old fart I am I cannot understand why rules are constantly changing, and who is the beneficiary of all this?

Some things haven’t changed. Bad code was always bad code - It’s just that we know better these days. The beneficiary will be first yourself as you will have cleaner and easier code to manage and the second beneficiary will be your visitors who get a cleaner, lighter and more accessible site. It’s a win win situation from all aspects :slight_smile:

If you don’t know how some parts should be coded then just shout and we’ll show you how to do it. Everyone has to learn the right way so there is no shame in not knowing and as Jason (deathshadow) said in a previous post “the only stupid question to ask is the one that you already know the answer to”.