Help - Search - Members - Calendar
Full Version: Flash Menu help
HTMLHelp Forums > Web Authoring > Graphics, Flash and Multimedia
stc23
Apr 7 2008, 01:36 PM
I am using Visual Infinite Menus, and i have made a menu but i need to have three menu buttons on one line and three menu buttons on the other line, like this,

IPB Image

here is what it looks like now

IPB Image

here is the html menu if i can change it from there

CODE
<html>
<head>
<title>Photo Gallery</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!--[imcss] *** Infinite Menus Core CSS: Keep this section in the document head for full validation. -->
<style type="text/css">.imcm ul,.imcm li,.imcm div,.imcm span,.imcm a{text-align:left;vertical-align:top;padding:0px;margin:0;list-style:none outside none;border-style:none;background-image:none;clear:none;float:none;display:block;position:static;overflow:visible;line-height:normal;}.imcm li a img{display:inline;border-width:0px;}.imcm span{display:inline;}.imcm .imclear,.imclear{clear:both;height:0px;visibility:hidden;line-height:0px;font-size:1px;}.imcm .imsc{position:relative;}.imcm .imsubc{position:absolute;visibility:hidden;}.imcm li{list-style:none;font-size:1px;float:left;}.imcm ul ul li{width:100%;float:none !important;}.imcm a{display:block;position:relative;}.imcm ul .imsc,.imcm ul .imsubc {z-index:10;}.imcm ul ul .imsc,.imcm ul ul .imsubc{z-index:20;}.imcm ul ul ul .imsc,.imcm ul ul ul .imsubc{z-index:30;}.imde ul li:hover .imsubc{visibility:visible;}.imde ul ul li:hover  .imsubc{visibility:visible;}.imde ul ul ul li:hover  .imsubc{visibility:visible;}.imde li:hover ul  .imsubc{visibility:hidden;}.imde li:hover ul ul .imsubc{visibility:hidden;}.imde li:hover ul ul ul  .imsubc{visibility:hidden;}.imcm .imea{display:block;position:relative;left:0px;font-size:1px;line-height:1px;height:0px;width:1px;float:right;}.imcm .imea span{display:block;position:relative;font-size:1px;line-height:0px;}.dvs,.dvm{border-width:0px}/*\*//*/.imcm .imea{visibility:hidden;}/**/</style><!--[if IE]><style type="text/css">.imcm .imea span{position:absolute;}.imcm .imclear,.imclear{display:none;}.imcm{zoom:1;} .imcm li{curosr:hand;} .imcm ul{zoom:1}.imcm a{zoom:1;}</style><![endif]--><!--[if gte IE 7]><style type="text/css">.imcm .imsubc{background-image:url(ie_css_fix);}</style><![endif]--><!--end-->

<!--[imstyles] *** Infinite Menu Styles: Keep this section in the document head for full validation. -->
<style type="text/css">


    /* --[[ Main Expand Icons ]]-- */
    #imenus0 .imeam span,#imenus0 .imeamj span {background-image:url(sample3_main_arrow.gif); width:7px; height:5px; left:-7px; top:5px; background-repeat:no-repeat;background-position:top left;}
    #imenus0 li:hover .imeam span,#imenus0 li a.iactive .imeamj span {background-image:url(sample3_main_arrow.gif); background-repeat:no-repeat;background-position:top left;}


    /* --[[ Sub Expand Icons ]]-- */
    #imenus0 ul .imeas span,#imenus0 ul .imeasj span {background-image:url(sample3_sub_arrow.gif); width:5px; height:7px; left:-5px; top:3px; background-repeat:no-repeat;background-position:top left;}
    #imenus0 ul li:hover .imeas span,#imenus0 ul li a.iactive .imeasj span {background-image:url(sample3_sub_arrow.gif); background-repeat:no-repeat;background-position:top left;}


    /* --[[ Main Container ]]-- */
    #imouter0 {border-color:#6a6a6a; border-width:1px; padding:0px; margin:0px; }


    /* --[[ Sub Container ]]-- */
    #imenus0 li ul {background-color:#efefef; border-style:solid; border-color:#cccccc; border-width:1px; padding:5px; margin:4px 0px 0px; }


    /* --[[ Main Items ]]-- */
    #imenus0 li a, #imenus0 .imctitle {color:#333333; text-align:left; font-family:Arial; font-size:12px; font-weight:normal; text-decoration:underline; border-color:#dddddd; border-width:1px; padding:0px 2px 0px 0px; }

        /* [hover] - These settings must be duplicated for IE compatibility.*/
        #imenus0 li:hover>a {text-decoration:underline; }
        #imenus0 li a.ihover, .imde imenus0 a:hover {text-decoration:underline; }

        /* [active] */
        #imenus0 li a.iactive {}

        /* [Main Graphic Button Text Content] */
        #imenus0 .imbuttons {padding:0px; text-align:center; }


    /* --[[ Sub Items ]]-- */
    #imenus0 ul a, #imenus0 .imsubc li .imctitle  {color:#555555; text-align:left; font-size:11px; font-weight:normal; text-decoration:none; border-style:none; border-color:#000000; border-width:1px; padding:2px 5px; }

        /* [hover] - These settings must be duplicated for IE comptatibility.*/
        #imenus0 ul li:hover>a {color:#000000; text-decoration:underline; }
        #imenus0 ul li a.ihover {color:#000000; text-decoration:underline; }

        /* [active] */
        #imenus0 ul li a.iactive {background-color:#ffffff; }


