Skip to main content
Known Participant
November 13, 2012
Answered

i am trying to add lightbox widget to my site but its not working NEED HELP

  • November 13, 2012
  • 1 reply
  • 23006 views

i can create the light box widget as a new page but when i paste the codes into the actual site it will not work and the images will not enlarge

what or where did i go wrong.  This is all the codes for the site including the lightbox widget. i can use all the help i can get even if some one or anyone

can show me the corrections i need to fix that would be great i am using dreamweaver cs6 incase you need to know...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<title>MachoMan Madness</title>

<map name="11_1x1">

<area shape="rect" coords="474,138,578,150" href="http://macho-madness.net" alt="">

<area shape="rect" coords="606,136,712,150" href="mailto:admin@macho-madness.net" alt="">

<area shape="rect" coords="737,136,835,152" href="http://daxstudios.net" alt="">

</map>

<style type="text/css">

<!--

.index{

          margin:0px;

          padding:0px;

          border:0px;

          background-image:url(back.jpg);

          background-repeat:repeat-x;

          background-color: #f5f5f5;

}

h1{

          margin:0px;

          padding:15px;

          background-color:#222;

          font-family: Verdana, Geneva, sans-serif;

          font-size: 20px;

          line-height: 25px;

          color: #c8c8c8;

          letter-spacing:-1px;

}

h2{

          margin:0px;

          padding:10px;

          background-color:#333;

          font-family: Verdana, Geneva, sans-serif;

          font-size: 14px;

          line-height: 15px;

          color: #c8c8c8;

          letter-spacing:-1px;

}

p {

          padding:3px;

          padding-top:0px;

          font-family: Verdana, Geneva, sans-serif;

          font-size: 13px;

          line-height: 20px;

          color: #777;

          text-align:justify;

}

