Jump to content

Search the Community

Showing results for tags 'mega menu'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • HTML/XHTML
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • XSLT/XSL-FO
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests


Languages

Found 3 results

  1. JTReignz

    Mega Menu

    I am trying to create a mega menu similar to a lot of the leading online bookstores with multiple dropdowns of varying sizes under each menu title. I have been attempting to do so but only managed one dropdown beside regular menu links. If anyone can offer any help it would be much appreciated. Thanks.
  2. Hi, I am having some problem while creating a mega dropdown menu. I want the mega-dropdown-content to be divided to 4 column and 3column will be for the menu and rest 1 column will be for an image. But this is not the expected result. Here is the code. Please tell how can I fix it? Thank you. <!DOCTYPE html> <html> <head> <link rel= "stylesheet" href= "mega%20menu%20copy%20copy.css"/> <link rel= "stylesheet" href= "font-awesome-4.7.0/css/font-awesome.min.css"/> <style> .menu-container, .mega-menu, .nav, .nav li, .nav a, .nav div{ margin: 0; padding: 0; border: none; outline:none; } .nav { position: relative; } .nav a { text-decoration: none; } .nav li { list-style: none; } a { color: white; } .menu-container { position: relative; width: 100%; } .mega-menu { position: absolute; width: 48%; left: 26%; height: 40px; background-color: red; } .nav > li { display: inline-block; height: 40px; font-size: 20px; font-weight: bold; } .nav > li > a { display: block; padding: 10px 10px; color: white; text-align: left; vertical-align: center; margin-bottom: 10px; } .mega-menu-content, .dropdown { padding-top: 60px; position: absolute;; width: 100%; display: none; background-color: white; color: black; font-size: 16px; border: 2px solid lightgrey; } .mega-menu-content > ul > li:first-child,.dropdown > ul >li:first-child { padding-top: 10px; } .mega-menu-content > ul> li, .dropdown > ul > li { display: block; min-width: 120px; min-height: 40px; margin: 0; padding: 0; } .mega-menu-content > ul > li > a, .dropdown > ul > li > a { color: red; font-size: 16px; min-width: 120px; padding: 8px 10px; border: 1px solid lightgrey; } .mega-menu-content { column-count: 3; column-width: 33%; column-gap: 0; } .mega-menu-content > ul > li > a:hover, .dropdown > ul > li > a:hover { background-color: lightgrey; } .nav > li:hover .mega-menu-content, .nav > li:hover .dropdown{ display: block; } </style> </head> <body> <div class= "menu-container"> <div class= "mega-menu"> <ul class= "nav"> <li><a href= "#">Home</a></li> <li><a href= "#">Clothing <i class="fa fa-chevron-circle-down" aria-hidden="true"></i></a> <div class= "mega-menu-content"> <ul>Men<hr/> <li><a href= "#">T-shirts</a></li> <li><a href= "#">Shirts</a></li> <li><a href= "#">Pants</a></li> <li><a href= "#">Shoes</a></li> <li><a href= "#">Sunglasses</a></li> <li><a href= "#">Caps</a></li> <li><a href= "#">Jewelry</a></li> <li><a href= "#">Others</a></li> </ul> <ul>Women<hr/> <li><a href= "#">Jewelry</a></li> <li><a href= "#">Coats & Jackets</a></li> <li><a href= "#">Tops & Blouses</a></li> <li><a href= "#">Intimate & Sleep</a></li> <li><a href= "#">Jeans</a></li> <li><a href= "#">Pants</a></li> <li><a href= "#">Skirts</a></li> <li><a href= "#">Sweaters</a></li> </ul> <ul>Others<hr/> <li><a href= "#">Boys</a></li> <li><a href= "#">Girls</a></li> <li><a href= "#">Baby</a></li> <li><a href= "#">Luggage</a></li> </ul> <ul>From Popular Sites<hr/> <li><a href= "#">Amazon</a></li> <li><a href= "#">Ebay</a></li> <li><a href= "#">Etsy</a></li> <li><a href= "#">Shoppify</a></li> </ul> <img src= "#" height= "100px" width= "100px" style= "float: right;"/> </div> </li> <li><a href= "#">Products <i class="fa fa-chevron-circle-down" aria-hidden="true"></i></a> <div class= "mega-menu-content"> <img src= "#" height= "100%" width= "25%" style= "float: left;"/> <hr/> <ul>Electronics & Computers<hr/> <li><a href= "#">TV & Video</a></li> <li><a href= "#">Cellphone & Camera</a></li> <li><a href= "#">Head Phones</a></li> <li><a href= "#">Video Games</a></li> <li><a href= "#">Computers & Tablets</a></li> <li><a href= "#">Monitors</a></li> <li><a href= "#">Schools & Office Supplies</a></li> <li><a href= "#">Trade In Your Electronics</a></li> <hr/></ul> <ul>Health & Beauty<hr/> <li><a href= "#">All Beauty</a></li> <li><a href= "#">Luxury Beauty</a></li> <li><a href= "#">Specialty Diets</a></li> <li><a href= "#">Health,Household & Baby care</a></li> <li><a href= "#">Coupons</a></li> <hr/></ul> <ul>Sports & Outdoors<hr/> <li><a href= "#">Athletic Clothing</a></li> <li><a href= "#">Exercise & Fitness</a></li> <li><a href= "#">Hunting & Fishing</a></li> <li><a href= "#">Team Sports</a></li> <li><a href= "#">Cycling</a></li> <li><a href= "#">Water Sports</a></li> <li><a href= "#">Winter Sports</a></li> <li><a href= "#">All Sports</a></li> </ul> </div> </li> <li><a href= "#">Gifts <i class="fa fa-chevron-circle-down" aria-hidden="true"></i></a> <div class="dropdown"> <ul> <li><a href= "#">Games</a></li> <li><a href= "#">Books</a></li> <li><a href= "#">Show Piece</a></li> <li><a href= "#">Kids Birthday</a></li> </ul> </div> </li> <li><a href= "#">Arts & Crafts</a></li> <li><a href= "#">Services</a></li> </ul> </div> </div> </body> </html>
  3. Hi, The following is template for my website http://egtours.com suddenly mega menu system does not work. I think I made some error but I could not figure out what is the error. I shall much appreciate if any body can help and figure out the error. What is this clickberry-extension clickberry-extension ? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html class=" clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone clickberry-extension clickberry-extension-standalone" xmlns="http://www.w3.org/1999/xhtml"><head><title>#PAGENAME#</title><meta content="text/html; charset=us-ascii" http-equiv="Content-Type" /><meta content="IE=EmulateIE7" http-equiv="X-UA-Compatible" /><link rel="stylesheet" type="text/css" href="sohoadmin/program/modules/site_templates/pages/PHASE2-Dinkin_Flicka-Evergreen/custom.css" /><link type="text/css" href="sohoadmin/plugins/MegaMenuBuilder/jquery.megamenu.css" /><link rel="stylesheet" href="lightbox/css/lightbox.css" /><link rel="stylesheet" type="text/css" href="jsimgslider/themes/3/slider.css" /><link rel="stylesheet" type="text/css" href="jsimgslider/themes/8/js-image-slider.css" /><link rel="stylesheet" type="text/css" href="jsimgslider/themes/8/tooltip.css" /><link rel="stylesheet" type="text/css" href="mactabs/mctabs.css" /><link href="zoomslider/themes/1/zoomslider.css" rel="stylesheet" type="text/css" /><script language="JavaScript" src="motionpack.js"></script><script type="text/javascript" src="http://www.egtours.com/sohoadmin/plugins/MegaMenuBuilder/javascripts/jquery-1.11.3.min.js"></script><script src="/zoomslider/themes/1/zoomSlider.js" type="text/javascript"></script><script type="text/javascript" src="/../../../../../../../../../../../../../tooltip/themes/2/tooltip.js"></script><script type="text/javascript" src="jsimgslider/themes/8/js-image-slider.js"></script><script type="text/javascript" src="jsimgslider/themes/3/thumbnail-slider.js"></script><script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.2.1.js"></script><script type="text/javascript" src="http://www.egtours.com/mactabs/javascript-tabs.js"></script><script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script><!--[if IE]><style type="text/css">img { behavior: url("#template_path_full_url#/pngbehavior.htc"); }</style><![endif]--><meta content="clickberry-extension-here" /><meta content="clickberry-extension-here" /><meta content="clickberry-extension-here" /><meta content="clickberry-extension-here" /><meta content="clickberry-extension-here" /><meta content="clickberry-extension-here" /><meta content="clickberry-extension-here" /><meta content="clickberry-extension-here" /><meta content="clickberry-extension-here" /><meta content="clickberry-extension-here" /><meta content="clickberry-extension-here" /><meta content="clickberry-extension-here" /><meta content="clickberry-extension-here" /><meta content="clickberry-extension-here" /><meta content="clickberry-extension-here" /><meta content="clickberry-extension-here" /><!-- Google Tag Manager --><noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-587FJD"height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript><script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-587FJD');</script><!-- End Google Tag Manager --></head><body onload="slidedown('featwrapper');"><div id="headwrapper"><div id="head" class="clearfix"><div id="logo_box"><a href="../../../../../../../Home_Page.php"><img id="logo" border="0" alt="Home" width="322" height="118" src="images/_userimg-logo.png" /></a></div><div id="tagline"><img border="0" alt="Home" width="468" height="60" src="images/_userimg-ad_banner.png" /></div></div></div><div id="trimbar"></div><div style="display: none; height: 124px; overflow: hidden" id="featwrapper"><div id="feat" class="clearfix"><div id="featleft">#NEWSBOX#</div><div id="featright">#PROMOTXT1#</div></div></div><div id="navwrapper"><div id="nav" class="clearfix"><div id="signup"><a href="javascript:;" onmousedown="toggleSlide('featwrapper');"><img style="border: 0pt" border="0" alt="Toggle the banner up or down" width="110" height="27" src="images/hide-show.png" /></a></div><div id="mainnav">#MEGAMENU#</div></div></div><div id="contentwrapper"><div id="maincontent" class="clearfix"><div id="subnav">#VSUBS#<div id="belowmenu">#POWERPLUG4#</div></div><div id="content"><div id="date">#AUTODATESTAMP#</div>#CONTENT#</div></div><div id="footerwrapper"><div id="footer"><table id="table1" border="0" cellspacing="1" width="400"><tbody><tr><td colspan="6" align="left"><p align="center"><a title="" href="../../../../../../../Our_Policies.php">Our Policies</a>| <a href="../../../../../../../Privacy_Statement.php">Privacy Statement</a></p></td></tr><tr><td width="60"><img border="0" alt="coat of arm" width="66" height="56" src="../../../../../../../images/logos/coatofarm.png" /></td><td width="152"><img border="0" alt="natta logo" width="53" height="56" src="../../../../../../../images/logos/nattalogo.png" /></td><td width="55"><img border="0" alt="uftaa logo" width="80" height="56" src="../../../../../../../images/logos/uftaa.png" /></td><td width="71"><img title="" alt="skull logo" width="75" height="36" src="../../../../../../../images/paybyskull.png" /><br /></td><td width="71"><p><img title="" alt="paypal logo" width="57" height="57" src="../../../../../../../images/paypalv.png" /></p></td><td width="26"><p><img title="" alt="vitof logo" width="97" height="73" src="../../../../../../../images/vitof_logo.png" /></p></td><td width="90"><img border="0" alt="SSL" width="90" height="50" src="http://www.egtours.com/images/rapidssl_ssl_certificate.gif" /></td></tbody></table>#COPYRIGHT#</div></div></div><script src="http://www.egtours.com/lightbox/js/lightbox-plus-jquery.min.js"></script></body></html>
×
×
  • Create New...