</style><!--end-->

</head>

<body>
<table width="504" height="562" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
  </tr>
  <div align="center">
  <tr>
    <body background="Hands.gif" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
    <td width="605" height="233" bordercolor="#FF6600">
    <img src="pic.gif" alt="Community of Hope" width="504" height="233" border="0" align="top"></td>
  </tr>
  <tr>
    <td height="310" bordercolor="#FF6600" bgcolor="#FFFFFF">
      <blockquote>
        <div align="left">
        




<!--|**START IMENUS**|imenus0,inline-->

<!--  ****** Infinite Menus Structure & Links ***** -->
<div class="imrcmain0 imgl" style="width:870px;z-index:999999;position:relative;"><div class="imcm imde" id="imouter0"><ul id="imenus0">
<li class="imatm"  style="width:145px;"><a href="coh.html">Home</a></li>
<li class="imatm"  style="width:145px;"><a href="aboutus.html"><span class="imea imeam"><span></span></span>About Us</a>

    <div class="imsc"><div class="imsubc" style="width:146px;top:0px;left:-1px;"><ul style="">
    <li><a href="#">About Community of Hope (COHSI)</a></li>
    <li><a href="#">Our Purpose</a></li>
    <li><a href="#">Mission Statement</a></li>
    <li><a href="#">Vision</a></li>
    </ul></div></div></li>


<li class="imatm"  style="width:145px;"><a class="" href="boxlocations.html"><span class="imea imeam"><span></span></span>Box Locations</a>

    <div class="imsc"><div class="imsubc" style="width:146px;top:0px;left:0px;"><ul style="">
    <li><a href="#">Find a Box Near You</a></li>
    </ul></div></div></li>


<li class="imatm"  style="width:145px;"><a href="#"><span class="imea imeam"><span></span></span>How To Get Involved</a>

    <div class="imsc"><div class="imsubc" style="width:145px;top:;left:;"><ul style="">
    <li><a href="#">What To Donate</a></li>
    </ul></div></div></li>


<li class="imatm"  style="width:145px;"><a href="#">Photo Gallery</a></li>
<li class="imatm"  style="width:145px;"><a href="#">Contact Us</a></li>
</ul><div class="imclear"> </div></div></div>



<!--|**END IMENUS**|-->





<p><font color="#FF6600" size="+2"><strong>Photo Gallery</strong>
            </font></p>
          <p>Some pics
          </p>

        </div>
      </blockquote>
  </tr>

  <tr>
    <td height="19" bordercolor="#FF6600" bgcolor="#FF6600">
<div align="center"><font color="#FFFFFF" size="-2"></font></div></td>
  </tr>
</table>


<map name="Map">
  <area shape="rect" coords="149,217,240,229" href="#">
  <area shape="rect" coords="246,218,315,228" href="#">

  <area shape="rect" coords="36,218,143,228" href="#">
</map>


<!--[imcode]*** Infinite Menus Settings / Code - This script reference must appear last. ***

      *Note: This script is required for scripted add on support and IE 6 sub menu functionality.
      *Note: This menu will fully function in all CSS2 browsers with the script removed.-->

<script language="JavaScript" src="ocscript.js" type="text/javascript"></script>

</body>
</html>





if you know how to do this please tell me to make it simple cause i am just starting out at html, thx.
Darin McGrew
Apr 7 2008, 02:41 PM
I recommend that you start by fixing the markup errors reported by our online validator. (See the link at the bottom of this page.) Your document's structure is pretty broken.
stc23
Apr 7 2008, 02:46 PM
i dont even know what to replace the problems with, there is so many


Errors and Warnings

* Line 1, character 1:

<html>
^

Error: missing document type declaration; assuming HTML 4.01 Transitional
* Line 60, character 27:

<table width="504" height="562" border="0" align="center" ce ...
^

Error: there is no attribute HEIGHT for this element (in this HTML version)
* Line 62, character 7:

</tr>
^

Error: missing a required sub-element of TR
* Line 63, character 22:

<div align="center">
^

Error: element DIV not allowed here; check which elements this element may be contained within
* Line 64, character 6:

<tr>
^

Error: element TR not allowed here; check which elements this element may be contained within
* Line 65, character 45:

... round="Hands.gif" leftmargin="0" topmargin="0" marginwidth=" ...
^

Error: there is no attribute LEFTMARGIN for this element (in this HTML version)
* Line 65, character 59:

... if" leftmargin="0" topmargin="0" marginwidth="0" marginheigh ...
^

Error: there is no attribute TOPMARGIN for this element (in this HTML version)
* Line 65, character 75:

... 0" topmargin="0" marginwidth="0" marginheight="0">
^

Error: there is no attribute MARGINWIDTH for this element (in this HTML version)
* Line 65, character 92:

... marginwidth="0" marginheight="0">
^

Error: there is no attribute MARGINHEIGHT for this element (in this HTML version)
* Line 65, character 95:

... ginwidth="0" marginheight="0">
^

Error: element BODY not allowed here; check which elements this element may be contained within
* Line 66, character 43:

... 05" height="233" bordercolor="#FF6600">
^

Error: there is no attribute BORDERCOLOR for this element (in this HTML version)
* Line 69, character 6:

<tr>
^

Error: element TR not allowed here; check which elements this element may be contained within
* Line 127, character 95:

... .html">Donate Clothes</strong></font></p>
^

Error: end tag for A omitted; possible causes include a missing end tag, improper nesting of elements, or use of an element where it is not allowed
* Line 127, character 44:

... ="#FF6600" size="+2"><strong><a href="DonateClothes.html">Do ...
^

start tag was here
* Line 129, character 99:

... ">Find A Box Near You</strong></font></p>
^

Error: end tag for A omitted; possible causes include a missing end tag, improper nesting of elements, or use of an element where it is not allowed
* Line 129, character 44:

... ="#FF6600" size="+2"><strong><a href="boxlocations.html">Fin ...
^

start tag was here
* Line 137, character 6:

<tr>
^

Error: element TR not allowed here; check which elements this element may be contained within
* Line 141, character 8:

</table>
^

Error: end tag for DIV omitted; possible causes include a missing end tag, improper nesting of elements, or use of an element where it is not allowed
* Line 63, character 3:

<div align="center">
^

start tag was here
* Line 145, character 55:

... ds="149,217,240,229" href="#">
^

Error: required attribute ALT not specified
* Line 146, character 55:

... ds="246,218,315,228" href="#">
^

Error: required attribute ALT not specified
* Line 148, character 54:

... rds="36,218,143,228" href="#">
^

Error: required attribute ALT not specified
Darin McGrew
Apr 7 2008, 03:25 PM
The links in the validation report should help explain the problems, but here are some other pointers.

CODE
Error: missing document type declaration; assuming HTML 4.01 Transitional
See the FAQ entry What is a DOCTYPE? Which one do I use?

CODE
Error: there is no attribute HEIGHT for this element (in this HTML version)
You're using non-standard presentational markup. Use CSS instead. Better yet, don't try to specify table heights, so they can adapt to their content.

CODE
Error: missing a required sub-element of TR
A tr element must contain one or more th or td elements.

CODE
Error: element DIV not allowed here; check which elements this element may be contained within
You can't have a loose div element inside a table like that. You have to put the entire table inside the div, or you have to put the div inside a td element.

CODE
Error: element TR not allowed here; check which elements this element may be contained within
This is a side effect of the previous error. You can't put tr elements inside div elements either.

CODE
Error: there is no attribute LEFTMARGIN for this element (in this HTML version)
Error: there is no attribute TOPMARGIN for this element (in this HTML version)
Error: there is no attribute MARGINWIDTH for this element (in this HTML version)
Error: there is no attribute MARGINHEIGHT for this element (in this HTML version)
Error: there is no attribute BORDERCOLOR for this element (in this HTML version)
More non-standard markup. Use CSS instead.

CODE
Error: element BODY not allowed here; check which elements this element may be contained within
You can have only one body element.

CODE
Error: end tag for A omitted; possible causes include a missing end tag, improper nesting of elements, or use of an element where it is not allowed
I don't see that one in the markup you posted. But see Incorrect Nesting of Elements in our list of Common HTML Validation Problems.

CODE
Error: required attribute ALT not specified
See Use of ALT texts in IMGs.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2010 Invision Power Services, Inc.