b, strong {color: #7fa0af;}

em {color: #555;}

u {color: #555;}

a:link, a:visited, a:active {text-decoration:none;color: #ada295;}

a:hover {text-decoration:none;color:#c8c8c8;}

-->

</style>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>Lightbox Gallery : grey</title>

<script type='text/javascript' src='scripts/jquery.js'></script>

<script type='text/javascript' src='scripts/lightbox.js'></script>

<link type='text/css' href='css/lightbox.css' rel='stylesheet'/>

<link type='text/css' href='css/sample_lightbox_layout.css' rel='stylesheet'/>

<style type="text/css">

.lbGallery {

                              /*gallery container settings*/

                              background-color: #666666;

                              padding-left: 20px; 

                              padding-top: 20px; 

                              padding-right: 20px; 

                              padding-bottom: 20px; 

                              width: 540px;

                              height: auto;

                              text-align:left;

                              box-shadow: 10px 10px 10px black;

                              border-radius: 20px;

                              margin-left:auto;

                              margin-right:auto;

                    }

                    .lbGallery ul { list-style: none; margin:0;padding:0; }

                    .lbGallery ul li { display: inline;margin:0;padding:0; }

                    .lbGallery ul li a{text-decoration:none;}

 

                    .lbGallery ul li a img {

                              /*border color, width and margin for the images*/

                              border-color: #ffffff;

                              border-left-width: 10px;

                              border-top-width: 10px;

                              border-right-width: 10px;

                              border-bottom-width: 20px;

                              margin-left:5px;

                              margin-right:5px;

                              margin-top:5px;

                              margin-bottom:5px:

                              }

 

                    .lbGallery ul li a:hover img {

                              /*background color on hover*/

                              border-color: #cccccc;

                              border-left-width: 10px;

                              border-top-width: 10px;

                              border-right-width: 10px;

                              border-bottom-width: 20px;

                    }

 

                    #lightbox-container-image-box {

                              border-top: 2px solid #ffffff;

                              border-right: 2px solid #ffffff;

                              border-bottom: 2px solid #ffffff;

                              border-left: 2px solid #ffffff;

                              }

 

                    #lightbox-container-image-data-box {

                              border-top: 0px;

                              border-right: 2px solid #ffffff;

                              border-bottom: 2px solid #ffffff;

                              border-left: 2px solid #ffffff;

                              }

</style>

</head>

<body class="index">

<!-- Begin Table -->

<table border="0" cellpadding="0" cellspacing="0" width="909" align="center">

<tr>

<td rowspan="1" colspan="3" width="909" height="166">

          <img name="a10" src="11_1x1.jpg" usemap="#11_1x1"  width="909" height="166" border="0" alt="" /></td>

</tr>

<tr>

<td rowspan="1" colspan="1" width="54" height="320">

          <img name="a11" src="11_2x1.jpg" width="54" height="320" border="0" alt="" /></td>

<td rowspan="1" colspan="1" width="796" height="320" background="11_2x2.jpg">

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

          <style type="text/css">a#vlb{display:none}</style>

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

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

          <div id="wowslider-container1">

          <div class="ws_images">

<span><img src="slides/9.jpg" alt="" title="" id="wows0"/></span>

<span><img src="slides/2.jpg" alt="" title="" id="wows1"/></span>

<span><img src="slides/3.jpg" alt="" title="" id="wows2"/></span>

<span><img src="slides/4.jpg" alt="" title="" id="wows3"/></span>

<span><img src="slides/5.jpg" alt="" title="" id="wows4"/></span>

<span><img src="slides/6.jpg" alt="" title="" id="wows5"/></span>

<span><img src="slides/7.jpg" alt="" title="" id="wows6"/></span>

<span><img src="slides/8.jpg" alt="" title="" id="wows7"/></span>

<span><img src="slides/1.jpg" alt="" title="" id="wows8"/></span>

</div>

<div class="ws_bullets"><div>

<a href="#wows0" title="">1</a>

<a href="#wows1" title="">2</a>

<a href="#wows2" title="">3</a>

<a href="#wows3" title="">4</a>

<a href="#wows4" title="">5</a>

<a href="#wows5" title="">6</a>

<a href="#wows6" title="">7</a>

<a href="#wows7" title="">8</a>

<a href="#wows8" title="">9</a>

</div></div></div></div>

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

<td rowspan="1" colspan="1" width="59" height="320">

          <img name="a13" src="11_2x3.jpg" width="59" height="320" border="0" alt="" /></td>

</tr>

<tr>

<td rowspan="1" colspan="3" width="909" height="63">

          <img name="a14" src="11_3x1.jpg" width="909" height="63" border="0" alt="" /></td>

</tr>

</table>

<!-- End Table -->

<table width="840" border="0" cellspacing="0" cellpadding="0" align="center">

  <tr>

   <td class="mainlink">

<center>

<!--drop down menu start HTML-->

<link rel="stylesheet" type="text/css" href="ddlevelsfiles/ddlevelsmenu-base.css" />

<link rel="stylesheet" type="text/css" href="ddlevelsfiles/ddlevelsmenu-topbar.css" />

<link rel="stylesheet" type="text/css" href="ddlevelsfiles/ddlevelsmenu-sidebar.css" />

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

<div id="ddtopmenubar" class="mattblackmenu">

<ul>

<li><a target=main href="index.html">Home</a></li>

<li><a target=main href="#" rel="ddsubmenu2">Biography</a></li>

<li><a target=main href="#" rel="ddsubmenu3">To Be Lead</a></li>

<li><a target=main href="#" rel="ddsubmenu4">Gallery</a></li>

<li><a target=main href="#">Videos</a></li>

<li><a target=main href="#">Memorial Page</a></li>

<li><a target=main href="#">Wallpaper</a></li>

<li><a target=main href="#">Shop</a></li>

<li><a target=main href="#">Blog</a></li>

<li><a target=main href="#">Join Us</a></li>

<li><a target=main href="#">Contact</a></li>

</ul>

</div>

<script type="text/javascript">

ddlevelsmenu.setup("ddtopmenubar", "topbar") //ddlevelsmenu.setup("mainmenuid", "topbar|sidebar")

</script>

<!--Biography HTML-->

<ul id="ddsubmenu2" class="ddsubmenustyle">

<li><a target=main href="randy savage bio.html">Randy Savage Bio</a></li>

<li><a target=main href="Randy facts 101.html">Randy's Facts 101</a></li>

<li><a target=main href="his early career.html">His Early Career</a></li>

<li><a target=main href="Randys career in wwf.html">Randy's Career in the WWF</a></li>

<li><a target=main href="randys career wcw.html">Randy's Career in WCW</a></li>

<li><a target=main href="#">The Mega Powers </a>

  <ul>

  <li><a target=main href="mega powers bio.html">Mega powers Bio</a></li>

  <li><a target=main href="mega powers facts 101.html">Mega Powers Facts 101</a></li>

  </ul>

</li>

<li><a target=main href="pm from randy.html">PM to fans & Elizabeth</a></li>

<li><a target=main href="#">Randy's Radio interview</a></li>

<li><a target=main href="#">His Death</a></li>

</ul>

<!--To be Lead HTML-->

<ul id="ddsubmenu3" class="ddsubmenustyle">

<li><a target=main href="#">Elizabeth Hulette</a>

  <ul>

  <li><a target=main href="#">Elizabeth Bio</a></li>

  <li><a target=main href="#">Elizabeth Facts 101</a></li>

  <li><a target=main href="#">Her Career in the WWF</a></li>

  <li><a target=main href="#">Her Career in WCW</a></li>

  <li><a target=main href="#">Later Life</a></li>

  <li><a target=main href="#">Farewell to a Princess</a></li>

  <li><a target=main href="#">Elizabeth's Radio Interview</a></li>

  <li><a target=main href="#">Elizabeth Death</a></li>

  </ul>

</li>

<li><a target=main href="#">Sherri Martel</a></li>

<li><a target=main href="#">Gorgeous George</a></li>

<li><a target=main href="#">Team Madness</a></li>

</ul>

<!--Photo Gallery HTML-->

<ul id="ddsubmenu4" class="ddsubmenustyle">

<li><a target=main href="#">Early Years</a></li>

<li><a target=main href="#">ICW Gallery</a></li>

<li><a target=main href="#">WWF Gallery</a></li>

<li><a target=main href="#">WCW Gallery</a></li>

<li><a target=main href="#">NWO Gallery</a></li>

</ul>

<!--drop down menu end HTML-->

</center>

</td>

  </tr>

</table>

<br><Br>

<table width="840" border="0" cellspacing="0" cellpadding="0" align="center">

  <tr>

    <td>

   

    <!-- Start Page Content-->

   

   

    <h1>Early Years Gallery</h1>

<div id="gallery" class="lbGallery">

                              <ul>

                                        <li>

                                                  <a href="images/images (11).jpg" title=""><img src="images/images (11)_thumb.jpg" width="72" height="72" alt="Flower" /></a>

                                        </li>

                                        <li>

                                                  <a href="images/images (16).jpg" title=""><img src="images/images (16)_thumb.jpg" width="72" height="72" alt="Tree" /></a>

                                        </li>

                                        <li>

                                                  <a href="images/images (17).jpg" title=""><img src="images/images (17)_thumb.jpg" width="72" height="72" alt="" /></a>

                                        </li>

                                        <li>

                                                  <a href="images/images (18).jpg" title=""><img src="images/images (18)_thumb.jpg" width="72" height="72" alt="" /></a>

                                        </li>

                                        <li>

                                                  <a href="images/images (19).jpg" title=""><img src="images/images (19)_thumb.jpg" width="72" height="72" alt="" /></a>

                                        </li>

                <li>

                                                  <a href="images/images (20).jpg" title=""><img src="images/images (20)_thumb.jpg" width="72" height="72" alt="Flower" /></a>

                                        </li>

                                        <li>

                                                  <a href="images/images (22).jpg" title=""><img src="images/images (22)_thumb.jpg" width="72" height="72" alt="Tree" /></a>

                                        </li>

                                        <li>

                                                  <a href="images/images (23).jpg" title=""><img src="images/images (23)_thumb.jpg" width="72" height="72" alt="" /></a>

                                        </li>

                                        <li>

                                                  <a href="images/images (25).jpg" title=""><img src="images/images (25)_thumb.jpg" width="72" height="72" alt="" /></a>

                                        </li>

                                        <li>

                                                  <a href="images/images (27).jpg" title=""><img src="images/images (27)_thumb.jpg" width="72" height="72" alt="" /></a>

                                        </li>

                <li>

                                                  <a href="images/images (29).jpg" title=""><img src="images/images (29)_thumb.jpg" width="72" height="72" alt="Flower" /></a>

                                        </li>

                                        <li>

                                                  <a href="images/images (30).jpg" title=""><img src="images/images (30)_thumb.jpg" width="72" height="72" alt="Tree" /></a>

                                        </li>

                                        <li>

                                                  <a href="images/images (31).jpg" title=""><img src="images/images (31)_thumb.jpg" width="72" height="72" alt="" /></a>

                                        </li>

                                        <li>

                                                  <a href="images/images (32).jpg" title=""><img src="images/images (32)_thumb.jpg" width="72" height="72" alt="" /></a>

                                        </li>

                                        <li>

                                                  <a href="images/images.jpg" title=""><img src="images/images_thumb.jpg" width="72" height="72" alt="" /></a>

                                        </li>

                <li>

 

  </ul>

            </div>

<script type="text/javascript">

$(function(){

                              $('#gallery a').lightBox({

                                        imageLoading:                              'images/lightbox/lightbox-ico-loading.gif',                    // (string) Path and the name of the loading icon

                                        imageBtnPrev:                              'images/lightbox/lightbox-btn-prev.gif',                              // (string) Path and the name of the prev button image

                                        imageBtnNext:                              'images/lightbox/lightbox-btn-next.gif',                              // (string) Path and the name of the next button image

                                        imageBtnClose:                              'images/lightbox/lightbox-btn-close.gif',                    // (string) Path and the name of the close btn

                                        imageBlank:                                        'images/lightbox/lightbox-blank.gif',                              // (string) Path and the name of a blank image (one pixel)

                                        fixedNavigation:                    true,                    // (boolean) Boolean that informs if the navigation (next and prev button) will be fixed or not in the interface.

                                        containerResizeSpeed:          400,                               // Specify the resize duration of container image. These number are miliseconds. 400 is default.

                                        overlayBgColor:                     "#cccccc",                    // (string) Background color to overlay; inform a hexadecimal value like: #RRGGBB. Where RR, GG, and BB are the hexadecimal values for the red, green, and blue values of the color.

                                        overlayOpacity:                              .6,                    // (integer) Opacity value to overlay; inform: 0.X. Where X are number from 0 to 9

                                        txtImage:                                        'Image',                                        //Default text of image

                                        txtOf:                                                  'of'

                              });

                    });

</script>

     

    <div align="left"></div>

</p>

   

   

    <!-- End Page Content-->

   

    </td>

  </tr>

</table>

<br><br><bR>

<div style="background-color:#222;width:100%;"><bR>

<table width="870" border="0" cellspacing="10" cellpadding="0" align="center">

  <tr>

   <td width="35%" valign="top">

<h2>Site Disclaimer</h2>

<p><strong>Macho-madness</strong> is in no way in contact with World Wrestling Entertainment. All photos are copyright to World Wrestling Entertainment or their respective owners and is being used under the fair copyright of Law 107.</p>

<p><font color="#000000">©macho-madness.net All right's Reserved.</font> </p>

   </div></td>

    <td width="35%" valign="top">

<h2>Offical Links</h2>

<div align="center">

  <table width="269" border="0">

    <tr>

      <td width="94"><div align="center"><a href="https://www.facebook.com/TheMadnessWillNeverBeForgotten"><img src="fb logo.jpg" width="94" height="87" alt="fb logo" longdesc="http://www.macho-madness.net" /></a></div></td>

      <td width="76"><div align="center"><a href="https://twitter.com/machomadnessnet"><img src="twitter logo.jpg" width="76" height="91" alt="twitter logo" longdesc="http://www.macho-madness.net" /></a></div></td>

      <td width="85"><div align="center"><a href="http://pinterest.com/machomadness/"><img src="pinterest logo.jpg" width="79" height="87" alt="pin logo" longdesc="http://www.macho-madness.net" /></a></div></td>

      </tr>

    <tr>

      <td><div align="center"><a href="https://vimeo.com/user13202435"><img src="vimeo.jpg" width="98" height="90" alt="vimeo" longdesc="http://www.macho-madness.net" /></a></div></td>

      <td><div align="center"><a href="http://www.youtube.com/user/mich0679"><img src="youtube logo.jpg" width="83" height="95" alt="youtube logo" longdesc="http://www.macho-madness.net" /></a></div></td>

      <td><div align="center"></div></td>

      </tr>

  </table>

</div>

</div></td><td width="29%" valign="top">

<h2>About Us</h2>

<p>Macho-madness.net is the  place for all things Randy Savage and is dedicated to the &quot;Memories of Randy Savage.&quot;  We hope you'll take some time to look around and relive some classic moment's from Randy's long time career, and Enjoy!</p>

</td></tr></table></div>

</body>

</html>

This topic has been closed for replies.
Correct answer Jon Fritz

The external css and javascript files?

No, absolutely not. The style tags you are using are for embedded css, there shouldn't be anything other than css between them.

You already have all of the links in your head section (post #22 above). The physical files those links go to just need to be uploaded to their given locations on the server.

You will have three folders named: css, ddlevelfiles and scripts. Inside those folders are all the css and javascript files being called by your external stylesheet and javascript links. If you upload the folders, all of the files within them will be uploaded and the links in your page "should" start using them correctly.


Don't forget to complete the change from post #28 above. I'm still seeing the broken css and missing <style> tag.

1 reply

Jon Fritz
Community Expert
Community Expert
November 13, 2012

Your code has 83+ errors, some are nothing special, others are structural and will cause issues.

Run your page through this validator and repair the errors...

http://validator.w3.org/#validate_by_input

Once the errors are gone, if it still doesn't work correctly, post a link to your page here and we can take a closer look.

Jon Fritz
Community Expert
Community Expert
November 13, 2012

A couple of the most obvious structural issues I see are no starting <html> or <head>.

Add in...

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

Then your <title> and style info.

You also have two <title> tag sets, you can only have one.

You have a map and area coordinates in by your style info, that should not be in the <head> of the page and needs to be moved to the body. Also your <area> tags need to be closed with /> not the >

HTML element names and ids cannot start with a number, so any that you have that start out with a number need to be changed.

You also have a couple instances where you see a name in the attributes, but no id. Your doctype wants both (they need to be the same as well). Anytime you have something like <map name="11_1x1"> add in an id like this <map name="11_1x1" id="11_1x1">

There are then a bunch of target attributes written as target=main in your links that need to be target="main" (with quotes) as long as you have something named "main" that is being targeted. If you are just trying to keep the links from going to another page, <a href="#"> is enough.

All of your <br> tags need to be changed to <br /> (watch caps here, all html tags in your chosen doctype need to be lower case)

The "circle-c" for copyright needs to be changed to &copy; in the source

Special characters in file names should be avoided. You should only ever use letters, numbers and underscores or hypens. I see a lot of () in the names of your images. It "shoulnd't" be a problem, but it's best practice to stick to alpha-numeric with - and _ instead of spaces.

That should give you a good start. Once those are taken care of, run the validator again and the remaining issues should be relatively straight forward to repair.

Jon Fritz
Community Expert
Community Expert
November 14, 2012

i am up to 19 errors  i just cant seem to find the extra </div> and missing </il>

<!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>

<title>MachoMan Madness</title>

<link type='text/css' href='css/lightbox.css' rel='stylesheet'/>

<link type='text/css' href='css/sample_lightbox_layout.css' rel='stylesheet'/>

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

<link rel="stylesheet" type="text/css" href="ddlevelsfiles/ddlevelsmenu-base.css" />

<link rel="stylesheet" type="text/css" href="ddlevelsfiles/ddlevelsmenu-topbar.css" />

<link rel="stylesheet" type="text/css" href="ddlevelsfiles/ddlevelsmenu-sidebar.css" />

<body>

<script type='text/javascript' src='scripts/jquery.js'></script>

<script type='text/javascript' src='scripts/lightbox.js'></script>

<style type="text/css">

.lbGallery {

                              /*gallery container settings*/

                              background-color: #666666;

                              padding-left: 20px; 

                              padding-top: 20px; 

                              padding-right: 20px; 

                              padding-bottom: 20px; 

                              width: 540px;

                              height: auto;

                              text-align:left;

                              box-shadow: 10px 10px 10px black;

                              border-radius: 20px;

                              margin-left:auto;

                              margin-right:auto;

                    }

                    .lbGallery ul { list-style: none; margin:0;padding:0; }

                    .lbGallery ul li { display: inline;margin:0;padding:0; }

                    .lbGallery ul li a{text-decoration:none;}

 

                    .lbGallery ul li a img {

                              /*border color, width and margin for the images*/

                              border-color: #ffffff;

                              border-left-width: 10px;

                              border-top-width: 10px;

                              border-right-width: 10px;

                              border-bottom-width: 20px;

                              margin-left:5px;

                              margin-right:5px;

                              margin-top:5px;

                              margin-bottom:5px:

                              }

 

                    .lbGallery ul li a:hover img {

                              /*background color on hover*/

                              border-color: #cccccc;

                              border-left-width: 10px;

                              border-top-width: 10px;

                              border-right-width: 10px;

                              border-bottom-width: 20px;

                    }

 

                    #lightbox-container-image-box {

                              border-top: 2px solid #ffffff;

                              border-right: 2px solid #ffffff;

                              border-bottom: 2px solid #ffffff;

                              border-left: 2px solid #ffffff;

                              }

 

                    #lightbox-container-image-data-box {

                              border-top: 0px;

                              border-right: 2px solid #ffffff;

                              border-bottom: 2px solid #ffffff;

                              border-left: 2px solid #ffffff;

                              }

</style>

<style type="text/css">

<!--

.index{

          margin:0px;

          padding:0px;

          border:0px;

          background-image:url(back.jpg);

          background-repeat:repeat-x;

          background-color: #f5f5f5;

}

h1{

          margin:0px;

          padding:15px;

          background-color:#222;

          font-family: Verdana, Geneva, sans-serif;

          font-size: 20px;

          line-height: 25px;

          color: #c8c8c8;

          letter-spacing:-1px;

}

h2{

          margin:0px;

          padding:10px;

          background-color:#333;

          font-family: Verdana, Geneva, sans-serif;

          font-size: 14px;

          line-height: 15px;

          color: #c8c8c8;

          letter-spacing:-1px;

}

p {

          padding:3px;

          padding-top:0px;

          font-family: Verdana, Geneva, sans-serif;

          font-size: 13px;

          line-height: 20px;

          color: #777;

          text-align:justify;

}

b, strong {color: #7fa0af;}

em {color: #555;}

u {color: #555;}

a:link, a:visited, a:active {text-decoration:none;color: #ada295;}

a:hover {text-decoration:none;color:#c8c8c8;}

-->

</style>

<body class="index">

<!-- Begin Table -->

<table border="0" cellpadding="0" cellspacing="0" width="909" align="center">

<tr>

<td rowspan="1" colspan="3" width="909" height="166">

          <img name="a10" src="11_1x1.jpg" usemap="#11_1x1"  width="909" height="166" border="0" alt="" /></td>

</tr>

<tr>

<td rowspan="1" colspan="1" width="54" height="320">

          <img name="a11" src="11_2x1.jpg" width="54" height="320" border="0" alt="" /></td>

<td rowspan="1" colspan="1" width="796" height="320" background="11_2x2.jpg">

          <style type="text/css">a#vlb{display:none}</style>

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

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

          <div id="wowslider-container1">

          <div class="ws_images">

<span><img src="slides/9.jpg" alt="" title="" id="wows0"/></span>

<span><img src="slides/2.jpg" alt="" title="" id="wows1"/></span>

<span><img src="slides/3.jpg" alt="" title="" id="wows2"/></span>

<span><img src="slides/4.jpg" alt="" title="" id="wows3"/></span>

<span><img src="slides/5.jpg" alt="" title="" id="wows4"/></span>

<span><img src="slides/6.jpg" alt="" title="" id="wows5"/></span>

<span><img src="slides/7.jpg" alt="" title="" id="wows6"/></span>

<span><img src="slides/8.jpg" alt="" title="" id="wows7"/></span>

<span><img src="slides/1.jpg" alt="" title="" id="wows8"/></span>

</div>

<div class="ws_bullets"><div>

<a href="#wows0" title="">1</a>

<a href="#wows1" title="">2</a>

<a href="#wows2" title="">3</a>

<a href="#wows3" title="">4</a>

<a href="#wows4" title="">5</a>

<a href="#wows5" title="">6</a>

<a href="#wows6" title="">7</a>

<a href="#wows7" title="">8</a>

<a href="#wows8" title="">9</a>

</div>

          <script type="text/javascript" src="slides/script.js"></script></div></td>

<td rowspan="1" colspan="1" width="59" height="320">

          <img name="a13" src="11_2x3.jpg" width="59" height="320" border="0" alt="" /></td>

</tr>

<tr>

<td rowspan="1" colspan="3" width="909" height="63">

          <img name="a14" src="11_3x1.jpg" width="909" height="63" border="0" alt="" /></td>

</tr>

</table>

<!-- End Table -->

<table width="840" border="0" cellspacing="0" cellpadding="0" align="center">

  <tr>

   <td class="mainlink">

<center>

<!--drop down menu start HTML-->

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

<div id="ddtopmenubar" class="mattblackmenu">

<ul>

<li><a target="main" href="index.html">Home</a></li>

<li><a target="main" href="#" rel="ddsubmenu2">Biography</a></li>

<li><a target="main" href="#" rel="ddsubmenu3">To Be Lead</a></li>

<li><a target="main" href="#" rel="ddsubmenu4">Gallery</a></li>

<li><a target="main" href="#">Videos</a></li>

<li><a target="main" href="#">Memorial Page</a></li>

<li><a target="main" href="#">Wallpaper</a></li>

<li><a target="main" href="#">Blog</a></li>

<li><a target="main" href="#">Join Us</a></li>

<li><a target="main" href="#">Contact</a></li>

</ul>

</div>

<script type="text/javascript">

ddlevelsmenu.setup("ddtopmenubar", "topbar") //ddlevelsmenu.setup("mainmenuid", "topbar|sidebar")

</script>

<!--Biography HTML-->

<ul id="ddsubmenu2" class="ddsubmenustyle">

<li><a target="main" href="randy_savage_bio.html">Randy Savage Bio</a></li>

<li><a target="main" href="Randy_facts_101.html">Randy's Facts 101</a></li>

<li><a target="main" href="his_early_career.html">His Early Career</a></li>

<li><a target="main" href="Randys_career_in_wwf.html">Randy's Career in the WWF</a></li>

<li><a target="main" href="randys_career_wcw.html">Randy's Career in WCW</a></li>

<li><a target="main" href="#">The Mega Powers </a>

  <ul>

  <li><a target="main" href="mega powers bio.html">Mega powers Bio</a></il>

  <li><a target="main" href="mega powers facts 101.html">Mega Powers Facts 101</a></li>

  </ul>

</li>

<li><a target="main" href="pm from randy.html">PM to fans and Elizabeth</a></li>

<li><a target="main" href="#">Randy's Radio interview</a></li>

<li><a target="main" href="#">His Death</a></li>

</ul>

<!--To be Lead HTML-->

<ul id="ddsubmenu3" class="ddsubmenustyle">

<li><a target="main" href="#">Elizabeth Hulette</a>

  <ul>

  <li><a target="main" href="#">Elizabeth Bio</a></li>

  <li><a target="main" href="#">Elizabeth Facts 101</a></li>

  <li><a target="main" href="#">Her Career in the WWF</a></li>

  <li><a target="main" href="#">Her Career in WCW</a></li>

  <li><a target="main" href="#">Later Life</a></li>

  <li><a target="main" href="#">Farewell to a Princess</a></li>

  <li><a target="main" href="#">Elizabeth's Radio Interview</a></li>

  <li><a target="main" href="#">Elizabeth Death</a></li>

  </ul>

</li>

<li><a target="main" href="#">Sherri Martel</a></li>

<li><a target="main" href="#">Gorgeous George</a></li>

<li><a target="main" href="#">Team Madness</a></li>

</ul>

<!--Photo Gallery HTML-->

<ul id="ddsubmenu4" class="ddsubmenustyle">

<li><a target="main" href="#">Early Years</a></li>

<li><a target="main" href="#">ICW Gallery</a></li>

<li><a target="main" href="#">WWF Gallery</a></li>

<li><a target="main" href="#">WCW Gallery</a></li>

<li><a target="main" href="#">NWO Gallery</a></li>

</ul>

<!--drop down menu end HTML-->

</center>

</td>

  </tr>

</table>

<br/><br/>

<table width="840" border="0" cellspacing="0" cellpadding="0" align="center">

  <tr>

    <td>

   

    <!-- Start Page Content-->

   

    <map name="11_1x1" id="logo_11_1x1">

<area shape="rect" coords="474,138,578,150" href="http://macho-madness.net" alt=""/>

<area shape="rect" coords="606,136,712,150" href="mailto:admin@macho-madness.net" alt=""/>

<area shape="rect" coords="737,136,835,152" href="http://daxstudios.net" alt=""/>

</map>

    <h1>Early Years Gallery</h1>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<div id="gallery" class="lbGallery">

<ul>

<li><a href="images/11.jpg" title=""><img src="images/11_thumb.jpg" width="72" height="72" alt="Flower" /></a></li>

<li><a href="images/16.jpg" title=""><img src="images/16_thumb.jpg" width="72" height="72" alt="Tree" /></a></li>

<li><a href="images/17.jpg" title=""><img src="images/17_thumb.jpg" width="72" height="72" alt="" /></a></li>

<li><a href="images/18.jpg" title=""><img src="images/18_thumb.jpg" width="72" height="72" alt="" /></a></li>

<li><a href="images/19.jpg" title=""><img src="images/19_thumb.jpg" width="72" height="72" alt="" /></a></li>

<li><a href="images/20.jpg" title=""><img src="images/20_thumb.jpg" width="72" height="72" alt="" /></a></li>

<li><a href="images/22.jpg" title=""><img src="images/22_thumb.jpg" width="72" height="72" alt="" /></a></li>

<li><a href="images/23.jpg" title=""><img src="images/23_thumb.jpg" width="72" height="72" alt="" /></a></li>

<li><a href="images/25.jpg" title=""><img src="images/25_thumb.jpg" width="72" height="72" alt="" /></a></li>

<li><a href="images/27.jpg" title=""><img src="images/27_thumb.jpg" width="72" height="72" alt="" /></a></li>

<li><a href="images/29.jpg" title=""><img src="images/29_thumb.jpg" width="72" height="72" alt="Flower" /></a></li>

<li><a href="images/30.jpg" title=""><img src="images/30_thumb.jpg" width="72" height="72" alt="Tree" /></a></li>

<li><a href="images/31.jpg" title=""><img src="images/31_thumb.jpg" width="72" height="72" alt="" /></a></li>

<li><a href="images/32.jpg" title=""><img src="images/32_thumb.jpg" width="72" height="72" alt="" /></a></li>

<li><a href="images/images.jpg" title=""><img src="images/images_thumb.jpg" width="72" height="72" alt="" /></a></li>

  </ul>

</div>

<script type="text/javascript">

$(function(){

                              $('#gallery a').lightBox({

                                        imageLoading:                              'images/lightbox/lightbox-ico-loading.gif',                    // (string) Path and the name of the loading icon

                                        imageBtnPrev:                              'images/lightbox/lightbox-btn-prev.gif',                              // (string) Path and the name of the prev button image

                                        imageBtnNext:                              'images/lightbox/lightbox-btn-next.gif',                              // (string) Path and the name of the next button image

                                        imageBtnClose:                              'images/lightbox/lightbox-btn-close.gif',                    // (string) Path and the name of the close btn

                                        imageBlank:                                        'images/lightbox/lightbox-blank.gif',                              // (string) Path and the name of a blank image (one pixel)

                                        fixedNavigation:                    true,                    // (boolean) Boolean that informs if the navigation (next and prev button) will be fixed or not in the interface.

                                        containerResizeSpeed:          400,                               // Specify the resize duration of container image. These number are miliseconds. 400 is default.

                                        overlayBgColor:                     "#cccccc",                    // (string) Background color to overlay; inform a hexadecimal value like: #RRGGBB. Where RR, GG, and BB are the hexadecimal values for the red, green, and blue values of the color.

                                        overlayOpacity:                              .6,                    // (integer) Opacity value to overlay; inform: 0.X. Where X are number from 0 to 9

                                        txtImage:                                        'Image',                                        //Default text of image

                                        txtOf:                                                  'of'

                              });

                    });

</script>

     

    <div align="left"></div>

   

   

    <!-- End Page Content-->

   

    </td>

  </tr>

</table>

<br/><br/><br/>

<div style="background-color:#222;width:100%;"><br/>

<table width="870" border="0" cellspacing="10" cellpadding="0" align="center">

<tr>

   <td width="35%" valign="top">

<h2>Site Disclaimer</h2>

<p><strong>Macho-madness</strong> is in no way in contact with World Wrestling Entertainment. All photos are copyright to World Wrestling Entertainment or their respective owners and is being used under the fair copyright of Law 107.</p>

<p><font color="#000000">&copy;macho-madness.net All right's Reserved.</font> </p>

   </tr></div>

    <td width="35%" valign="top">

<h2>Offical Links</h2>

<div align="center">

  <table width="269" border="0">

    <tr>

      <td width="94"><div align="center"><a href="https://www.facebook.com/TheMadnessWillNeverBeForgotten"><img src="fb logo.jpg" width="94" height="87" alt="fb logo" longdesc="http://www.macho-madness.net" /></a></div></td>

      <td width="76"><div align="center"><a href="https://twitter.com/machomadnessnet"><img src="twitter logo.jpg" width="76" height="91" alt="twitter logo" longdesc="http://www.macho-madness.net" /></a></div></td>

      <td width="85"><div align="center"><a href="http://pinterest.com/machomadness/"><img src="pinterest logo.jpg" width="79" height="87" alt="pin logo" longdesc="http://www.macho-madness.net" /></a></div></td>

      </tr>

    <tr>

      <td><div align="center"><a href="https://vimeo.com/user13202435"><img src="vimeo.jpg" width="98" height="90" alt="vimeo" longdesc="http://www.macho-madness.net" /></a></div></td>

      <td><div align="center"><a href="http://www.youtube.com/user/mich0679"><img src="youtube logo.jpg" width="83" height="95" alt="youtube logo" longdesc="http://www.macho-madness.net" /></a></div></td>

      <td><div align="center"></div></td>

      </tr>

  </table>

</div>

</td>

<td width="29%" valign="top">

<h2>About Us</h2>

<p>Macho-madness.net is the  place for all things Randy Savage and is dedicated to the &quot;Memories of Randy Savage.&quot;  We hope you'll take some time to look around and relive some classic moment's from Randy's long time career, and Enjoy!</p>

</body>

</html>


Remove the duplicate opening <body> tag in between your head section scripts and link tags, then change...

</style>

<body class="index">

<!-- Begin Table -->

to

</style>

</head>

<body class="index">

<!-- Begin Table -->

That will drop it to 12 errors...

move...

<style type="text/css">a#vlb{display:none}</style>

from the body to the head section.

Change

Mega powers Bio</a></il>

to

Mega powers Bio</a></li>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

must be between the <head></head> tags