Submit your widget

jQuery and CSS3 slide accordion menu

Created 6 years ago   Views 46372   downloads 12358    Author ch3mical
jQuery and CSS3 slide accordion menu
View DemoDownload 128.8 KB
115
Share |
This is a very unique animation menu with jQuery and CSS3,. ordinary circumstances, the menu displays only menu items LOGO , When the mouse hover the menu item, it will from left to right stretched .
The main html:
   <div id="container">
      <h1>htmldrive</h1>
      <ul id="centerwell">
         <li id="behance">
            <h3><a href="#" target="_blank">Behance</a></h3>
            <p>Take a look at my portfolio, let me know whatcha think. </p>
         </li>
         <li id="flicker">
            <h3><a href="#" target="_blank">Flicker</a></h3>
             <p>See what I&#39;ve been up to with my camera.</p>
         </li>
         <li id="linkedin">
            <h3><a href="#" target="_blank">LinkedIn</a></h3>
             <p>Hit me up, I&#39;m always looking to make new connections.</p>
         </li>
         <li id="facebook">   
            <h3><a href="#" target="_blank">Facebook</a></h3>
             <p>I have to admit I check it at least once a day.</p>
         </li>
         <li id="twitter">
            <h3><a href="#" target="_blank">Twitter</a></h3>
             <p>I&#39;m more of a voyeur here, but when I do say something ...</p>
         </li>
         <li id="resume">
            <h3><a href="#" target="_blank">Resume</a></h3>
             <p>Download in PDF format. References given upon request.</p>
         </li>
         <li id="email">
            <h3><a href="#">Email</a></h3>
             <p>pk@ch3mical.com</p>
         </li>
         <li id="contact">
            <h3><a href="#" target="_blank">Contact</a></h3>
             <p>Phone: 248 760 6301<br>
				Location: Detroit, MI</p>
         </li>
      </ul><!-- centerwell -->
      <div id="content">