|
|
| (12 intermediate revisions not shown) |
| Line 17: |
Line 17: |
| | | | |
| | }} | | }} |
| - | <html>
| |
| - | <script type="text/javascript">
| |
| - | <!--//---------------------------------+
| |
| - | // Developed by Roshan Bhattarai
| |
| - | // Visit http://roshanbh.com.np for this script and more.
| |
| - | // This notice MUST stay intact for legal use
| |
| - | // --------------------------------->
| |
| - | $(document).ready(function()
| |
| - | {
| |
| - | //slides the element with class "menu_body" when mouse is over the paragraph
| |
| - | $("#secondpane p.menu_head").mouseover(function()
| |
| - | {
| |
| - | $(this).next("div.menu_body").slideDown(500).siblings("div.menu_body").slideUp("slow");
| |
| - | $(this).siblings();
| |
| - | });
| |
| - | });
| |
| - | </script>
| |
| - | <style type="text/css">
| |
| - | .menu_list {
| |
| - | width: 180px;
| |
| - | }
| |
| - | .menu_head {
| |
| - | padding: 5px 10px;
| |
| - | cursor: pointer;
| |
| - | position: relative;
| |
| - | border:1px solid #fff;
| |
| - | margin:1px;
| |
| - | font-weight:bold;
| |
| - | background: #ffbe10;
| |
| - | color:#fff
| |
| - | }
| |
| - | .menu_head:hover
| |
| - | {
| |
| - | cursor: pointer;
| |
| - | color: #fff;
| |
| - | background: #d39f10;
| |
| - | text-decoration: none;
| |
| - | background-position: 0 0;
| |
| - | }
| |
| - | .menu_body {
| |
| - | display:none;
| |
| - | }
| |
| - | .menu_children {
| |
| - | background: #aaa;
| |
| - | cursor: pointer;
| |
| - | padding: 5px 10px;
| |
| - | border-top: 1px solid #fff;
| |
| - | border-bottom: 1px solid #fff;
| |
| - | border-left: 1px solid #fff;
| |
| - | border-right: 1px solid #fff;
| |
| - | }
| |
| - | .menu_body a{
| |
| - | display:block;
| |
| - | color:#fff;
| |
| - | padding-left:10px;
| |
| - | font-weight:bold;
| |
| - | text-decoration:none;
| |
| - | }
| |
| - | .menu_children:hover{
| |
| - | cursor: pointer;
| |
| - | color: #fff;
| |
| - | text-decoration:none;
| |
| - | background:#777777;
| |
| - | }
| |
| - | </style>
| |
| - | <div style="float:left;">
| |
| - | <div class="menu_list" id="secondpane"> <!--Code for menu starts here-->
| |
| - | <p class="menu_head">Header-1</p>
| |
| - | <div class="menu_body">
| |
| - | <div class="menu_children">
| |
| - | <a href="#">Link-1</a>
| |
| - | </div>
| |
| - | <div class="menu_children">
| |
| - | <a href="#">Link-2</a>
| |
| - | </div>
| |
| - | <div class="menu_children">
| |
| - | <a href="#">Link-3</a>
| |
| - | </div>
| |
| - | </div>
| |
| - | <p class="menu_head">Header-2</p>
| |
| - | <div class="menu_body">
| |
| - | <div class="menu_children">
| |
| - | <a href="#">Link-1</a>
| |
| - | </div>
| |
| - | <div class="menu_children">
| |
| - | <a href="#">Link-2</a>
| |
| - | </div>
| |
| - | <div class="menu_children">
| |
| - | <a href="#">Link-3</a>
| |
| - | </div>
| |
| - | </div>
| |
| - | <p class="menu_head">Header-3</p>
| |
| - | <div class="menu_body">
| |
| - | <div class="menu_children">
| |
| - | <a href="#">Link-1</a>
| |
| - | </div>
| |
| - | <div class="menu_children">
| |
| - | <a href="#">Link-2</a>
| |
| - | </div>
| |
| - | <div class="menu_children">
| |
| - | <a href="#">Link-3</a>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div> <!--Code for menu ends here-->
| |
| - | </div>
| |
| - | </html>
| |
| - | <div id="text-content">
| |
"
