Israel

Israel

  • 705
  • 1.3k
  • 216.4k

Menu with block of text appearing...

Jul 31 2013 11:49 AM

Hi!

I am a little bit confuse...
With my codes I need that when I click to one menu (for instance, "About Us"). I would to see appear the block of the text on the same page (just below of that menu clicked).
But that block of text must appear with a kind of simple effect (may be a fade in or out, etc). Means when the text appearing come with that effect.
I try with <pre>... But it's wrong.

thanx
 


<style type="text/css">

#menu, #menu ul
 {
 list-style:none;
 padding:0;
 margin:0;
}
#menu li
 {
 float:left;
 position:relative;
 line-height: 2.5em;
 width: 10em;
}
#menu li ul
 {
 position:absolute;
 margin-top:-1em;
 margin-left:.5em;
 display:none;
}
#menu ul li ul
{
 margin-top:-3em;
 margin-left:8em;
}
#menu a
{
 display:block;
 border-right:1px solid #fff;
 background:#E0FFF4;
 color:#3B3B3B;
 text-decoration:none;
 padding:0 10px;
}
#menu a:hover
{
 background-color:#5798B4;
 color:#fff;
}
#menu ul
 {
 border-top:1px solid #fff;
}
#menu ul a
 {
 border-right:none;
 border-right:1px solid #fff;
 border-bottom:1px solid #fff;
 border-left:1px solid #fff;
 background:#AEC245;
}
/* SUBMENU 1 */
#menu li:hover ul, #menu li.over ul
{
 display:block;
}
#menu li:hover ul ul, #menu li.over ul ul
{
 display:none;
}
/* SUBMENU 2 */
#menu ul li:hover ul, #menu ul li.over ul
{
 display:block;
}


</style>
    <title></title>
</head>
<body bgcolor="#c0c0c0">
    <form id="form1" runat="server">
   <ul id="menu">
 <li><a href="#" title="<pre>Homepage<pre>" class="selected"><center>About Us</a></li></center>
 <li><a href="#" title="<pre>About us<pre>"<center>products</a></li></center>
</ul>
 


Answers (9)