XMENU - Ultimate Responsive Mega Menu by IndianCoder

<!doctype html>   <html class="no-js " lang="en">  <head> <meta charset="utf-8"> <script src="https://public-assets.envato-static.com/assets/market/core/datadog-c9dadca4b1354094f125388491f85039fc6c2017f1bbf824b789caa4c03450a2.js" nonce="rXYqdYIOgpote8Hih2sq8g=="></script> <script nonce="rXYqdYIOgpote8Hih2sq8g=="> //<![CDATA[ window.DD_RUM && window.DD_RUM.init({ clientToken: 'puba7a42f353afa86efd9e11ee56e5fc8d9', applicationId: '8561f3f6-5252-482b-ba9f-2bbb1b009106', site: 'datadoghq.com', service: 'marketplace', env: 'production', version: 'ae74f4f2fe1abc8e145ae4d1de11a56f712f302a', sampleRate: 0.2, premiumSampleRate: 5, trackInteractions: false, defaultPrivacyLevel: 'mask-user-input', beforeSend: (event, context) => { if (typeof window.datadog_attributes == 'object') event.context = {...event.context, ...window.datadog_attributes} }, }) //]]> </script> <script nonce="rXYqdYIOgpote8Hih2sq8g=="> //<![CDATA[ var rollbarEnvironment = "production" var codeVersion = "ae74f4f2fe1abc8e145ae4d1de11a56f712f302a" //]]> </script> <script src="https://public-assets.envato-static.com/mp/packs/js/rollbar-304e0de7661e0a12bfed.js" nonce="rXYqdYIOgpote8Hih2sq8g=="></script> <meta content="origin-when-cross-origin" name="referrer" /> <link rel="dns-prefetch" href="//s3.envato.com" /> <link rel="preload" href="https://market-resized.envatousercontent.com/codecanyon.net/files/543485530/01_Preview.jpeg?auto=format&q=94&cf_fit=crop&gravity=top&h=8000&w=590&s=4b68b1989348d7d486b62be27a3513bfc431b250fb20769984954fe104d41aa6" as="image" /> <link rel="preload" href="https://public-assets.envato-static.com/assets/generated_sprites/logos-20f56d7ae7a08da2c6698db678490c591ce302aedb1fcd05d3ad1e1484d3caf9.png" as="image" /> <link rel="preload" href="https://public-assets.envato-static.com/assets/generated_sprites/common-5af54247f3a645893af51456ee4c483f6530608e9c15ca4a8ac5a6e994d9a340.png" as="image" /> <title>XMENU - Ultimate Responsive Mega Menu by IndianCoder | CodeCanyon</title> <meta name="description" content="Buy XMENU - Ultimate Responsive Mega Menu by IndianCoder on CodeCanyon. Xmenu Responsive Mega Menu is a jQuery-powered, highly customizable, and user-friendly menu system designed for crea..."> <meta name="viewport" content="width=device-width,initial-scale=1"> <link rel="shortcut icon" type="image/x-icon" href="https://public-assets.envato-static.com/assets/icons/favicons/favicon-1147a1221bfa55e7ee6678c2566ccd7580fa564fe2172489284a1c0b1d8d595d.png" /> <link rel="apple-touch-icon-precomposed" type="image/x-icon" href="https://public-assets.envato-static.com/assets/icons/favicons/apple-touch-icon-72x72-precomposed-ea6fb08063069270d41814bdcea6a36fee5fffaba8ec1f0be6ccf3ebbb63dddb.png" sizes="72x72" /> <link rel="apple-touch-icon-precomposed" type="image/x-icon" href="https://public-assets.envato-static.com/assets/icons/favicons/apple-touch-icon-114x114-precomposed-bab982e452fbea0c6821ffac2547e01e4b78e1df209253520c7c4e293849c4d3.png" sizes="114x114" /> <link rel="apple-touch-icon-precomposed" type="image/x-icon" href="https://public-assets.envato-static.com/assets/icons/favicons/apple-touch-icon-120x120-precomposed-8275dc5d1417e913b7bd8ad048dccd1719510f0ca4434f139d675172c1095386.png" sizes="120x120" /> <link rel="apple-touch-icon-precomposed" type="image/x-icon" href="https://public-assets.envato-static.com/assets/icons/favicons/apple-touch-icon-144x144-precomposed-c581101b4f39d1ba1c4a5e45edb6b3418847c5c387b376930c6a9922071c8148.png" sizes="144x144" /> <link rel="apple-touch-icon-precomposed" type="image/x-icon" href="https://public-assets.envato-static.com/assets/icons/favicons/apple-touch-icon-precomposed-c581101b4f39d1ba1c4a5e45edb6b3418847c5c387b376930c6a9922071c8148.png" /> <link rel="stylesheet" media="all" href="https://public-assets.envato-static.com/assets/market/core/index-6c69a94a8baf3f4c3819d01881b93c5df72551f3f91ec87d2f599bb75ba7ca88.css" /> <link rel="stylesheet" media="all" href="https://public-assets.envato-static.com/assets/market/pages/default/index-43c9e199b223db5c5bba332e76ddb21b8a94a6038c1f49a8e7d1d258d5b02293.css" /> <link rel="stylesheet" media="screen" href="https://public-assets.envato-static.com/mp/packs/css/components/brand_neue_tokens-a3eebe3f.css" /> <meta name="theme-color" content="#333333"> <link rel="canonical" href="https://codecanyon.net/item/xmenu-ultimate-responsive-mega-menu/55414390" /> <script type="application/ld+json"> { "@context": "http://schema.org", "@type": "WebSite", "name": "CodeCanyon", "url": "https://codecanyon.net" } </script> <script type="application/ld+json"> {"@context":"http://schema.org","@type":"Product","category":"Navigation and Menus","url":"https://codecanyon.net/item/xmenu-ultimate-responsive-mega-menu/55414390","description":"Xmenu Responsive Mega Menu is a jQuery-powered, highly customizable, and user-friendly menu system designed for creating advanced, feature-rich navigation menus on websites. Available on CodeCanyon, this plugin enables web developers to build fully responsive, multi-level, and visually engaging mega menus that work seamlessly across all screen sizes and devices. Below is a detailed description of the features, functionality, and use cases for Xmenu 1. Responsive and Mobile-Friendly Xmenu is designed with a fully responsive layout, ensuring that your website’s navigation menus work perfectly on all screen sizes, from desktop monitors to mobile devices. The menu adapts dynamically based on the screen size, making it ideal for mobile","name":"XMENU - Ultimate Responsive Mega Menu","image":"https://s3.envato.com/files/543485529/logo.png","brand":{"@type":"Brand","name":"IndianCoder"},"sku":55414390,"mpn":"E-55414390","productionDate":"2024-11-20T17:50:56+11:00","releaseDate":"2024-11-20T17:50:56+11:00","offers":{"@type":"Offer","price":"9.00","priceCurrency":"USD","priceValidUntil":"2024-11-25T23:59:59+11:00","itemCondition":"http://schema.org/NewCondition","availability":"http://schema.org/InStock","url":"https://codecanyon.net/item/xmenu-ultimate-responsive-mega-menu/55414390"}} </script> <script type="application/ld+json"> {"@context":"http://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://codecanyon.net"},{"@type":"ListItem","position":2,"name":"Files","item":"https://codecanyon.net/category/all"},{"@type":"ListItem","position":3,"name":"CSS","item":"https://codecanyon.net/css"},{"@type":"ListItem","position":4,"name":"Navigation and Menus"}]} </script> <script nonce="rXYqdYIOgpote8Hih2sq8g=="> //<![CDATA[ window.dataLayer = window.dataLayer || []; //]]> </script> <meta name="bingbot" content="nocache"> <meta name="twitter:card" content="product" /> <meta name="twitter:site" content="@envatomarket" /> <meta /> <meta name="twitter:data1" content="$9 USD" /> <meta name="twitter:label1" content="Price" /> <meta name="twitter:data2" content="CodeCanyon" /> <meta name="twitter:label2" content="Marketplace" /> <meta name="twitter:domain" content="codecanyon.net" /> <meta property="og:title" content="XMENU - Ultimate Responsive Mega Menu" /> <meta property="og:type" content="website" /> <meta property="og:url" content="https://codecanyon.net/item/xmenu-ultimate-responsive-mega-menu/55414390" /> <meta property="og:image" content="https://s3.envato.com/files/543485529/logo.png" /> <meta property="og:description" content=" Xmenu Responsive Mega Menu is a jQuery-powered, highly customizable, and user-friendly menu system designed for creating advanced, feature-rich navigation menus on websites. Available on Co..." /> <meta property="og:site_name" content="CodeCanyon" /> <meta name="csrf-param" content="authenticity_token" /> <meta name="csrf-token" content="G-t6J0BnECrkpEqFB_VaIaRxHs-sriWNto7-x-Y2-Pg11DxqR-Ip_k-MZQImFnyznpbbgXq2yqybp2N1xmQHnA" /> <meta name="turbo-visit-control" content="reload"> <script type="text/plain" nonce="rXYqdYIOgpote8Hih2sq8g==" data-cookieconsent="statistics"> //<![CDATA[ var container_env_param = ""; (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='https://www.googletagmanager.com/gtm.js?id='+i+dl+container_env_param; f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-W8KL5Q5'); //]]> </script> <script type="text/plain" nonce="rXYqdYIOgpote8Hih2sq8g==" data-cookieconsent="marketing"> //<![CDATA[ var gtmId = 'GTM-KGCDGPL6'; var container_env_param = ""; // Google Tag Manager Tracking Code (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='https://www.googletagmanager.com/gtm.js?id='+i+dl+container_env_param; f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer', gtmId); window.addEventListener('load', function() { window.dataLayer.push({ event: 'pinterestReady' }); }); //]]> </script> <script src="https://public-assets.envato-static.com/assets/market/core/head-27cdb5ede34aef07336dc99fceecaf31a2d50c9615e8116fc60965812916e464.js" nonce="rXYqdYIOgpote8Hih2sq8g=="></script> </head> <body class="color-scheme-light" data-view="app impressionTracker" data-responsive="true" data-user-signed-in="false" > <script nonce="rXYqdYIOgpote8Hih2sq8g=="> //<![CDATA[ var gtmConfig = {} //]]> </script>  <script src="https://public-assets.envato-static.com/mp/packs/js/gtm_measurements-0a96144c452c1dfda6b2.js" nonce="rXYqdYIOgpote8Hih2sq8g=="></script> <noscript> <iframe src="https://www.googletagmanager.com/ns.html?id=GTM-W8KL5Q5" height="0" width="0" style="display:none;visibility:hidden" > </iframe> </noscript> <noscript> <iframe src="https://www.googletagmanager.com/ns.html?id=GTM-KGCDGPL6" height="0" width="0" style="display:none;visibility:hidden" > </iframe> </noscript> <script nonce="rXYqdYIOgpote8Hih2sq8g=="> //<![CDATA[ (function() { function normalizeAttributeValue(value) { if (value === undefined || value === null) return undefined var normalizedValue if (Array.isArray(value)) { normalizedValue = normalizedValue || value .map(normalizeAttributeValue) .filter(Boolean) .join(', ') } normalizedValue = normalizedValue || value .toString() .toLowerCase() .trim() .replace(/&/g, '&') .replace(/'/g, "'") .replace(/\s+/g, ' ') if (normalizedValue === '') return undefined return normalizedValue } var pageAttributes = { app_name: normalizeAttributeValue('Marketplace'), app_env: normalizeAttributeValue('production'), app_version: normalizeAttributeValue('ae74f4f2fe1abc8e145ae4d1de11a56f712f302a'), page_type: normalizeAttributeValue('item'), page_location: window.location.href, page_title: document.title, page_referrer: document.referrer, ga_param: normalizeAttributeValue(''), event_attributes: null, user_attributes: { user_id: normalizeAttributeValue(''), market_user_id: normalizeAttributeValue(''), } } dataLayer.push(pageAttributes) dataLayer.push({ event: 'analytics_ready', event_attributes: { event_type: 'user', custom_timestamp: Date.now() } }) })(); //]]> </script> <div class="page"> <div class="page__off-canvas--left overflow"> <div class="off-canvas-left js-off-canvas-left"> <div class="off-canvas-left__top"> <a href="https://codecanyon.net">Envato Market</a> </div> <div class="off-canvas-left__current-site -color-codecanyon"> <span class="off-canvas-left__site-title"> Code </span> <a class="off-canvas-left__current-site-toggle -white-arrow -color-codecanyon" data-view="dropdown" data-dropdown-target=".off-canvas-left__sites" href="#"></a> </div> <div class="off-canvas-left__sites is-hidden" id="off-canvas-sites"> <a class="off-canvas-left__site" href="https://themeforest.net/?auto_signin=true"> <span class="off-canvas-left__site-title"> Web Themes & Templates </span> <i class="e-icon -icon-right-open"></i> </a> <a class="off-canvas-left__site" href="https://videohive.net/?auto_signin=true"> <span class="off-canvas-left__site-title"> Video </span> <i class="e-icon -icon-right-open"></i> </a> <a class="off-canvas-left__site" href="https://audiojungle.net/?auto_signin=true"> <span class="off-canvas-left__site-title"> Audio </span> <i class="e-icon -icon-right-open"></i> </a> <a class="off-canvas-left__site" href="https://graphicriver.net/?auto_signin=true"> <span class="off-canvas-left__site-title"> Graphics </span> <i class="e-icon -icon-right-open"></i> </a> <a class="off-canvas-left__site" href="https://photodune.net/?auto_signin=true"> <span class="off-canvas-left__site-title"> Photos </span> <i class="e-icon -icon-right-open"></i> </a> <a class="off-canvas-left__site" href="https://3docean.net/?auto_signin=true"> <span class="off-canvas-left__site-title"> 3D Files </span> <i class="e-icon -icon-right-open"></i> </a></div> <div class="off-canvas-left__search"> <form id="search" action="/category/all" accept-charset="UTF-8" method="get"> <div class="search-field -border-none"> <div class="search-field__input"> <input id="term" name="term" type="search" placeholder="Search" class="search-field__input-field" /> </div> <button class="search-field__button" type="submit"> <i class="e-icon -icon-search"><span class="e-icon__alt">Search</span></i> </button> </div> </form></div> <ul> <li> <a class="off-canvas-category-link" data-view="dropdown" data-dropdown-target="#off-canvas-all-items" href="/category/all"> All Items </a> <ul class="is-hidden" id="off-canvas-all-items"> <li> <a class="off-canvas-category-link--sub" href="/top-sellers">Popular Files</a> </li> <li> <a class="off-canvas-category-link--sub" href="/feature">Featured Files</a> </li> <li> <a class="off-canvas-category-link--sub" href="/search?date=this-month&sort=sales">Top New Files</a> </li> <li> <a class="off-canvas-category-link--sub" href="/follow_feed">Follow Feed</a> </li> <li> <a class="off-canvas-category-link--sub" href="/authors/top">Top Authors</a> </li> <li> <a class="off-canvas-category-link--sub" href="/page/top_new_sellers">Top New Authors</a> </li> <li> <a class="off-canvas-category-link--sub" href="/collections">Public Collections</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category">View All Categories</a> </li> </ul> </li> <li> <a class="off-canvas-category-link" data-view="dropdown" data-dropdown-target="#off-canvas-php-scripts" href="/category/php-scripts"> PHP Scripts </a> <ul class="is-hidden" id="off-canvas-php-scripts"> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts">Show all PHP Scripts</a> </li> <li> <a class="off-canvas-category-link--sub" href="/popular_item/by_category?category=php-scripts">Popular Items</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/add-ons">Add-ons</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/calendars">Calendars</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/countdowns">Countdowns</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/database-abstractions">Database Abstractions</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/forms">Forms</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/help-and-support-tools">Help and Support Tools</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/images-and-media">Images and Media</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/loaders-and-uploaders">Loaders and Uploaders</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/navigation">Navigation</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/news-tickers">News Tickers</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/polls">Polls</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/project-management-tools">Project Management Tools</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/ratings-and-charts">Ratings and Charts</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/search">Search</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/shopping-carts">Shopping Carts</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/social-networking">Social Networking</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/php-scripts/miscellaneous">Miscellaneous</a> </li> </ul> </li> <li> <a class="off-canvas-category-link" data-view="dropdown" data-dropdown-target="#off-canvas-wordpress" href="/category/wordpress"> WordPress </a> <ul class="is-hidden" id="off-canvas-wordpress"> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress">Show all WordPress</a> </li> <li> <a class="off-canvas-category-link--sub" href="/popular_item/by_category?category=wordpress">Popular Items</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/add-ons">Add-ons</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/advertising">Advertising</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/calendars">Calendars</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/ecommerce">eCommerce</a> </li> <li> <a class="off-canvas-category-link--sub" href="/attributes/compatible-with/elementor">Elementor</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/forms">Forms</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/forums">Forums</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/galleries">Galleries</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/interface-elements">Interface Elements</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/media">Media</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/membership">Membership</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/newsletters">Newsletters</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/seo">SEO</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/social-networking">Social Networking</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/utilities">Utilities</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/widgets">Widgets</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/miscellaneous">Miscellaneous</a> </li> <li> <a class="off-canvas-category-link--sub" href="https://themeforest.net/category/wordpress">WordPress Themes on ThemeForest</a> </li> </ul> </li> <li> <a class="off-canvas-category-link" data-view="dropdown" data-dropdown-target="#off-canvas-ecommerce" href="/search/ecommerce"> eCommerce </a> <ul class="is-hidden" id="off-canvas-ecommerce"> <li> <a class="off-canvas-category-link--sub" href="/search/ecommerce">Show all eCommerce</a> </li> <li> <a class="off-canvas-category-link--sub" href="/search?compatible_with=Easy+Digital+Downloads">Easy Digital Downloads</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/ecommerce/jigoshop">Jigoshop</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/magento-extensions">Magento Extensions</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/opencart">OpenCart</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/oscommerce">osCommerce</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/prestashop">Prestashop</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/ubercart">UberCart</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/virtuemart">VirtueMart</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/ecommerce/woocommerce">WooCommerce</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/ecommerce/wp-e-commerce">WP e-Commerce</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/ecommerce/standalone">WP Standalone</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/zen-cart">Zen Cart</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/wordpress/ecommerce/miscellaneous">Miscellaneous</a> </li> </ul> </li> <li> <a class="off-canvas-category-link" data-view="dropdown" data-dropdown-target="#off-canvas-javascript" href="/category/javascript"> JavaScript </a> <ul class="is-hidden" id="off-canvas-javascript"> <li> <a class="off-canvas-category-link--sub" href="/category/javascript">Show all JavaScript</a> </li> <li> <a class="off-canvas-category-link--sub" href="/popular_item/by_category?category=javascript">Popular Items</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/animated-svgs">Animated SVGs</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/calendars">Calendars</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/countdowns">Countdowns</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/database-abstractions">Database Abstractions</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/forms">Forms</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/images-and-media">Images and Media</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/loaders-and-uploaders">Loaders and Uploaders</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/media">Media</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/navigation">Navigation</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/news-tickers">News Tickers</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/project-management-tools">Project Management Tools</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/ratings-and-charts">Ratings and Charts</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/shopping-carts">Shopping Carts</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/sliders">Sliders</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/social-networks">Social Networks</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/javascript/miscellaneous">Miscellaneous</a> </li> </ul> </li> <li> <a class="off-canvas-category-link" data-view="dropdown" data-dropdown-target="#off-canvas-css" href="/category/css"> CSS </a> <ul class="is-hidden" id="off-canvas-css"> <li> <a class="off-canvas-category-link--sub" href="/category/css">Show all CSS</a> </li> <li> <a class="off-canvas-category-link--sub" href="/popular_item/by_category?category=css">Popular Items</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/css/animations-and-effects">Animations and Effects</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/css/buttons">Buttons</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/css/charts-and-graphs">Charts and Graphs</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/css/forms">Forms</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/css/layouts">Layouts</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/css/navigation-and-menus">Navigation and Menus</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/css/pricing-tables">Pricing Tables</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/css/tabs-and-sliders">Tabs and Sliders</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/css/miscellaneous">Miscellaneous</a> </li> </ul> </li> <li> <a class="off-canvas-category-link" data-view="dropdown" data-dropdown-target="#off-canvas-mobile" href="/category/mobile"> Mobile </a> <ul class="is-hidden" id="off-canvas-mobile"> <li> <a class="off-canvas-category-link--sub" href="/category/mobile">Show all Mobile</a> </li> <li> <a class="off-canvas-category-link--sub" href="/popular_item/by_category?category=mobile">Popular Items</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/mobile/android">Android</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/mobile/flutter">Flutter</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/mobile/ios">iOS</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/mobile/native-web">Native Web</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/mobile/titanium">Titanium</a> </li> </ul> </li> <li> <a class="off-canvas-category-link" data-view="dropdown" data-dropdown-target="#off-canvas-html5" href="/category/html5"> HTML5 </a> <ul class="is-hidden" id="off-canvas-html5"> <li> <a class="off-canvas-category-link--sub" href="/category/html5">Show all HTML5</a> </li> <li> <a class="off-canvas-category-link--sub" href="/popular_item/by_category?category=html5">Popular Items</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/html5/3d">3D</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/html5/ad-templates">Ad Templates</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/html5/canvas">Canvas</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/html5/charts-and-graphs">Charts and Graphs</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/html5/forms">Forms</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/html5/games">Games</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/html5/libraries">Libraries</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/html5/media">Media</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/html5/presentations">Presentations</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/html5/sliders">Sliders</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/html5/storage">Storage</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/html5/templates">Templates</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/html5/miscellaneous">Miscellaneous</a> </li> </ul> </li> <li> <a class="off-canvas-category-link" data-view="dropdown" data-dropdown-target="#off-canvas-ai-tools" href="/search/ai"> AI Tools </a> <ul class="is-hidden" id="off-canvas-ai-tools"> <li> <a class="off-canvas-category-link--sub" href="/search/ai">Show all AI Tools</a> </li> <li> <a class="off-canvas-category-link--sub" href="/search/ai?sort=sales">Popular Items</a> </li> <li> <a class="off-canvas-category-link--sub" href="/search/ai%20content">AI Writers and Content Generators</a> </li> <li> <a class="off-canvas-category-link--sub" href="/search/ai%20image">AI Image and Video Generators</a> </li> <li> <a class="off-canvas-category-link--sub" href="/search/ai%20chat">AI Chatbots</a> </li> </ul> </li> <li> <a class="off-canvas-category-link--empty" href="https://themeforest.net/category/wordpress"> WP Themes </a> </li> <li> <a class="off-canvas-category-link" data-view="dropdown" data-dropdown-target="#off-canvas-plugins" href="/category/plugins"> Plugins </a> <ul class="is-hidden" id="off-canvas-plugins"> <li> <a class="off-canvas-category-link--sub" href="/category/plugins">Show all Plugins</a> </li> <li> <a class="off-canvas-category-link--sub" href="/popular_item/by_category?category=plugins">Popular Items</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/concrete5">Concrete5</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/drupal">Drupal</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/expressionengine">ExpressionEngine</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/joomla">Joomla</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/magento-extensions">Magento Extensions</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/muse-widgets">Muse Widgets</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/opencart">OpenCart</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/oscommerce">osCommerce</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/prestashop">Prestashop</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/ubercart">Ubercart</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/virtuemart">VirtueMart</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/zen-cart">Zen Cart</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/plugins/miscellaneous">Miscellaneous</a> </li> </ul> </li> <li> <a class="off-canvas-category-link--empty" href="https://placeit.net/mockup-generator?utm_source=envatomarket&utm_medium=promos&utm_campaign=placeit_mkt-menu-photos&utm_content=mockup_generator"> Mockup Generator </a> </li> <li> <a class="off-canvas-category-link" data-view="dropdown" data-dropdown-target="#off-canvas-more" href="/category"> More </a> <ul class="is-hidden" id="off-canvas-more"> <li> <a class="off-canvas-category-link--sub" href="/category/net">.NET</a> </li> <li> <a class="off-canvas-category-link--sub" href="/category/apps">Apps</a> </li> <li> <a class="off-canvas-category-link--sub" href="/search?term=facebook&type=files">Facebook</a> </li> </ul> </li> <li> <a class="elements-nav__category-link external-link" target="_blank" data-analytics-view-payload="{"eventName":"view_promotion","contextDetail":"site switcher","ecommerce":{"promotionId":"switcher_mobile_31JUL2024","promotionName":"switcher_mobile_31JUL2024","promotionType":"elements referral"}}" data-analytics-click-payload="{"eventName":"select_promotion","contextDetail":"site switcher","ecommerce":{"promotionId":"switcher_mobile_31JUL2024","promotionName":"switcher_mobile_31JUL2024","promotionType":"elements referral"}}" href="https://elements.envato.com/?utm_campaign=switcher_mobile_31JUL2024&utm_medium=referral&utm_source=codecanyon.net">Unlimited Downloads</a> </li> </ul> </div> </div> <div class="page__off-canvas--right overflow"> <div class="off-canvas-right"> <a class="off-canvas-right__link--cart" href="/cart"> Guest Cart <div class="shopping-cart-summary is-empty" data-view="cartCount"> <span class="js-cart-summary-count shopping-cart-summary__count">0</span> <i class="e-icon -icon-cart"></i> </div> </a> <a class="off-canvas-right__link" href="/sign_up"> Create an Envato Account <i class="e-icon -icon-envato"></i> </a> <a class="off-canvas-right__link" href="/sign_in"> Sign In <i class="e-icon -icon-login"></i> </a> </div> </div> <div class="page__canvas"> <div class="canvas"> <div class="canvas__header"> <header class="site-header"> <div class="site-header__mini is-hidden-desktop"> <div class="header-mini"> <div class="header-mini__button--cart"> <a class="btn btn--square" href="/cart"> <svg width="14px" height="14px" viewBox="0 0 14 14" class="header-mini__button-cart-icon" xmlns="http://www.w3.org/2000/svg" aria-labelledby="title" role="img"> <title>Cart</title> <path d="M 0.009 1.349 C 0.009 1.753 0.347 2.086 0.765 2.086 C 0.765 2.086 0.766 2.086 0.767 2.086 L 0.767 2.09 L 2.289 2.09 L 5.029 7.698 L 4.001 9.507 C 3.88 9.714 3.812 9.958 3.812 10.217 C 3.812 11.028 4.496 11.694 5.335 11.694 L 14.469 11.694 L 14.469 11.694 C 14.886 11.693 15.227 11.36 15.227 10.957 C 15.227 10.552 14.886 10.221 14.469 10.219 L 14.469 10.217 L 5.653 10.217 C 5.547 10.217 5.463 10.135 5.463 10.031 L 5.487 9.943 L 6.171 8.738 L 11.842 8.738 C 12.415 8.738 12.917 8.436 13.175 7.978 L 15.901 3.183 C 15.96 3.08 15.991 2.954 15.991 2.828 C 15.991 2.422 15.65 2.09 15.23 2.09 L 3.972 2.09 L 3.481 1.077 L 3.466 1.043 C 3.343 0.79 3.084 0.612 2.778 0.612 C 2.777 0.612 0.765 0.612 0.765 0.612 C 0.347 0.612 0.009 0.943 0.009 1.349 Z M 3.819 13.911 C 3.819 14.724 4.496 15.389 5.335 15.389 C 6.171 15.389 6.857 14.724 6.857 13.911 C 6.857 13.097 6.171 12.434 5.335 12.434 C 4.496 12.434 3.819 13.097 3.819 13.911 Z M 11.431 13.911 C 11.431 14.724 12.11 15.389 12.946 15.389 C 13.784 15.389 14.469 14.724 14.469 13.911 C 14.469 13.097 13.784 12.434 12.946 12.434 C 12.11 12.434 11.431 13.097 11.431 13.911 Z"></path> </svg> <span class="is-hidden">Cart</span> <span class="header-mini__button-cart-cart-amount is-hidden"> 0 </span> </a> </div> <div class="header-mini__button--account"> <a class="btn btn--square" data-view="offCanvasNavToggle" data-off-canvas="right" href="#account"> <i class="e-icon -icon-person"></i> <span class="is-hidden">Account</span> </a> </div> <div class="header-mini__button--categories"> <a class="btn btn--square" data-view="offCanvasNavToggle" data-off-canvas="left" href="#categories"> <i class="e-icon -icon-hamburger"></i> <span class="is-hidden">Sites, Search & Categories</span> </a> </div> <div class="header-mini__logo"> <a href="https://codecanyon.net/?auto_signin=true"> <img alt="CodeCanyon" class="header-mini__logo--codecanyon" src="https://public-assets.envato-static.com/assets/common/transparent-1px-1f61547480c17dc67dd9a6c38545a5911cc4a8024f6f3c0992e7c1c81fb37578.png" /> </a></div> </div> </div> <div class="global-header is-hidden-tablet-and-below"> <div class='grid-container -layout-wide'> <div class='global-header__wrapper'> <a href="https://codecanyon.net"> <img height="20" alt="Envato Market" class="global-header__logo" src="https://public-assets.envato-static.com/assets/logos/envato_market-dd390ae860330996644c1c109912d2bf63885fc075b87215ace9b5b4bdc71cc8.svg" /> </a> <nav class='global-header-menu' role='navigation'> <ul class='global-header-menu__list'> <li class='global-header-menu__list-item'> <a class="global-header-menu__link" href="https://forums.envato.com"> <span class='global-header-menu__link-text'> Forums </span> </a> </li> <li class='global-header-menu__list-item'> <a class="global-header-menu__link" href="https://author.envato.com"> <span class='global-header-menu__link-text'> Start Selling </span> </a> </li> <li data-view="globalHeaderMenuDropdownHandler" class='global-header-menu__list-item--with-dropdown'> <a data-lazy-load-trigger="mouseover" class="global-header-menu__link" href="#"> <svg width="16px" height="16px" viewBox="0 0 16 16" class="global-header-menu__icon" xmlns="http://www.w3.org/2000/svg" aria-labelledby="title" role="img"> <title>Menu</title> <path d="M3.5 2A1.5 1.5 0 0 1 5 3.5 1.5 1.5 0 0 1 3.5 5 1.5 1.5 0 0 1 2 3.5 1.5 1.5 0 0 1 3.5 2zM8 2a1.5 1.5 0 0 1 1.5 1.5A1.5 1.5 0 0 1 8 5a1.5 1.5 0 0 1-1.5-1.5A1.5 1.5 0 0 1 8 2zM12.5 2A1.5 1.5 0 0 1 14 3.5 1.5 1.5 0 0 1 12.5 5 1.5 1.5 0 0 1 11 3.5 1.5 1.5 0 0 1 12.5 2zM3.5 6.5A1.5 1.5 0 0 1 5 8a1.5 1.5 0 0 1-1.5 1.5A1.5 1.5 0 0 1 2 8a1.5 1.5 0 0 1 1.5-1.5zM8 6.5A1.5 1.5 0 0 1 9.5 8 1.5 1.5 0 0 1 8 9.5 1.5 1.5 0 0 1 6.5 8 1.5 1.5 0 0 1 8 6.5zM12.5 6.5A1.5 1.5 0 0 1 14 8a1.5 1.5 0 0 1-1.5 1.5A1.5 1.5 0 0 1 11 8a1.5 1.5 0 0 1 1.5-1.5zM3.5 11A1.5 1.5 0 0 1 5 12.5 1.5 1.5 0 0 1 3.5 14 1.5 1.5 0 0 1 2 12.5 1.5 1.5 0 0 1 3.5 11zM8 11a1.5 1.5 0 0 1 1.5 1.5A1.5 1.5 0 0 1 8 14a1.5 1.5 0 0 1-1.5-1.5A1.5 1.5 0 0 1 8 11zM12.5 11a1.5 1.5 0 0 1 1.5 1.5 1.5 1.5 0 0 1-1.5 1.5 1.5 1.5 0 0 1-1.5-1.5 1.5 1.5 0 0 1 1.5-1.5z"></path> </svg> <span class='global-header-menu__link-text'> Our Products </span> </a> <div class='global-header-menu__dropdown-container'> <div class='global-header-dropdown'> <ul class='global-header-dropdown__list'> <li> <a class="global-header-dropdown__link" data-analytics-view-payload="{"eventName":"view_promotion","contextDetail":"product picker","ecommerce":{"promotionId":"elements_mkt-headernav_our_products_26AUG2024","promotionName":"elements_mkt-headernav_our_products_26AUG2024","promotionType":"elements referral"}}" data-analytics-click-payload="{"eventName":"select_promotion","contextDetail":"product picker","ecommerce":{"promotionId":"elements_mkt-headernav_our_products_26AUG2024","promotionName":"elements_mkt-headernav_our_products_26AUG2024","promotionType":"elements referral"}}" title="The unlimited creative subscription" target="_blank" href="https://elements.envato.com?utm_source=envatomarket&utm_medium=promos&utm_campaign=elements_mkt-headernav_our_products_26AUG2024&utm_content=headernav"> <span data-src="https://public-assets.envato-static.com/assets/header/EnvatoElements-logo-4f70ffb865370a5fb978e9a1fc5bbedeeecdfceb8d0ebec2186aef4bee5db79d.svg" data-alt="Envato Elements" data-class="global-header-dropdown__product-logo" class="lazy-load-img global-header-dropdown__product-logo"></span> <span class="global-header-dropdown__link-text -decoration-none">The unlimited creative subscription</span> </a> </li> <li> <a class="global-header-dropdown__link" data-analytics-view-payload="{"eventName":"view_promotion","contextDetail":"product picker","ecommerce":{"promotionId":"tutsplus_mkt-headernav_our_products_26AUG2024","promotionName":"tutsplus_mkt-headernav_our_products_26AUG2024","promotionType":""}}" data-analytics-click-payload="{"eventName":"select_promotion","contextDetail":"product picker","ecommerce":{"promotionId":"tutsplus_mkt-headernav_our_products_26AUG2024","promotionName":"tutsplus_mkt-headernav_our_products_26AUG2024","promotionType":""}}" title="Free creative tutorials and courses" target="_blank" href="https://tutsplus.com?utm_source=envatomarket&utm_medium=promos&utm_campaign=tutsplus_mkt-headernav_our_products_26AUG2024&&utm_content=headernav"> <span data-src="https://public-assets.envato-static.com/assets/header/EnvatoTuts-logo-5bb3e97bcf5ed243facca8a3dfada1cb1c916ab65d5ab88a541fbe9aface742b.svg" data-alt="Tuts+" data-class="global-header-dropdown__product-logo" class="lazy-load-img global-header-dropdown__product-logo"></span> <span class="global-header-dropdown__link-text -decoration-none">Free creative tutorials and courses</span> </a> </li> <li> <a class="global-header-dropdown__link" data-analytics-view-payload="{"eventName":"view_promotion","contextDetail":"product picker","ecommerce":{"promotionId":"placeit_mkt-headernav_our_products_26AUG2024","promotionName":"placeit_mkt-headernav_our_products_26AUG2024","promotionType":""}}" data-analytics-click-payload="{"eventName":"select_promotion","contextDetail":"product picker","ecommerce":{"promotionId":"placeit_mkt-headernav_our_products_26AUG2024","promotionName":"placeit_mkt-headernav_our_products_26AUG2024","promotionType":""}}" title="Customize mockups, design and video" target="_blank" href="https://placeit.net?utm_source=envatomarket&utm_medium=promos&utm_campaign=placeit_mkt-headernav_our_products_26AUG2024&utm_content=headernav"> <span data-src="https://public-assets.envato-static.com/assets/header/Placeit-logo-db4c3dfdec1cbc06ecfc092e600ff2712795f60ce4c50b32c93d450006d7ea8d.svg" data-alt="Placeit by Envato" data-class="global-header-dropdown__product-logo" class="lazy-load-img global-header-dropdown__product-logo"></span> <span class="global-header-dropdown__link-text -decoration-none">Customize mockups, design and video</span> </a> </li> </ul> <div class='global-header-dropdown-footer'> <ul> <li class='global-header-dropdown-footer__list-item'> Join the <a class="global-header-dropdown-footer__link" target="_blank" href="http://community.envato.com"> Envato community </a> </li> <li class='global-header-dropdown-footer__list-item'> Learn from others in <a class="global-header-dropdown-footer__link" target="_blank" href="https://forums.envato.com"> the forums </a> </li> </ul> </div> </div> </div> </li> <li class='global-header-menu__list-item -background-light -border-radius'> <a id="spec-link-cart" class="global-header-menu__link h-pr1" href="/cart"> <svg width="16px" height="16px" viewBox="0 0 16 16" class="global-header-menu__icon global-header-menu__icon-cart" xmlns="http://www.w3.org/2000/svg" aria-labelledby="title" role="img"> <title>Cart</title> <path d="M 0.009 1.349 C 0.009 1.753 0.347 2.086 0.765 2.086 C 0.765 2.086 0.766 2.086 0.767 2.086 L 0.767 2.09 L 2.289 2.09 L 5.029 7.698 L 4.001 9.507 C 3.88 9.714 3.812 9.958 3.812 10.217 C 3.812 11.028 4.496 11.694 5.335 11.694 L 14.469 11.694 L 14.469 11.694 C 14.886 11.693 15.227 11.36 15.227 10.957 C 15.227 10.552 14.886 10.221 14.469 10.219 L 14.469 10.217 L 5.653 10.217 C 5.547 10.217 5.463 10.135 5.463 10.031 L 5.487 9.943 L 6.171 8.738 L 11.842 8.738 C 12.415 8.738 12.917 8.436 13.175 7.978 L 15.901 3.183 C 15.96 3.08 15.991 2.954 15.991 2.828 C 15.991 2.422 15.65 2.09 15.23 2.09 L 3.972 2.09 L 3.481 1.077 L 3.466 1.043 C 3.343 0.79 3.084 0.612 2.778 0.612 C 2.777 0.612 0.765 0.612 0.765 0.612 C 0.347 0.612 0.009 0.943 0.009 1.349 Z M 3.819 13.911 C 3.819 14.724 4.496 15.389 5.335 15.389 C 6.171 15.389 6.857 14.724 6.857 13.911 C 6.857 13.097 6.171 12.434 5.335 12.434 C 4.496 12.434 3.819 13.097 3.819 13.911 Z M 11.431 13.911 C 11.431 14.724 12.11 15.389 12.946 15.389 C 13.784 15.389 14.469 14.724 14.469 13.911 C 14.469 13.097 13.784 12.434 12.946 12.434 C 12.11 12.434 11.431 13.097 11.431 13.911 Z"></path> </svg> <span class="global-header-menu__link-cart-amount is-hidden" data-view="headerCartCount" data-test-id="header_cart_count">0</span> </a></li> <li class='global-header-menu__list-item -background-light -border-radius'> <a class="global-header-menu__link h-pl1" data-view="modalAjax" href="/sign_in"> <span id="spec-user-username" class='global-header-menu__link-text'> Sign In </span> </a> </li> </ul> </nav> </div> </div> </div> <div class="site-header__sites is-hidden-tablet-and-below"> <div class="header-sites header-site-titles"> <div class="grid-container -layout-wide"> <nav class="header-site-titles__container"> <div class="header-site-titles__site"> <a class="header-site-titles__link t-link" alt="Web Templates" href="https://themeforest.net/?auto_signin=true">Web Themes & Templates</a> </div> <div class="header-site-titles__site"> <a class="header-site-titles__link t-link is-active" alt="Code" href="https://codecanyon.net/?auto_signin=true">Code</a> </div> <div class="header-site-titles__site"> <a class="header-site-titles__link t-link" alt="Video" href="https://videohive.net/?auto_signin=true">Video</a> </div> <div class="header-site-titles__site"> <a class="header-site-titles__link t-link" alt="Music" href="https://audiojungle.net/?auto_signin=true">Audio</a> </div> <div class="header-site-titles__site"> <a class="header-site-titles__link t-link" alt="Graphics" href="https://graphicriver.net/?auto_signin=true">Graphics</a> </div> <div class="header-site-titles__site"> <a class="header-site-titles__link t-link" alt="Photos" href="https://photodune.net/?auto_signin=true">Photos</a> </div> <div class="header-site-titles__site"> <a class="header-site-titles__link t-link" alt="3D Files" href="https://3docean.net/?auto_signin=true">3D Files</a> </div> <div class="header-site-titles__site elements-nav__container"> <a class="header-site-titles__link t-link elements-nav__main-link" href="https://elements.envato.com/?utm_campaign=elements_mkt-switcher_31JUL2024&utm_content=cc_item_55414390&utm_medium=referral&utm_source=codecanyon.net" target="_blank" > <span> Unlimited Downloads </span> </a> <a target="_blank" class="elements-nav__dropdown-container unique-selling-points__variant" data-analytics-view-payload="{"eventName":"view_promotion","contextDetail":"site switcher","ecommerce":{"promotionId":"elements_mkt-switcher_31JUL2024","promotionName":"elements_mkt-switcher_31JUL2024","promotionType":"elements referral"}}" data-analytics-click-payload="{"eventName":"select_promotion","contextDetail":"site switcher","ecommerce":{"promotionId":"elements_mkt-switcher_31JUL2024","promotionName":"elements_mkt-switcher_31JUL2024","promotionType":"elements referral"}}" href="https://elements.envato.com/?utm_campaign=elements_mkt-switcher_31JUL2024&utm_content=cc_item_55414390&utm_medium=referral&utm_source=codecanyon.net"> <div class="elements-nav__main-panel"> <img class="elements-nav__logo-container" loading="lazy" src="https://public-assets.envato-static.com/assets/header/EnvatoElements-logo-4f70ffb865370a5fb978e9a1fc5bbedeeecdfceb8d0ebec2186aef4bee5db79d.svg" alt="Elements logo" height="23" width="101" > <div class="elements-nav__punch-line"> <h2> Looking for unlimited downloads? </h2> <p> Subscribe to Envato Elements. <ul> <li> <img src="https://public-assets.envato-static.com/assets/header/badge-a65149663b95bcee411e80ccf4da9788f174155587980d8f1d9c44fd8b59edd8.svg" alt="badge" width="20" height="20" > Millions of premium assets </li> <li> <img src="https://public-assets.envato-static.com/assets/header/thumbs_up-e5ce4c821cfd6a6aeba61127a8e8c4d2d7c566e654f588a22708c64d66680869.svg" alt="thumbs up" width="20" height="20" > Great value subscription </li> </ul> <button class="brand-neue-button brand-neue-button__open-in-new elements-nav__cta">Let's create</button> </p> </div> </div> <div class="elements-nav__secondary-panel"> <img class="elements-nav__secondary-panel__collage" loading="lazy" src="https://public-assets.envato-static.com/assets/header/items-collage-1x-a39e4a5834e75c32a634cc7311720baa491687b1aaa4b709ebd1acf0f8427b53.png" srcset="https://public-assets.envato-static.com/assets/header/items-collage-2x-75e1ad16a46b9788861780a57feeb5fd1ad1026ecce9330302f0ef8f6f542697.png 2x" alt="Collage of Elements items" width="267" height="233" > </div> </a></div> <div class="header-site-floating-logo__container"> <div class=header-site-floating-logo__codecanyon ></div> </div> </nav> </div> </div> </div> <div class="site-header__categories is-hidden-tablet-and-below"> <div class="header-categories"> <div class="grid-container -layout-wide"> <ul class="header-categories__links"> <li class="header-categories__links-item"> <a class="header-categories__main-link" data-view="touchOnlyDropdown" data-dropdown-target=".js-categories-0-dropdown" href="/category/all"> All Items </a> <div class="header-categories__links-dropdown js-categories-0-dropdown"> <ul class="header-dropdown"> <li> <a class="" href="/top-sellers">Popular Files</a> </li> <li> <a class="" href="/feature">Featured Files</a> </li> <li> <a class="" href="/search?date=this-month&sort=sales">Top New Files</a> </li> <li> <a class="" href="/follow_feed">Follow Feed</a> </li> <li> <a class="" href="/authors/top">Top Authors</a> </li> <li> <a class="" href="/page/top_new_sellers">Top New Authors</a> </li> <li> <a class="" href="/collections">Public Collections</a> </li> <li> <a class="" href="/category">View All Categories</a> </li> </ul> </div> </li> <li class="header-categories__links-item"> <a class="header-categories__main-link" data-view="touchOnlyDropdown" data-dropdown-target=".js-categories-1-dropdown" href="/category/php-scripts"> PHP Scripts </a> <div class="header-categories__links-dropdown js-categories-1-dropdown"> <ul class="header-dropdown"> <li> <a class=" header-dropdown__top" href="/popular_item/by_category?category=php-scripts">Popular Items</a> </li> <li> <a class="" href="/category/php-scripts/add-ons">Add-ons</a> </li> <li> <a class="" href="/category/php-scripts/calendars">Calendars</a> </li> <li> <a class="" href="/category/php-scripts/countdowns">Countdowns</a> </li> <li> <a class="" href="/category/php-scripts/database-abstractions">Database Abstractions</a> </li> <li> <a class="" href="/category/php-scripts/forms">Forms</a> </li> <li> <a class="" href="/category/php-scripts/help-and-support-tools">Help and Support Tools</a> </li> <li> <a class="" href="/category/php-scripts/images-and-media">Images and Media</a> </li> <li> <a class="" href="/category/php-scripts/loaders-and-uploaders">Loaders and Uploaders</a> </li> <li> <a class="" href="/category/php-scripts/navigation">Navigation</a> </li> <li> <a class="" href="/category/php-scripts/news-tickers">News Tickers</a> </li> <li> <a class="" href="/category/php-scripts/polls">Polls</a> </li> <li> <a class="" href="/category/php-scripts/project-management-tools">Project Management Tools</a> </li> <li> <a class="" href="/category/php-scripts/ratings-and-charts">Ratings and Charts</a> </li> <li> <a class="" href="/category/php-scripts/search">Search</a> </li> <li> <a class="" href="/category/php-scripts/shopping-carts">Shopping Carts</a> </li> <li> <a class="" href="/category/php-scripts/social-networking">Social Networking</a> </li> <li> <a class="" href="/category/php-scripts/miscellaneous">Miscellaneous</a> </li> </ul> </div> </li> <li class="header-categories__links-item"> <a class="header-categories__main-link" data-view="touchOnlyDropdown" data-dropdown-target=".js-categories-2-dropdown" href="/category/wordpress"> WordPress </a> <div class="header-categories__links-dropdown js-categories-2-dropdown"> <ul class="header-dropdown"> <li> <a class=" header-dropdown__top" href="/popular_item/by_category?category=wordpress">Popular Items</a> </li> <li> <a class="" href="/category/wordpress/add-ons">Add-ons</a> </li> <li> <a class="" href="/category/wordpress/advertising">Advertising</a> </li> <li> <a class="" href="/category/wordpress/calendars">Calendars</a> </li> <li> <a class="" href="/category/wordpress/ecommerce">eCommerce</a> </li> <li> <a class="" href="/attributes/compatible-with/elementor">Elementor</a> </li> <li> <a class="" href="/category/wordpress/forms">Forms</a> </li> <li> <a class="" href="/category/wordpress/forums">Forums</a> </li> <li> <a class="" href="/category/wordpress/galleries">Galleries</a> </li> <li> <a class="" href="/category/wordpress/interface-elements">Interface Elements</a> </li> <li> <a class="" href="/category/wordpress/media">Media</a> </li> <li> <a class="" href="/category/wordpress/membership">Membership</a> </li> <li> <a class="" href="/category/wordpress/newsletters">Newsletters</a> </li> <li> <a class="" href="/category/wordpress/seo">SEO</a> </li> <li> <a class="" href="/category/wordpress/social-networking">Social Networking</a> </li> <li> <a class="" href="/category/wordpress/utilities">Utilities</a> </li> <li> <a class="" href="/category/wordpress/widgets">Widgets</a> </li> <li> <a class="" href="/category/wordpress/miscellaneous">Miscellaneous</a> </li> <li> <a class=" header-dropdown__bottom" href="https://themeforest.net/category/wordpress">WordPress Themes on ThemeForest</a> </li> </ul> </div> </li> <li class="header-categories__links-item"> <a class="header-categories__main-link" data-view="touchOnlyDropdown" data-dropdown-target=".js-categories-3-dropdown" href="/search/ecommerce"> eCommerce </a> <div class="header-categories__links-dropdown js-categories-3-dropdown"> <ul class="header-dropdown"> <li> <a class="" href="/search?compatible_with=Easy+Digital+Downloads">Easy Digital Downloads</a> </li> <li> <a class="" href="/category/wordpress/ecommerce/jigoshop">Jigoshop</a> </li> <li> <a class="" href="/category/plugins/magento-extensions">Magento Extensions</a> </li> <li> <a class="" href="/category/plugins/opencart">OpenCart</a> </li> <li> <a class="" href="/category/plugins/oscommerce">osCommerce</a> </li> <li> <a class="" href="/category/plugins/prestashop">Prestashop</a> </li> <li> <a class="" href="/category/plugins/ubercart">UberCart</a> </li> <li> <a class="" href="/category/plugins/virtuemart">VirtueMart</a> </li> <li> <a class="" href="/category/wordpress/ecommerce/woocommerce">WooCommerce</a> </li> <li> <a class="" href="/category/wordpress/ecommerce/wp-e-commerce">WP e-Commerce</a> </li> <li> <a class="" href="/category/wordpress/ecommerce/standalone">WP Standalone</a> </li> <li> <a class="" href="/category/plugins/zen-cart">Zen Cart</a> </li> <li> <a class="" href="/category/wordpress/ecommerce/miscellaneous">Miscellaneous</a> </li> </ul> </div> </li> <li class="header-categories__links-item"> <a class="header-categories__main-link" data-view="touchOnlyDropdown" data-dropdown-target=".js-categories-4-dropdown" href="/category/javascript"> JavaScript </a> <div class="header-categories__links-dropdown js-categories-4-dropdown"> <ul class="header-dropdown"> <li> <a class=" header-dropdown__top" href="/popular_item/by_category?category=javascript">Popular Items</a> </li> <li> <a class="" href="/category/javascript/animated-svgs">Animated SVGs</a> </li> <li> <a class="" href="/category/javascript/calendars">Calendars</a> </li> <li> <a class="" href="/category/javascript/countdowns">Countdowns</a> </li> <li> <a class="" href="/category/javascript/database-abstractions">Database Abstractions</a> </li> <li> <a class="" href="/category/javascript/forms">Forms</a> </li> <li> <a class="" href="/category/javascript/images-and-media">Images and Media</a> </li> <li> <a class="" href="/category/javascript/loaders-and-uploaders">Loaders and Uploaders</a> </li> <li> <a class="" href="/category/javascript/media">Media</a> </li> <li> <a class="" href="/category/javascript/navigation">Navigation</a> </li> <li> <a class="" href="/category/javascript/news-tickers">News Tickers</a> </li> <li> <a class="" href="/category/javascript/project-management-tools">Project Management Tools</a> </li> <li> <a class="" href="/category/javascript/ratings-and-charts">Ratings and Charts</a> </li> <li> <a class="" href="/category/javascript/shopping-carts">Shopping Carts</a> </li> <li> <a class="" href="/category/javascript/sliders">Sliders</a> </li> <li> <a class="" href="/category/javascript/social-networks">Social Networks</a> </li> <li> <a class="" href="/category/javascript/miscellaneous">Miscellaneous</a> </li> </ul> </div> </li> <li class="header-categories__links-item"> <a class="header-categories__main-link" data-view="touchOnlyDropdown" data-dropdown-target=".js-categories-5-dropdown" href="/category/css"> CSS </a> <div class="header-categories__links-dropdown js-categories-5-dropdown"> <ul class="header-dropdown"> <li> <a class=" header-dropdown__top" href="/popular_item/by_category?category=css">Popular Items</a> </li> <li> <a class="" href="/category/css/animations-and-effects">Animations and Effects</a> </li> <li> <a class="" href="/category/css/buttons">Buttons</a> </li> <li> <a class="" href="/category/css/charts-and-graphs">Charts and Graphs</a> </li> <li> <a class="" href="/category/css/forms">Forms</a> </li> <li> <a class="" href="/category/css/layouts">Layouts</a> </li> <li> <a class="" href="/category/css/navigation-and-menus">Navigation and Menus</a> </li> <li> <a class="" href="/category/css/pricing-tables">Pricing Tables</a> </li> <li> <a class="" href="/category/css/tabs-and-sliders">Tabs and Sliders</a> </li> <li> <a class="" href="/category/css/miscellaneous">Miscellaneous</a> </li> </ul> </div> </li> <li class="header-categories__links-item"> <a class="header-categories__main-link" data-view="touchOnlyDropdown" data-dropdown-target=".js-categories-6-dropdown" href="/category/mobile"> Mobile </a> <div class="header-categories__links-dropdown js-categories-6-dropdown"> <ul class="header-dropdown"> <li> <a class=" header-dropdown__top" href="/popular_item/by_category?category=mobile">Popular Items</a> </li> <li> <a class="" href="/category/mobile/android">Android</a> </li> <li> <a class="" href="/category/mobile/flutter">Flutter</a> </li> <li> <a class="" href="/category/mobile/ios">iOS</a> </li> <li> <a class="" href="/category/mobile/native-web">Native Web</a> </li> <li> <a class="" href="/category/mobile/titanium">Titanium</a> </li> </ul> </div> </li> <li class="header-categories__links-item"> <a class="header-categories__main-link" data-view="touchOnlyDropdown" data-dropdown-target=".js-categories-7-dropdown" href="/category/html5"> HTML5 </a> <div class="header-categories__links-dropdown js-categories-7-dropdown"> <ul class="header-dropdown"> <li> <a class=" header-dropdown__top" href="/popular_item/by_category?category=html5">Popular Items</a> </li> <li> <a class="" href="/category/html5/3d">3D</a> </li> <li> <a class="" href="/category/html5/ad-templates">Ad Templates</a> </li> <li> <a class="" href="/category/html5/canvas">Canvas</a> </li> <li> <a class="" href="/category/html5/charts-and-graphs">Charts and Graphs</a> </li> <li> <a class="" href="/category/html5/forms">Forms</a> </li> <li> <a class="" href="/category/html5/games">Games</a> </li> <li> <a class="" href="/category/html5/libraries">Libraries</a> </li> <li> <a class="" href="/category/html5/media">Media</a> </li> <li> <a class="" href="/category/html5/presentations">Presentations</a> </li> <li> <a class="" href="/category/html5/sliders">Sliders</a> </li> <li> <a class="" href="/category/html5/storage">Storage</a> </li> <li> <a class="" href="/category/html5/templates">Templates</a> </li> <li> <a class="" href="/category/html5/miscellaneous">Miscellaneous</a> </li> </ul> </div> </li> <li class="header-categories__links-item"> <a class="header-categories__main-link" data-view="touchOnlyDropdown" data-dropdown-target=".js-categories-8-dropdown" href="/search/ai"> AI Tools </a> <div class="header-categories__links-dropdown js-categories-8-dropdown"> <ul class="header-dropdown"> <li> <a class=" header-dropdown__top" href="/search/ai?sort=sales">Popular Items</a> </li> <li> <a class="" href="/search/ai%20content">AI Writers and Content Generators</a> </li> <li> <a class="" href="/search/ai%20image">AI Image and Video Generators</a> </li> <li> <a class="" href="/search/ai%20chat">AI Chatbots</a> </li> </ul> </div> </li> <li class="header-categories__links-item"> <a class="header-categories__main-link header-categories__main-link--empty" href="https://themeforest.net/category/wordpress"> WP Themes </a> </li> <li class="header-categories__links-item"> <a class="header-categories__main-link" data-view="touchOnlyDropdown" data-dropdown-target=".js-categories-10-dropdown" href="/category/plugins"> Plugins </a> <div class="header-categories__links-dropdown js-categories-10-dropdown"> <ul class="header-dropdown"> <li> <a class=" header-dropdown__top" href="/popular_item/by_category?category=plugins">Popular Items</a> </li> <li> <a class="" href="/category/plugins/concrete5">Concrete5</a> </li> <li> <a class="" href="/category/plugins/drupal">Drupal</a> </li> <li> <a class="" href="/category/plugins/expressionengine">ExpressionEngine</a> </li> <li> <a class="" href="/category/plugins/joomla">Joomla</a> </li> <li> <a class="" href="/category/plugins/magento-extensions">Magento Extensions</a> </li> <li> <a class="" href="/category/plugins/muse-widgets">Muse Widgets</a> </li> <li> <a class="" href="/category/plugins/opencart">OpenCart</a> </li> <li> <a class="" href="/category/plugins/oscommerce">osCommerce</a> </li> <li> <a class="" href="/category/plugins/prestashop">Prestashop</a> </li> <li> <a class="" href="/category/plugins/ubercart">Ubercart</a> </li> <li> <a class="" href="/category/plugins/virtuemart">VirtueMart</a> </li> <li> <a class="" href="/category/plugins/zen-cart">Zen Cart</a> </li> <li> <a class="" href="/category/plugins/miscellaneous">Miscellaneous</a> </li> </ul> </div> </li> <li class="header-categories__links-item"> <a rel="noopener" target="_blank" class="header-categories__main-link header-categories__main-link--empty header-categories__main-link--offsite_icon" href="https://placeit.net/mockup-generator?utm_source=envatomarket&utm_medium=promos&utm_campaign=placeit_mkt-menu-photos&utm_content=mockup_generator"> Mockup Generator </a> </li> <li class="header-categories__links-item"> <a class="header-categories__main-link" data-view="touchOnlyDropdown" data-dropdown-target=".js-categories-12-dropdown" href="/category"> More </a> <div class="header-categories__links-dropdown js-categories-12-dropdown"> <ul class="header-dropdown"> <li> <a class="" href="/category/net">.NET</a> </li> <li> <a class="" href="/category/apps">Apps</a> </li> <li> <a class="" href="/search?term=facebook&type=files">Facebook</a> </li> </ul> </div> </li> </ul> <div class="header-categories__search"> <form id="search" data-view="searchField" action="/category/all" accept-charset="UTF-8" method="get"> <div class="search-field -border-light h-ml2"> <div class="search-field__input"> <input id="term" name="term" class="js-term search-field__input-field" type="search" placeholder="Search" /> </div> <button class="search-field__button" type="submit"> <i class="e-icon -icon-search"><span class="e-icon__alt">Search</span></i> </button> </div> </form></div> </div> </div> </div> </header> </div> <div class="js-canvas__body canvas__body"> <div class="grid-container"> </div> <div class="context-header "> <div class="grid-container "> <nav class="breadcrumbs h-text-truncate "> <a class="js-breadcrumb-category" href="/">Home</a> <a href='/category/all' class="js-breadcrumb-category">Files</a> <a class="js-breadcrumb-category" href="https://codecanyon.net/category/css">CSS</a> <a class="js-breadcrumb-category" href="https://codecanyon.net/category/css/navigation-and-menus">Navigation and Menus</a> </nav> <div class="item-header" data-view="itemHeader"> <div class="item-header__top"> <div class="item-header__title"> <h1 class="t-heading -color-inherit -size-l h-m0 is-hidden-phone"> XMENU - Ultimate Responsive Mega Menu </h1> <h1 class="t-heading -color-inherit -size-xs h-m0 is-hidden-tablet-and-above"> XMENU - Ultimate Responsive Mega Menu </h1> </div> <div class="item-header__price is-hidden-desktop"> <a class="js-item-header__cart-button e-btn--3d -color-primary -size-m" rel="nofollow" title="Add to Cart" data-view="modalAjax" href="/cart/configure_before_adding/55414390"> <span class="item-header__cart-button-icon"> <i class="e-icon -icon-cart -margin-right"></i> </span> <span class="t-heading -size-m -color-light -margin-none"> <b class="t-currency"><span class="js-item-header__price">$9</span></b> </span> </a> </div> </div> <div class="item-header__details-section"> <div class="item-header__author-details"> By <a rel="author" class="js-by-author" href="/user/indiancoder">IndianCoder</a> </div> <div class="item-header__sales-count"> <svg width="16px" height="16px" viewBox="0 0 16 16" class="item-header__sales-count-icon" xmlns="http://www.w3.org/2000/svg" aria-labelledby="title" role="img"> <title>Cart</title> <path d="M 0.009 1.349 C 0.009 1.753 0.347 2.086 0.765 2.086 C 0.765 2.086 0.766 2.086 0.767 2.086 L 0.767 2.09 L 2.289 2.09 L 5.029 7.698 L 4.001 9.507 C 3.88 9.714 3.812 9.958 3.812 10.217 C 3.812 11.028 4.496 11.694 5.335 11.694 L 14.469 11.694 L 14.469 11.694 C 14.886 11.693 15.227 11.36 15.227 10.957 C 15.227 10.552 14.886 10.221 14.469 10.219 L 14.469 10.217 L 5.653 10.217 C 5.547 10.217 5.463 10.135 5.463 10.031 L 5.487 9.943 L 6.171 8.738 L 11.842 8.738 C 12.415 8.738 12.917 8.436 13.175 7.978 L 15.901 3.183 C 15.96 3.08 15.991 2.954 15.991 2.828 C 15.991 2.422 15.65 2.09 15.23 2.09 L 3.972 2.09 L 3.481 1.077 L 3.466 1.043 C 3.343 0.79 3.084 0.612 2.778 0.612 C 2.777 0.612 0.765 0.612 0.765 0.612 C 0.347 0.612 0.009 0.943 0.009 1.349 Z M 3.819 13.911 C 3.819 14.724 4.496 15.389 5.335 15.389 C 6.171 15.389 6.857 14.724 6.857 13.911 C 6.857 13.097 6.171 12.434 5.335 12.434 C 4.496 12.434 3.819 13.097 3.819 13.911 Z M 11.431 13.911 C 11.431 14.724 12.11 15.389 12.946 15.389 C 13.784 15.389 14.469 14.724 14.469 13.911 C 14.469 13.097 13.784 12.434 12.946 12.434 C 12.11 12.434 11.431 13.097 11.431 13.911 Z"></path> </svg> <strong>2</strong> sales </div> <div class="item-header__envato-highlighted"> <strong>Recently Updated</strong> <svg width="16px" height="16px" viewBox="0 0 14 14" class="item-header__envato-checkmark-icon" xmlns="http://www.w3.org/2000/svg" aria-labelledby="title" role="img"> <title></title> <path fill-rule="evenodd" clip-rule="evenodd" d="M0.333252 7.00004C0.333252 3.31814 3.31802 0.333374 6.99992 0.333374C8.76803 0.333374 10.4637 1.03575 11.714 2.286C12.9642 3.53624 13.6666 5.23193 13.6666 7.00004C13.6666 10.6819 10.6818 13.6667 6.99992 13.6667C3.31802 13.6667 0.333252 10.6819 0.333252 7.00004ZM6.15326 9.23337L9.89993 5.48671C10.0227 5.35794 10.0227 5.15547 9.89993 5.02671L9.54659 4.67337C9.41698 4.54633 9.20954 4.54633 9.07993 4.67337L5.91993 7.83337L4.91993 6.84004C4.85944 6.77559 4.77498 6.73903 4.68659 6.73903C4.5982 6.73903 4.51375 6.77559 4.45326 6.84004L4.09993 7.19337C4.03682 7.25596 4.00133 7.34116 4.00133 7.43004C4.00133 7.51892 4.03682 7.60412 4.09993 7.66671L5.68659 9.23337C5.74708 9.29782 5.83154 9.33439 5.91993 9.33439C6.00832 9.33439 6.09277 9.29782 6.15326 9.23337Z" fill="#79B530"/> </svg> </div> </div> </div>  <div class="is-hidden-tablet-and-below page-tabs"> <ul> <li class="selected"><a class="js-item-navigation-item-details t-link -decoration-none" href="/item/xmenu-ultimate-responsive-mega-menu/55414390">Item Details</a></li> <li><a rel="nofollow" class="js-item-navigation-comments t-link -decoration-none" href="/item/xmenu-ultimate-responsive-mega-menu/55414390/comments"><span>Comments</span><span class="item-navigation-reviews-comments">0</span></a></li> <li><a class="js-item-navigation-support t-link -decoration-none" href="/item/xmenu-ultimate-responsive-mega-menu/55414390/support">Support</a></li> </ul> </div>  <div class="page-tabs--dropdown" data-view="replaceItemNavsWithRemote" data-target=".js-remote"> <div class="page-tabs--dropdown__slt-custom-wlabel"> <div class="slt-custom-wlabel--page-tabs--dropdown"> <label> <span class="js-label"> Item Details </span> <span class="slt-custom-wlabel__arrow"> <i class="e-icon -icon-arrow-fill-down"></i> </span> </label> <select class="js-remote"> <option selected="selected" data-url="/item/xmenu-ultimate-responsive-mega-menu/55414390">Item Details</option> <option data-url="/item/xmenu-ultimate-responsive-mega-menu/55414390/comments">Comments (0)</option> <option data-url="/item/xmenu-ultimate-responsive-mega-menu/55414390/support">Support</option> </select> </div> </div> </div> <div class="page-tabs"> <ul class="right item-bookmarking__left-icons_hidden" data-view="bookmarkStatesLoader"> <li class="js-favorite-widget item-bookmarking__control_icons--favorite" data-item-id="55414390"><a data-view="modalAjax" class="t-link -decoration-none" href="/sign_in?action_name=favorite&resource_id=55414390"><span class="item-bookmarking__control--label">Add to Favorites</span></a></li> <li class="js-collection-widget item-bookmarking__control_icons--collection" data-item-id="55414390"><a data-view="modalAjax" class="t-link -decoration-none" href="/sign_in?action_name=collect&resource_id=55414390"><span class="item-bookmarking__control--label">Add to Collection</span></a></li> </ul> </div> </div> </div> <div class="content-main" id="content"> <div class="grid-container"> <script nonce="rXYqdYIOgpote8Hih2sq8g=="> //<![CDATA[ window.GtmMeasurements.sendAnalyticsEvent({"eventName":"view_item","eventType":"user","ecommerce":{"currency":"USD","value":9.0,"items":[{"affiliation":"codecanyon","item_id":55414390,"item_name":"XMENU - Ultimate Responsive Mega Menu","item_brand":"IndianCoder","item_category":"css","item_category2":"navigation-and-menus","price":9.0,"quantity":1,"item_add_on":"bundle_6month","item_variant":"regular"}]}}); //]]> </script> <div> <link href="https://s3.envato.com/files/543485529/logo.png" /> <div class="content-s "> <div class="item-bookmarking__left-icons__wrapper"> <ul class="item-bookmarking__left-icons" data-view="bookmarkStatesLoader"> <li class="item-bookmarking__control_icons--favorite"> <span> <a title="Add to Favorites" data-view="modalAjax" href="/sign_in?action_name=favorite&resource_id=55414390"><span class="item-bookmarking__control--label">Add to Favorites</span></a> </span> </li> <li class="item-bookmarking__control_icons--collection"> <span> <a title="Add to Collection" data-view="modalAjax" href="/sign_in?action_name=collect&resource_id=55414390"> <span class="item-bookmarking__control--label">Add to Collection</span> </a> </span> </li> </ul> </div> <div class="box--no-padding"> <div class="item-preview live-preview-btn--blue -preview-live"> <a target="_blank" href="/item/xmenu-ultimate-responsive-mega-menu/full_screen_preview/55414390"><img alt="XMENU - Ultimate Responsive Mega Menu - CodeCanyon Item for Sale" width="590" height="300" src="https://market-resized.envatousercontent.com/codecanyon.net/files/543485530/01_Preview.jpeg?auto=format&q=94&cf_fit=crop&gravity=top&h=8000&w=590&s=4b68b1989348d7d486b62be27a3513bfc431b250fb20769984954fe104d41aa6" /></a> <div class="js- item-preview-image__gallery" data-title="XMENU - Ultimate Responsive Mega Menu - CodeCanyon Item for Sale Screenshots Gallery" data-url="xmenu-ultimate-responsive-mega-menu/screenshots/modal/55414390"> <a class="is-hidden" href="https://s3.envato.com/files/543485539/01_Screenshot.png">01_Screenshot.png</a> <a class="is-hidden" href="https://s3.envato.com/files/543485539/02_Screenshot.png">02_Screenshot.png</a> <a class="is-hidden" href="https://s3.envato.com/files/543485539/03_Screenshot.png">03_Screenshot.png</a> <a class="is-hidden" href="https://s3.envato.com/files/543485539/04_Screenshot.png">04_Screenshot.png</a> <a class="is-hidden" href="https://s3.envato.com/files/543485539/05_Screenshot.png">05_Screenshot.png</a> <a class="is-hidden" href="https://s3.envato.com/files/543485539/06_Screenshot.png">06_Screenshot.png</a> <a class="is-hidden" href="https://s3.envato.com/files/543485539/07_Screenshot.png">07_Screenshot.png</a> <a class="is-hidden" href="https://s3.envato.com/files/543485539/08_Screenshot.png">08_Screenshot.png</a> <a class="is-hidden" href="https://s3.envato.com/files/543485539/09_Screenshot.png">09_Screenshot.png</a> <a class="is-hidden" href="https://s3.envato.com/files/543485539/10_Screenshot.png">10_Screenshot.png</a> <a class="is-hidden" href="https://s3.envato.com/files/543485539/11_Screenshot.png">11_Screenshot.png</a> <a class="is-hidden" href="https://s3.envato.com/files/543485539/12_Screenshot.png">12_Screenshot.png</a> <a class="is-hidden" href="https://s3.envato.com/files/543485539/13_Screenshot.png">13_Screenshot.png</a> <a class="is-hidden" href="https://s3.envato.com/files/543485539/14_Screenshot.png">14_Screenshot.png</a> <a class="is-hidden" href="https://s3.envato.com/files/543485539/15_Screenshot.png">15_Screenshot.png</a> <a class="is-hidden" href="https://s3.envato.com/files/543485539/16_Screenshot.png">16_Screenshot.png</a> </div> <div class="js-video-error-container"></div> <div class="js-legacy-preview-buttons"> <div class="item-preview__actions"> <div id="fullscreen" class="item-preview__preview-buttons"> <a href="/item/xmenu-ultimate-responsive-mega-menu/full_screen_preview/55414390" role="button" class="btn-icon live-preview" target="_blank" rel="noopener nofollow" > Live Preview </a> <a data-view="screenshotGallery" href="/item/xmenu-ultimate-responsive-mega-menu/screenshots/55414390" role="button" class="btn-icon screenshots" target="_blank" rel="noopener" > Screenshots </a> </div> </div> </div> </div> </div> <div data-view="toggleItemDescription"> <div class="js-item-togglable-content"> <div class="js-item-description item-description"> <div class="user-html user-html__with-lazy-load"><p><span data-src="https://camo.envatousercontent.com/014246ba707012be9470aded25341bcb3d91d244/68747470733a2f2f786d656e752e696e6469616e6b6f6465722e636f6d2f74662d62616e6e65722f6164765f312e6a7067" data-alt="XMENU - Ultimate Responsive Mega Menu - 1" class="lazy-load-img"></span> <span data-src="https://camo.envatousercontent.com/1b846b35c3c68fe36de19994365f1b448fe7c289/68747470733a2f2f786d656e752e696e6469616e6b6f6465722e636f6d2f74662d62616e6e65722f6164765f322e6a7067" data-alt="XMENU - Ultimate Responsive Mega Menu - 2" class="lazy-load-img"></span> <span data-src="https://camo.envatousercontent.com/396cf06ac546352745eb9d5585789189e7c00145/68747470733a2f2f786d656e752e696e6469616e6b6f6465722e636f6d2f74662d62616e6e65722f6164765f332e6a7067" data-alt="XMENU - Ultimate Responsive Mega Menu - 3" class="lazy-load-img"></span> <span data-src="https://camo.envatousercontent.com/ecd1d75182e0cba73012720f5466f4f616f97a15/68747470733a2f2f786d656e752e696e6469616e6b6f6465722e636f6d2f74662d62616e6e65722f6164765f342e6a7067" data-alt="XMENU - Ultimate Responsive Mega Menu - 4" class="lazy-load-img"></span> <span data-src="https://camo.envatousercontent.com/6654820b1d577769e60cddef4b4bf76eb69e6940/68747470733a2f2f786d656e752e696e6469616e6b6f6465722e636f6d2f74662d62616e6e65722f6164765f352e6a7067" data-alt="XMENU - Ultimate Responsive Mega Menu - 5" class="lazy-load-img"></span> <span data-src="https://camo.envatousercontent.com/023a9fe36b0d74b903a2258d21128134d9f3a1d2/68747470733a2f2f786d656e752e696e6469616e6b6f6465722e636f6d2f74662d62616e6e65722f6164765f362e6a7067" data-alt="XMENU - Ultimate Responsive Mega Menu - 6" class="lazy-load-img"></span> <span data-src="https://camo.envatousercontent.com/709664aee5c52091b207e76f17d0634337bb0887/68747470733a2f2f786d656e752e696e6469616e6b6f6465722e636f6d2f74662d62616e6e65722f6164765f372e6a7067" data-alt="XMENU - Ultimate Responsive Mega Menu - 7" class="lazy-load-img"></span> <span data-src="https://camo.envatousercontent.com/f8b362f4cd2d0c6551932a89e29870f0dc0c3673/68747470733a2f2f786d656e752e696e6469616e6b6f6465722e636f6d2f74662d62616e6e65722f6164765f382e6a7067" data-alt="XMENU - Ultimate Responsive Mega Menu - 8" class="lazy-load-img"></span> </p><p>Xmenu Responsive Mega Menu is a jQuery-powered, highly customizable, and user-friendly menu system designed for creating advanced, feature-rich navigation menus on websites. Available on CodeCanyon, this plugin enables web developers to build fully responsive, multi-level, and visually engaging mega menus that work seamlessly across all screen sizes and devices. Below is a detailed description of the features, functionality, and use cases for Xmenu</p> <p><strong>1. Responsive and Mobile-Friendly</strong> Xmenu is designed with a fully responsive layout, ensuring that your website’s navigation menus work perfectly on all screen sizes, from desktop monitors to mobile devices. The menu adapts dynamically based on the screen size, making it ideal for mobile-first designs. </p> <p><strong>2. Multi-Level Mega Menu</strong> Xmenu supports multi-level dropdowns and mega menus, allowing you to organize and display complex menus with ease. You can create hierarchical menus with nested submenus, dropdowns, and columns, offering a structured and clean interface for users to navigate large website structures.</p> <p> <strong>3. Multi-Column Support</strong> Xmenu allows for the creation of multi-column mega menus, ideal for displaying large amounts of content like categories, subcategories, links, and images. This feature makes it easier to organize and present data in a visually appealing format that improves the user experience.</p> <p><strong>4. Integrated Icons and Image Support</strong> You can easily incorporate icons and images into your menus to enhance their visual appeal. Xmenu supports a variety of icon libraries, such as Font Awesome which can be used next to menu items to make them more engaging and recognizable.</p> <p> <strong>5. Advanced Animations and Effects </strong> Xmenu provides several animation options for dropdowns and mega menu transitions. This includes smooth slide-in, fade-in, and other interactive effects that improve the overall user experience and make the menu feel more dynamic and modern.</p> <p> <strong>6. Touch and Gesture Support </strong> Being mobile-responsive, Xmenu comes with built-in touch and swipe gesture support, which means that users on touch-enabled devices (like smartphones and tablets) can easily interact with the menu. This ensures a smooth navigation experience for all users, regardless of the device they’re using.</p> <p> <strong>7. Cross-Browser Compatibility </strong> Xmenu works across all major browsers, including Chrome, Firefox, Safari, Edge, and Internet Explorer, ensuring that users have a consistent experience regardless of the browser they are using.</p> <p> <strong>8. SEO-Friendly Structure </strong> The mega menu generated by Xmenu is designed to be SEO-friendly. The plugin ensures that search engines can crawl and index the menu items and links properly, making your site’s navigation not only user-friendly but also optimized for search engines.</p> <p> <strong>9. Smooth Performance </strong> Xmenu is optimized for performance. It is lightweight, ensuring that it does not slow down your website. The plugin is optimized to work efficiently even on sites with large menus and complex structures.</p> <p> <strong>10. Easy Integration </strong> The plugin integrates easily into most websites, whether you’re using HTML, WordPress, or other content management systems. Xmenu comes with detailed documentation to help developers set up and configure the menu quickly.</p> <p> <strong>11. Custom CSS and JS Support </strong> For advanced customization, Xmenu allows you to add custom CSS and JavaScript. This feature enables you to extend the menu’s functionality, making it fit any specific requirement for your project.</p> <p> <strong>12. Detailed Documentation and Support </strong> Xmenu comes with comprehensive documentation that guides you through installation, setup, and customization. Additionally, the developers provide support through ticket systems, making it easy for you to get assistance with any issues you might encounter.</p> <h3 id="item-description__full-features-list">Features List</h3> <ul> <li>Responsive design: Works on desktops, tablets, and mobiles.</li> <li>Multi-level dropdown and mega menus: Supports complex menus with multiple submenus and columns.</li> <li>Customizable themes: Pre-built themes and full CSS styling options.</li> <li>Icon and image support: Use icons (like Font Awesome) or images in your menu.</li> <li>Touch and swipe gesture support: Optimized for mobile and touch-enabled devices.</li> <li>Smooth animations: Offers various animation effects for menu transitions.</li> <li>SEO-friendly: Ensures proper indexing of your menu items.</li> <li>Cross-browser compatibility: Works across major browsers.</li> <li>Easy integration: Simple setup process with clear documentation.</li> <li>Custom CSS and JS support: Customize further with additional styling and scripts.</li> </ul> <p><strong>Pricing and Availability:</strong> Xmenu is available for purchase on CodeCanyon. It typically comes with regular updates and 6 months of support from the developer (with an option to extend support). Pricing may vary depending on licensing options.</p> <h3 id="item-description__full-XMENU">XMENU Menu Styles</h3> <ul> <li>Menu Auto Width</li> <li>Menu With Left Banner</li> <li>Fixed Menu</li> <li>Menu with Slider</li> <li>Menu Wide Width</li> <li>Overlay Images Card</li> <li>Right Banner</li> <li>Bootstrap Card</li> <li>Home Demo Menu</li> <li>Images Menu</li> <li>Full Width</li> <li>Media Menu</li> <li>Dropdown Menu</li> <li>Menu Left</li> <li>Menu Center</li> <li>Menu Right</li> <li>Menu Icons</li> <li>Accordion Menu</li> </ul> <h2 id="item-description__font">Font</h2> <ul> <li>“Poppins Sans, sans-serif”</li> </ul> <h2 id="item-description__what_get">You will get</h2> <ul> <li>HTML Files</li> <li>JavaScript Files</li> <li>CSS files</li> <li>SCSS files</li> <li>Proper Documentation</li> </ul> <h2 id="item-description__item-changelog__important">Change Log</h2> <strong>v1.0 – 20 November 2024</strong><br> <pre>* New - Created & Upload XMENU</pre></div> </div> <div class="js-item-description-toggle item-description-toggle"> <a class="item-description-toggle__link is-hidden" href="#"> <span>Show More <i class="e-icon -icon-chevron-down"></i></span> <span class="item-description-toggle__less">Show Less <i class="e-icon -icon-chevron-down -rotate-180"></i></span> </a> </div> </div> </div> <section data-view="recommendedItems" data-url="/item/xmenu-ultimate-responsive-mega-menu/55414390/recommended_items" id="recommended_items"> </section> <section class="related-by-author h-my2 h-pb1"> <h2 class="t-heading -size-xs -weight-normal">More items by IndianCoder</h2> <div class="related-by-author__list h-py1"> <ul class="item-thumbnail-carousel--item-page overflow" data-analytics-view-payload="{"eventName":"view_item_list","eventType":"user","ecommerce":{"currency":"USD","item_list_name":"Item page: More items by this author","items":[{"affiliation":"codecanyon","item_id":55447033,"item_name":"ClickCart - Native Android WooCommerce Full Mobile Application","item_brand":"IndianCoder","item_category":"mobile","item_category2":"android","item_category3":"full-applications","price":"19","quantity":1,"index":1},{"affiliation":"codecanyon","item_id":54173092,"item_name":"Amazmart - eCommerce Android Mobile App Template","item_brand":"IndianCoder","item_category":"mobile","item_category2":"android","price":"29","quantity":1,"index":2},{"affiliation":"codecanyon","item_id":54140829,"item_name":"LookMe - React Native CLI eCommerce Mobile App Template","item_brand":"IndianCoder","item_category":"mobile","price":"19","quantity":1,"index":3},{"affiliation":"codecanyon","item_id":54140934,"item_name":"LookMe - React Native Expo eCommerce Mobile App Template","item_brand":"IndianCoder","item_category":"mobile","price":"19","quantity":1,"index":4},{"affiliation":"codecanyon","item_id":53769909,"item_name":"ClickCart - eCommerce Android Mobile App Template","item_brand":"IndianCoder","item_category":"mobile","item_category2":"android","price":"29","quantity":1,"index":5},{"affiliation":"codecanyon","item_id":53647738,"item_name":"Lingerie - React Native Expo eCommerce Mobile App Template","item_brand":"IndianCoder","item_category":"mobile","price":"19","quantity":1,"index":6},{"affiliation":"codecanyon","item_id":53647562,"item_name":"Lingerie - React Native CLI eCommerce Mobile App Template","item_brand":"IndianCoder","item_category":"mobile","price":"19","quantity":1,"index":7}]}}"> <li class="item-thumbnail-container"> <div class="item-thumbnail__image"> <a data-analytics-click-payload="{"eventName":"select_item","eventType":"user","ecommerce":{"currency":"USD","items":[{"affiliation":"codecanyon","item_id":55447033,"item_name":"ClickCart - Native Android WooCommerce Full Mobile Application","item_brand":"IndianCoder","item_category":"mobile","item_category2":"android","item_category3":"full-applications","price":"19","quantity":1}]}}" href="https://codecanyon.net/item/clickcart-native-android-woocommerce-full-mobile-application/55447033"><span class="lazy-load-img" data-src="https://s3.envato.com/files/544497436/logo.png" data-border="0" data-alt="ClickCart - Native Android WooCommerce Full Mobile Application - CodeCanyon Item for Sale" data-title="ClickCart - Native Android WooCommerce Full Mobile Application" data-height="80" data-width="80" data-class="landscape-image-magnifier preload no_preview" data-data-preview-width="" data-data-preview-height="" data-data-preview-url="https://s3.envato.com/files/544497443/Preview.jpeg" data-data-item-name="ClickCart - Native Android WooCommerce Full Mobile Application" data-data-item-author="IndianCoder" data-data-item-id="55447033" data-data-item-category="Mobile / Android / Full Applications" data-data-item-cost="19"></span></a> </div> </li> <li class="item-thumbnail-container"> <div class="item-thumbnail__image"> <a data-analytics-click-payload="{"eventName":"select_item","eventType":"user","ecommerce":{"currency":"USD","items":[{"affiliation":"codecanyon","item_id":54173092,"item_name":"Amazmart - eCommerce Android Mobile App Template","item_brand":"IndianCoder","item_category":"mobile","item_category2":"android","price":"29","quantity":1}]}}" href="https://codecanyon.net/item/amazmart-ecommerce-android-mobile-app-template/54173092"><span class="lazy-load-img" data-src="https://s3.envato.com/files/512292564/logo.png" data-border="0" data-alt="Amazmart - eCommerce Android Mobile App Template - CodeCanyon Item for Sale" data-title="Amazmart - eCommerce Android Mobile App Template" data-height="80" data-width="80" data-class="landscape-image-magnifier preload no_preview" data-data-preview-width="" data-data-preview-height="" data-data-preview-url="https://s3.envato.com/files/512292566/preview.png" data-data-item-name="Amazmart - eCommerce Android Mobile App Template" data-data-item-author="IndianCoder" data-data-item-id="54173092" data-data-item-category="Mobile / Android" data-data-item-cost="29"></span></a> </div> </li> <li class="item-thumbnail-container"> <div class="item-thumbnail__image"> <a data-analytics-click-payload="{"eventName":"select_item","eventType":"user","ecommerce":{"currency":"USD","items":[{"affiliation":"codecanyon","item_id":54140829,"item_name":"LookMe - React Native CLI eCommerce Mobile App Template","item_brand":"IndianCoder","item_category":"mobile","price":"19","quantity":1}]}}" href="https://codecanyon.net/item/lookme-react-native-cli-ecommerce-mobile-app-template/54140829"><span class="lazy-load-img" data-src="https://s3.envato.com/files/512058758/logo.png" data-border="0" data-alt="LookMe - React Native CLI eCommerce Mobile App Template - CodeCanyon Item for Sale" data-title="LookMe - React Native CLI eCommerce Mobile App Template" data-height="80" data-width="80" data-class="landscape-image-magnifier preload no_preview" data-data-preview-width="" data-data-preview-height="" data-data-preview-url="https://s3.envato.com/files/512058760/Preview.png" data-data-item-name="LookMe - React Native CLI eCommerce Mobile App Template" data-data-item-author="IndianCoder" data-data-item-id="54140829" data-data-item-category="Mobile" data-data-item-cost="19"></span></a> </div> </li> <li class="item-thumbnail-container"> <div class="item-thumbnail__image"> <a data-analytics-click-payload="{"eventName":"select_item","eventType":"user","ecommerce":{"currency":"USD","items":[{"affiliation":"codecanyon","item_id":54140934,"item_name":"LookMe - React Native Expo eCommerce Mobile App Template","item_brand":"IndianCoder","item_category":"mobile","price":"19","quantity":1}]}}" href="https://codecanyon.net/item/lookme-react-native-expo-ecommerce-mobile-app-template/54140934"><span class="lazy-load-img" data-src="https://s3.envato.com/files/512059545/logo.png" data-border="0" data-alt="LookMe - React Native Expo eCommerce Mobile App Template - CodeCanyon Item for Sale" data-title="LookMe - React Native Expo eCommerce Mobile App Template" data-height="80" data-width="80" data-class="landscape-image-magnifier preload no_preview" data-data-preview-width="" data-data-preview-height="" data-data-preview-url="https://s3.envato.com/files/512059547/Preview.png" data-data-item-name="LookMe - React Native Expo eCommerce Mobile App Template" data-data-item-author="IndianCoder" data-data-item-id="54140934" data-data-item-category="Mobile" data-data-item-cost="19"></span></a> </div> </li> <li class="item-thumbnail-container"> <div class="item-thumbnail__image"> <a data-analytics-click-payload="{"eventName":"select_item","eventType":"user","ecommerce":{"currency":"USD","items":[{"affiliation":"codecanyon","item_id":53769909,"item_name":"ClickCart - eCommerce Android Mobile App Template","item_brand":"IndianCoder","item_category":"mobile","item_category2":"android","price":"29","quantity":1}]}}" href="https://codecanyon.net/item/clickcart-ecommerce-android-mobile-app-template/53769909"><span class="lazy-load-img" data-src="https://s3.envato.com/files/509442367/logo.png" data-border="0" data-alt="ClickCart - eCommerce Android Mobile App Template - CodeCanyon Item for Sale" data-title="ClickCart - eCommerce Android Mobile App Template" data-height="80" data-width="80" data-class="landscape-image-magnifier preload no_preview" data-data-preview-width="" data-data-preview-height="" data-data-preview-url="https://s3.envato.com/files/509442369/01_Preview.png" data-data-item-name="ClickCart - eCommerce Android Mobile App Template" data-data-item-author="IndianCoder" data-data-item-id="53769909" data-data-item-category="Mobile / Android" data-data-item-cost="29"></span></a> </div> </li> <li class="item-thumbnail-container"> <div class="item-thumbnail__image"> <a data-analytics-click-payload="{"eventName":"select_item","eventType":"user","ecommerce":{"currency":"USD","items":[{"affiliation":"codecanyon","item_id":53647738,"item_name":"Lingerie - React Native Expo eCommerce Mobile App Template","item_brand":"IndianCoder","item_category":"mobile","price":"19","quantity":1}]}}" href="https://codecanyon.net/item/lingerie-react-native-expo-ecommerce-mobile-app-template/53647738"><span class="lazy-load-img" data-src="https://s3.envato.com/files/523073685/logo.png" data-border="0" data-alt="Lingerie - React Native Expo eCommerce Mobile App Template - CodeCanyon Item for Sale" data-title="Lingerie - React Native Expo eCommerce Mobile App Template" data-height="80" data-width="80" data-class="landscape-image-magnifier preload no_preview" data-data-preview-width="" data-data-preview-height="" data-data-preview-url="https://s3.envato.com/files/523073686/Preview.png" data-data-item-name="Lingerie - React Native Expo eCommerce Mobile App Template" data-data-item-author="IndianCoder" data-data-item-id="53647738" data-data-item-category="Mobile" data-data-item-cost="19"></span></a> </div> </li> <li class="item-thumbnail-container"> <div class="item-thumbnail__image"> <a data-analytics-click-payload="{"eventName":"select_item","eventType":"user","ecommerce":{"currency":"USD","items":[{"affiliation":"codecanyon","item_id":53647562,"item_name":"Lingerie - React Native CLI eCommerce Mobile App Template","item_brand":"IndianCoder","item_category":"mobile","price":"19","quantity":1}]}}" href="https://codecanyon.net/item/lingerie-react-native-cli-ecommerce-mobile-app-template/53647562"><span class="lazy-load-img" data-src="https://s3.envato.com/files/523073590/logo.png" data-border="0" data-alt="Lingerie - React Native CLI eCommerce Mobile App Template - CodeCanyon Item for Sale" data-title="Lingerie - React Native CLI eCommerce Mobile App Template" data-height="80" data-width="80" data-class="landscape-image-magnifier preload no_preview" data-data-preview-width="" data-data-preview-height="" data-data-preview-url="https://s3.envato.com/files/523073591/Preview.png" data-data-item-name="Lingerie - React Native CLI eCommerce Mobile App Template" data-data-item-author="IndianCoder" data-data-item-id="53647562" data-data-item-category="Mobile" data-data-item-cost="19"></span></a> </div> </li> </ul> </div> <div> <p class="t-body -size-m"> <a class="t-link-decoration-reversed" href="/user/IndianCoder/portfolio">View author portfolio</a> </p> </div> </section> <div data-view="itemPageScrollEvents"></div> </div> <div class="sidebar-l sidebar-right"> <div class="pricebox-container"> <div class="purchase-panel"> <div id="purchase-form" class="purchase-form"> <form data-view="purchaseForm" data-analytics-has-custom-click="true" data-analytics-click-payload="{"eventName":"add_to_cart","eventType":"user","quantityUpdate":false,"ecommerce":{"currency":"USD","value":9.0,"items":[{"affiliation":"codecanyon","item_id":55414390,"item_name":"XMENU - Ultimate Responsive Mega Menu","item_brand":"IndianCoder","item_category":"css","item_category2":"navigation-and-menus","price":"9","quantity":1}]}}" action="/cart/add/55414390" accept-charset="UTF-8" method="post"><input type="hidden" name="authenticity_token" value="0IvGmHVYwsiyWlVFTiCQRKtTq2jydJrt6NvHtDNiSGyJccYzKeNR8wLohhBhb2j9pMqkQ5ZkgutD1x7g9z6FnQ" autocomplete="off" /> <div> <div data-view="itemVariantSelector" data-id="55414390" data-cookiebot-enabled="true"> <div class="purchase-form__selection"> <span class="purchase-form__license-type"> <span data-view="flyout" class="flyout"> <span class="js-license-selector__chosen-license purchase-form__license-dropdown">Regular License</span> <div class="js-flyout__body flyout__body -padding-side-removed"> <span class="js-flyout__triangle flyout__triangle"></span> <div class="license-selector" data-view="licenseSelector"> <div class="js-license-selector__item license-selector__item" data-license="regular" data-name="Regular License"> <div class="license-selector__license-type"> <span class="t-heading -size-xxs">Regular License</span> <span class="js-license-selector__selected-label e-text-label -color-green -size-s " data-license="regular">Selected</span> </div> <div class="license-selector__price"> <span class="t-heading -size-m h-m0"> <b class="t-currency"><span class="">$9</span></b> </span> </div> <div class="license-selector__description"> <p class="t-body -size-m h-m0">Use, by you or one client, in a single end product which end users <strong>are not</strong> charged for. The total price includes the item price and a buyer fee.</p> </div> </div> <div class="js-license-selector__item license-selector__item" data-license="extended" data-name="Extended License"> <div class="license-selector__license-type"> <span class="t-heading -size-xxs">Extended License</span> <span class="js-license-selector__selected-label e-text-label -color-green -size-s is-hidden" data-license="extended">Selected</span> </div> <div class="license-selector__price"> <span class="t-heading -size-m h-m0"> <b class="t-currency"><span class="">$249</span></b> </span> </div> <div class="license-selector__description"> <p class="t-body -size-m h-m0">Use, by you or one client, in a single end product which end users <strong>can be</strong> charged for. The total price includes the item price and a buyer fee.</p> </div> </div> </div> <div class="flyout__link"> <p class="t-body -size-m h-m0"> <a class="t-link -decoration-reversed" target="_blank" href="https://codecanyon.net/licenses/standard">View license details</a> </p> </div> </div> </span> <select class="f-select js-purchase-license-selector is-hidden--js" name="license"> <option value="regular" selected="selected" data-license="regular" data-license-default="true">Regular License</option> <option value="extended" data-license="extended" data-license-default="false">Extended License</option> </select> </span> <div class="js-purchase-heading purchase-form__price t-heading -size-xxl "> <b class="t-currency"><span class="js-purchase-price">$9</span></b> </div> </div> <div class="purchase-form__license js-purchase-license is-active" data-license="regular"> <price class="js-purchase-license-prices" data-price-prepaid="$9" data-license="regular" data-price-prepaid-upgrade="$12" data-support-upgrade-price="$3" data-support-upgrade-saving="$4" data-support-extension-price="$5" data-support-extension-saving="$2" data-support-renewal-price="$7" /> </div> <div class="purchase-form__license js-purchase-license " data-license="extended"> <price class="js-purchase-license-prices" data-price-prepaid="$249" data-license="extended" data-price-prepaid-upgrade="$340.50" data-support-upgrade-price="$91.50" data-support-upgrade-saving="$122" data-support-extension-price="$152.50" data-support-extension-saving="$61" data-support-renewal-price="$213.50" /> </div> <div class="purchase-form__support"> <ul class="t-icon-list -font-size-s -icon-size-s -offset-flush"> <li class="t-icon-list__item -icon-ok"> <span class="is-visually-hidden">Included:</span> Quality checked by Envato </li> <li class="t-icon-list__item -icon-ok"> <span class="is-visually-hidden">Included:</span> Future updates </li> <li class="t-icon-list__item -icon-ok"> <span class="is-visually-hidden">Included:</span> 6 months support from <span class="purchase-form__author-name">IndianCoder</span> <a class="t-link -decoration-reversed js-support__inclusion-link" data-view="modalAjax" href="/item_support/what_is_item_support/55414390"> <svg width="12px" height="13px" viewBox="0 0 12 13" class="" xmlns="http://www.w3.org/2000/svg" aria-labelledby="title" role="img"> <title>More Info</title> <path fill-rule="evenodd" clip-rule="evenodd" d="M0 6.5a6 6 0 1 0 12 0 6 6 0 0 0-12 0zm7.739-3.17a.849.849 0 0 1-.307.664.949.949 0 0 1-.716.273c-.273 0-.529-.102-.716-.272a.906.906 0 0 1-.307-.665c0-.256.102-.512.307-.682.187-.17.443-.273.716-.273.273 0 .528.102.716.273a.908.908 0 0 1 .307.682zm-.103 6.34-.119.46c-.34.137-.613.24-.818.307a2.5 2.5 0 0 1-.716.103c-.409 0-.733-.103-.954-.307a.953.953 0 0 1-.341-.767c0-.12 0-.256.017-.375.017-.12.05-.273.085-.426l.426-1.517a7.14 7.14 0 0 1 .103-.41c.017-.119.034-.238.034-.357a.582.582 0 0 0-.12-.41c-.085-.068-.238-.119-.46-.119-.12 0-.239.017-.34.051-.069.03-.132.047-.189.064-.042.012-.082.024-.119.038l.12-.46c.234-.102.468-.18.69-.253l.11-.037c.24-.085.478-.119.734-.119.409 0 .733.102.954.307.222.187.341.477.341.784 0 .068 0 .187-.017.34v.003a2.173 2.173 0 0 1-.085.458l-.427 1.534-.102.41v.002c-.017.119-.034.237-.034.356 0 .204.051.34.136.409.137.085.307.119.46.102a1.3 1.3 0 0 0 .359-.051c.085-.051.17-.085.272-.12z" fill="#0084B4"/> </svg> </a> </li> </ul> <div class="purchase-form__upgrade purchase-form__upgrade--before-after-price"> <div class="purchase-form__upgrade-checkbox purchase-form__upgrade-checkbox--before-after-price"> <input type="hidden" name="support" id="support_default" value="bundle_6month" class="js-support__default" autocomplete="off" /> <input type="checkbox" name="support" id="support" value="bundle_12month" class="js-support__option" /> </div> <div class="purchase-form__upgrade-info"> <label class="purchase-form__label purchase-form__label--before-after-price" for="support"> Extend support to 12 months <span class="purchase-form__price purchase-form__price--before-after-price t-heading -size-xs h-pull-right"> <span class="js-renewal__price t-currency purchase-form__renewal-price purchase-form__renewal-price--strikethrough"> $7 </span> <b class="t-currency"> <span class="js-support__price">$3</span> </b> </span> </label> </div> </div> </div> </div> <div class="purchase-form__cta-buttons"> <div class="purchase-form__button"> <button name="button" type="submit" class="js-purchase__add-to-cart e-btn--3d -color-primary -size-m -width-full"> <i class="e-icon -icon-cart -margin-right"></i> <strong>Add to Cart</strong> </button></div> </div> <div class="purchase-form__us-dollars-notice-container"> <p class="purchase-form__us-dollars-notice"><i>Price is in US dollars and excludes tax and handling fees</i></p> </div> </div> </form> </div> </div> </div> <div class="box -radius-all"> <div class="media"> <div class="media__item"> <div class="avatar-wrapper tooltip-advanced"> <a class="avatar" title="IndianCoder" href="/user/IndianCoder"> <span data-src="https://s3.envato.com/files/489323696/logo_ic.png" data-width="80" data-height="80" data-alt="IndianCoder" class="lazy-load-img"></span> </a> </div> </div> <div class="media__body"> <h2 class="t-heading -size-s h-text-overflow-wrap-anywhere"> <a rel="author" class="t-link -color-dark -decoration-none" href="/user/indiancoder">IndianCoder</a> </h2> <div class=""> <ul class="badges"> <li> <span class="community-badges__badge-wrapper--s community-badges__badge-wrapper--responsive-xs "> <span data-src="https://public-assets.envato-static.com/assets/badges/author_level_3-s-6c94a0bc8ff075d4ea8b3121758ba48ab1b6c388efe382de7fc697e43561644a.svg" data-alt="Author Level 3" data-class="community-badges__badge--s" data-title="Author Level 3: Has sold $1,000+ on Envato Market" class="lazy-load-img"></span> </span> </li> <li> <span class="community-badges__badge-wrapper--s community-badges__badge-wrapper--responsive-xs "> <span data-src="https://public-assets.envato-static.com/assets/badges/exclusive-s-ece00f12ba6563867b7ba5274540c7333ba6688400220b3bf1d2bb9b338d65f8.svg" data-alt="Exclusive Author" data-class="community-badges__badge--s" data-title="Exclusive Author: Sells items exclusively on Envato" class="lazy-load-img"></span> </span> </li> <li> <span class="community-badges__badge-wrapper--s community-badges__badge-wrapper--responsive-xs "> <span data-src="https://public-assets.envato-static.com/assets/badges/country_in-91d0a4cd7dfbbf60475c0a7bf786e2ed865c3cb1db5bdd77b39081fec119a763.svg" data-alt="India" data-class="community-badges__badge--s" data-title="Located in India" class="lazy-load-img"></span> </span> </li> <li> <span class="community-badges__badge-wrapper--s community-badges__badge-wrapper--responsive-xs "> <span data-src="https://public-assets.envato-static.com/assets/badges/had_trending_item-s-973480c3b882aee21c3dbefdbb9a47c01668da9beb2678ad5332194269fb7ceb.svg" data-alt="Trendsetter" data-class="community-badges__badge--s" data-title="Trendsetter: Had an item that was trending" class="lazy-load-img"></span> </span> </li> </ul> </div> </div> </div> <div class="h-mt1"> <a class="e-btn--3d -color-light -width-full js-view-portfolio-button" href="/user/IndianCoder/portfolio">View Portfolio</a> </div> </div> <div class="box -radius-all"> <div class="meta-attributes js-meta-attributes has-toggle is-collapsed" data-view="CondenseItemInfoPanel"> <table class="meta-attributes__table" cellspacing="0" cellpadding="0" border="0"> <tbody> <tr class="js-condense-item-page-info-panel--last_update"> <td class="meta-attributes__attr-name">Last Update</td> <td class="meta-attributes__attr-detail"> <time class="updated" datetime="2024-11-20T10:29:55+11:00"> 20 November 2024 </time> </td> </tr> <tr class="js-condense-item-page-info-panel--created-at"> <td class="meta-attributes__attr-name">Published</td> <td class="meta-attributes__attr-detail"> <span> 20 November 2024 </span> </td> </tr> <tr class="js-condense-item-page-info-panel--high-resolution"> <td class="meta-attributes__attr-name">High Resolution</td> <td class="meta-attributes__attr-detail"> <a rel="nofollow" class="js-item-sidebar-meta-attributes" href="/attributes/high-resolution/yes">Yes</a> </td> </tr> <tr class="js-condense-item-page-info-panel--compatible-browsers"> <td class="meta-attributes__attr-name">Compatible Browsers</td> <td class="meta-attributes__attr-detail"> <a rel="nofollow" class="js-item-sidebar-meta-attributes" href="/attributes/compatible-browsers/firefox">Firefox</a>, <a rel="nofollow" class="js-item-sidebar-meta-attributes" href="/attributes/compatible-browsers/safari">Safari</a>, <a rel="nofollow" class="js-item-sidebar-meta-attributes" href="/attributes/compatible-browsers/opera">Opera</a>, <a rel="nofollow" class="js-item-sidebar-meta-attributes" href="/attributes/compatible-browsers/chrome">Chrome</a>, <a rel="nofollow" class="js-item-sidebar-meta-attributes" href="/attributes/compatible-browsers/edge">Edge</a> </td> </tr> <tr class="js-condense-item-page-info-panel--files-included"> <td class="meta-attributes__attr-name">Files Included</td> <td class="meta-attributes__attr-detail"> <a rel="nofollow" class="js-item-sidebar-meta-attributes" href="/attributes/source-files-included/javascript%20js">JavaScript JS</a>, <a rel="nofollow" class="js-item-sidebar-meta-attributes" href="/attributes/source-files-included/html">HTML</a>, <a rel="nofollow" class="js-item-sidebar-meta-attributes" href="/attributes/source-files-included/css">CSS</a> </td> </tr> <tr class="js-condense-item-page-info-panel--software-version"> <td class="meta-attributes__attr-name">Software Version</td> <td class="meta-attributes__attr-detail"> <a rel="nofollow" class="js-item-sidebar-meta-attributes" href="/attributes/compatible-software/css3">CSS3</a> </td> </tr> <tr> <td class="meta-attributes__attr-name">Tags</td> <td><span class="meta-attributes__attr-tags"> <a title="bootstrap mega menu" rel="nofollow" href="/search/bootstrap mega menu">bootstrap mega menu</a>, <a title="clean" rel="nofollow" href="/search/clean">clean</a>, <a title="css3" rel="nofollow" href="/search/css3">css3</a>, <a title="customisable" rel="nofollow" href="/search/customisable">customisable</a>, <a title="dropdown" rel="nofollow" href="/search/dropdown">dropdown</a>, <a title="dropdown menu" rel="nofollow" href="/search/dropdown menu">dropdown menu</a>, <a title="html" rel="nofollow" href="/search/html">html</a>, <a title="mega dropdown menu" rel="nofollow" href="/search/mega dropdown menu">mega dropdown menu</a>, <a title="mega menu" rel="nofollow" href="/search/mega menu">mega menu</a>, <a title="megamenu" rel="nofollow" href="/search/megamenu">megamenu</a>, <a title="menu" rel="nofollow" href="/search/menu">menu</a>, <a title="mobile menu" rel="nofollow" href="/search/mobile menu">mobile menu</a>, <a title="navigation" rel="nofollow" href="/search/navigation">navigation</a>, <a title="responsive" rel="nofollow" href="/search/responsive">responsive</a>, <a title="shortcodes" rel="nofollow" href="/search/shortcodes">shortcodes</a> </span></td> </tr> </tbody> </table> <div class="js-meta-attributes-toggle meta-attributes-toggle"> <a class="meta-attributes-toggle__link" href="#"> <span>More Attributes <i class="e-icon -icon-chevron-down"></i></span> <span class="meta-attributes-toggle__less">Fewer Attributes <i class="e-icon -icon-chevron-down -rotate-180"></i></span> </a> </div> </div></div> <div class="t-body -size-s h-text-align-center h-mt2"> © All Rights Reserved IndianCoder <br/> <a href="https://help.market.envato.com">Contact the Envato Market Help Team</a> </div> </div> <script nonce="rXYqdYIOgpote8Hih2sq8g=="> //<![CDATA[ // HACK: Google Chrome always scroll the previous page's position on hitting Back button // This causes issue with responsive version in which unexpanded item description obscure // the scroll position and Chrome will jump to the outer border of bottom window.addEventListener('unload', function(e) { window.scrollTo(0, 0); }); //]]> </script></div> </div> </div> <div> <div class='cross-sell'> <a class="cross-sell__link" data-analytics-view-payload="{"eventName":"view_promotion","contextDetail":"footer block ads","ecommerce":{"promotionId":"elements_mkt-footer_28AUG2024","promotionName":"elements_mkt-footer_28AUG2024","promotionType":"elements referral"}}" data-analytics-click-payload="{"eventName":"select_promotion","contextDetail":"footer block ads","ecommerce":{"promotionId":"elements_mkt-footer_28AUG2024","promotionName":"elements_mkt-footer_28AUG2024","promotionType":"elements referral"}}" data-analytics-click-once="true" href="https://elements.envato.com/pricing?utm_campaign=elements_mkt-footer_28AUG2024&utm_content=cc_global-footer&utm_medium=promos&utm_source=codecanyon.net"> <div class="mainPanel"> <div class="mainPanelContent"> <div class="envatoLogo"> </div> <div class="mainPanelLinkContainer"> <p class="mainPanelLinkHeading"> Looking for unlimited downloads? </p> <p class="mainPanelLinkSubheading"> Subscribe to Envato Elements. </p> <div class="mainPanelLinkDescription"> <div class="descriptionItem"> <img src="https://public-assets.envato-static.com/assets/header/badge-a65149663b95bcee411e80ccf4da9788f174155587980d8f1d9c44fd8b59edd8.svg" alt="badge" width="20" height="20" > <span>Millions of premium assets </span> </div> <div class="descriptionItem"> <img src="https://public-assets.envato-static.com/assets/header/thumbs_up-e5ce4c821cfd6a6aeba61127a8e8c4d2d7c566e654f588a22708c64d66680869.svg" alt="thumbs up" width="20" height="20" > <span> Great value subscription</span> </div> </div> </div> </div> <button class="brand-neue-button brand-neue-button__open-in-new elements-nav__cta footer_btn">Start creating now</button> </div> <div class="secondaryPanel"> <img loading="lazy" src="https://public-assets.envato-static.com/assets/header-footer/cross-sell-elements-1x-080389fdc19b4cd6f665df2a1e9d17804c7a735175b070e0ae7a9abd1c8afbce.png" srcset="https://public-assets.envato-static.com/assets/header-footer/cross-sell-elements-2x-7b2e57d6be99b80fabbcb40d5c12e36b88979b893a11f7a101f9deef3e9d3ce8.png 2x" alt="Collage of Elements items" /> </div> </a></div> <footer class='global-footer'> <div class='grid-container -layout-wide'> <div class='global-footer__container'> <nav class='global-footer-info-links'> <hr class='global-footer__separator is-hidden-desktop h-mb4'> <ul class='global-footer-info-links__list'> <li class='global-footer-info-links__list-item'> <ul class='global-footer-sublist'> <li class='global-footer-sublist__item-title'> Envato Market </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://themeforest.net/legal/market">Terms</a> </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://themeforest.net/licenses">Licenses</a> </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://build.envato.com">Market API</a> </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://envato.com/market/affiliate-program/">Become an affiliate</a> </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://www.envato.com/cookies/">Cookies</a> </li> <li class='global-footer-sublist__item h-p0'> <button type="button" class="global-footer__text-link" data-view="cookieSettings">Cookie Settings</button> </li> </ul> </li> <li class='global-footer-info-links__list-item'> <ul class='global-footer-sublist'> <li class='global-footer-sublist__item-title'> Help </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://help.market.envato.com">Help Center</a> </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://help.author.envato.com/hc/en-us">Authors</a> </li> </ul> </li> <li class='global-footer-info-links__list-item'> <ul class='global-footer-sublist'> <li class='global-footer-sublist__item-title'> Our Community </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://community.envato.com">Community</a> </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://envato.com/blog">Blog</a> </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://forums.envato.com">Forums</a> </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://community.envato.com/#/events">Meetups</a> </li> </ul> </li> <li class='global-footer-info-links__list-item'> <ul class='global-footer-sublist'> <li class='global-footer-sublist__item-title'> Meet Envato </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://envato.com">About Envato</a> </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://envato.com/careers/">Careers</a> </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://envato.com/privacy/">Privacy Policy</a> </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://www.envato.com/privacy/#my-personal-information">Do not sell or share my personal information</a> </li> <li class='global-footer-sublist__item h-p0'> <a class="global-footer__text-link" href="https://envato.com/sitemap/">Sitemap</a> </li> </ul> </li> </ul> </nav> <div class='global-footer-stats'> <div class='global-footer-stats__content'> <img class="global-footer-stats__logo" alt="Envato Market" src="https://public-assets.envato-static.com/assets/logos/envato_market-dd390ae860330996644c1c109912d2bf63885fc075b87215ace9b5b4bdc71cc8.svg" /> <ul class='global-footer-stats__list'> <li class='global-footer-stats__list-item h-p0'> <span class='global-footer-stats__number'>76,339,762</span> items sold </li> <li class='global-footer-stats__list-item h-p0'> <span class='global-footer-stats__number'>$1,188,901,282</span> community earnings </li> </ul> </div> <div class='global-footer-stats__bcorp'> <a target="_blank" rel="noopener noreferrer" class="global-footer-bcorp-link" href="https://bcorporation.net/en-us/find-a-b-corp/company/envato"> <img class="global-footer-bcorp-logo" width="50" alt="B Corp Logo" loading="lazy" src="https://public-assets.envato-static.com/assets/header-footer/logo-bcorp-e83f7da84188b8edac311fbf08eaa86634e9db7c67130cdc17837c1172c5f678.svg" /> </a> </div> </div> </div> <hr class='global-footer__separator'> <div class='global-footer__container'> <div class='global-footer-company-links'> <ul class='global-footer-company-links__list'> <li class='global-footer-company-links__list-item'> <a class="global-footer__text-link -opacity-full" href="https://envato.com">Envato.com</a> </li> <li class='global-footer-company-links__list-item'> <a class="global-footer__text-link -opacity-full" data-analytics-view-payload="{"eventName":"view_promotion","contextDetail":"footer nav","ecommerce":{"promotionId":"elements_mkt-footernav","promotionName":"elements_mkt-footernav","promotionType":"elements referral"}}" data-analytics-click-payload="{"eventName":"select_promotion","contextDetail":"footer nav","ecommerce":{"promotionId":"elements_mkt-footernav","promotionName":"elements_mkt-footernav","promotionType":"elements referral"}}" href="https://elements.envato.com?utm_campaign=elements_mkt-footernav">Envato Elements</a> </li> <li class='global-footer-company-links__list-item'> <a class="global-footer__text-link -opacity-full" href="https://placeit.net/">Placeit by Envato</a> </li> <li class='global-footer-company-links__list-item'> <a class="global-footer__text-link -opacity-full" href="https://tutsplus.com">Envato Tuts+</a> </li> <li class='global-footer-company-links__list-item'> <a class="global-footer__text-link -opacity-full" href="https://envato.com/products/">All Products</a> </li> <li class='global-footer-company-links__list-item'> <a class="global-footer__text-link -opacity-full" href="https://envato.com/sitemap/">Sitemap</a> </li> </ul> <hr class="global-footer__separator is-hidden-tablet-and-above h-mt3"> <small class='global-footer-company-links__price-disclaimer'> Price is in US dollars and excludes tax and handling fees </small> <small class='global-footer-company-links__copyright'> © 2024 Envato Pty Ltd. Trademarks and brands are the property of their respective owners. </small> </div> <div class='global-footer-social'> <ul> <li class='global-footer-social__list-item'> <a class="global-footer__icon-link" rel="nofollow" href="https://twitter.com/envato"> <span data-src="https://public-assets.envato-static.com/assets/header-footer/social/twitter-fed054cb31fc18407431a26876142c31a26c6bd59026c684d9625e4d7e58002a.svg" data-class="global-footer-social__icon" data-alt="Twitter" data-title="Twitter" data-width="22" data-height="22" class="lazy-load-img"></span> </a> </li> <li class='global-footer-social__list-item'> <a class="global-footer__icon-link" rel="nofollow" href="https://www.facebook.com/envato"> <span data-src="https://public-assets.envato-static.com/assets/header-footer/social/facebook-20d27cecd9ae46e6f7bad373316a0dc544669d42dbe0f66b3672720fbe5592fc.svg" data-class="global-footer-social__icon" data-alt="Facebook" data-title="Facebook" data-width="22" data-height="22" class="lazy-load-img"></span> </a> </li> <li class='global-footer-social__list-item'> <a class="global-footer__icon-link" rel="nofollow" href="https://www.youtube.com/user/Envato"> <span data-src="https://public-assets.envato-static.com/assets/header-footer/social/youtube-2d6a8f758426e727939834a47fe9e16ed6b651afed9ca4327a986f76f496594a.svg" data-class="global-footer-social__icon" data-alt="YouTube" data-title="YouTube" data-width="22" data-height="22" class="lazy-load-img"></span> </a> </li> <li class='global-footer-social__list-item'> <a class="global-footer__icon-link" rel="nofollow" href="https://www.instagram.com/envato/"> <span data-src="https://public-assets.envato-static.com/assets/header-footer/social/instagram-dce9fbf4d8428e6f75492fdc4e32ef7543ce3ba6347a5b055e7ac68c45416dc2.svg" data-class="global-footer-social__icon" data-alt="Instagram" data-title="Instagram" data-width="22" data-height="22" class="lazy-load-img"></span> </a> </li> <li class='global-footer-social__list-item'> <a class="global-footer__icon-link" rel="nofollow" href="https://www.pinterest.com/envato/"> <span data-src="https://public-assets.envato-static.com/assets/header-footer/social/pinterest-2e00aae335d66e4e28273bbfe4e9428ca8d8d91cbd9122d81312218ea34747df.svg" data-class="global-footer-social__icon" data-alt="Pinterest" data-title="Pinterest" data-width="22" data-height="22" class="lazy-load-img"></span> </a> </li> </ul> </div> </div> </div> </footer> </div> </div> <div class="is-hidden-phone"> <div id="tooltip-magnifier" class="magnifier"> <strong></strong> <div class="info"> <div class="author-category"> by <span class="author"></span> </div> <div class="price"> <span class="cost"></span> </div> </div> <div class="footer"> <span class="category"></span> <span class="currency-tax-notice">Price is in US dollars and excludes tax and handling fees</span> </div> </div> <div id="landscape-image-magnifier" class="magnifier"> <div class="size-limiter"> </div> <strong></strong> <div class="info"> <div class="author-category"> by <span class="author"></span> </div> <div class="price"> <span class="cost"></span> </div> </div> <div class="footer"> <span class="category"></span> <span class="currency-tax-notice">Price is in US dollars and excludes tax and handling fees</span> </div> </div> <div id="portrait-image-magnifier" class="magnifier"> <div class="size-limiter"> </div> <strong></strong> <div class="info"> <div class="author-category"> by <span class="author"></span> </div> <div class="price"> <span class="cost"></span> </div> </div> <div class="footer"> <span class="category"></span> <span class="currency-tax-notice">Price is in US dollars and excludes tax and handling fees</span> </div> </div> <div id="square-image-magnifier" class="magnifier"> <div class="size-limiter"> </div> <strong></strong> <div class="info"> <div class="author-category"> by <span class="author"></span> </div> <div class="price"> <span class="cost"></span> </div> </div> <div class="footer"> <span class="category"></span> <span class="currency-tax-notice">Price is in US dollars and excludes tax and handling fees</span> </div> </div> <div id="smart-image-magnifier" class="magnifier"> <div class="size-limiter"> </div> <strong></strong> <div class="info"> <div class="author-category"> by <span class="author"></span> </div> <div class="price"> <span class="cost"></span> </div> </div> <div class="footer"> <span class="category"></span> <span class="currency-tax-notice">Price is in US dollars and excludes tax and handling fees</span> </div> </div> <div id="video-magnifier" class="magnifier"> <div class="size-limiter"> </div> <strong></strong> <div class="info"> <div class="author-category"> by <span class="author"></span> </div> <div class="price"> <span class="cost"></span> </div> </div> <div class="footer"> <span class="category"></span> <span class="currency-tax-notice">Price is in US dollars and excludes tax and handling fees</span> </div> </div> </div> </div> <div class="page__overlay" data-view="offCanvasNavToggle" data-off-canvas="close"></div> </div> </div> <script src="https://public-assets.envato-static.com/assets/market/core/index-3d8a0ccd9978174dda7d3aa30b258e7ace330a435d742f005d78398b2a3f6013.js" nonce="rXYqdYIOgpote8Hih2sq8g=="></script> <script src="https://public-assets.envato-static.com/assets/market/pages/default/index-f343a714d04e9f18234e16f363b09212a5aca215988f9a738438975a3e445c97.js" nonce="rXYqdYIOgpote8Hih2sq8g=="></script> <div id="affiliate-tracker" class="is-hidden" data-view="affiliatesTracker" data-cookiebot-enabled="true"></div> <script src="https://public-assets.envato-static.com/assets/market/core/lazyload-f0fdf08f4783c5b030b32eb74e26ace288ccfeeee00a96df46f974edf09fc853.js" crossorigin="anonymous" nonce="rXYqdYIOgpote8Hih2sq8g==" integrity="sha256-Lj73XO2pRKnz68V0O125cWko4eq1N3BVb2oeXYCSLv0="></script> <script nonce="rXYqdYIOgpote8Hih2sq8g=="> //<![CDATA[ $(function(){viewloader.execute(Views);}); //]]> </script> <script src="https://consent.cookiebot.com/uc.js" data-cbid="d10f7659-aa82-4007-9cf1-54a9496002bf" data-georegions="{"region":"US","cbid":"d9683f70-895f-4427-97dc-f1087cddf9d8"}" async="async" id="Cookiebot" nonce="rXYqdYIOgpote8Hih2sq8g=="></script> <script nonce="rXYqdYIOgpote8Hih2sq8g=="> //<![CDATA[ var ACCOUNTS = ["m"]; window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date; var consentCookie = getCookie('CookieConsent'); if (consentCookie) { var hasConsent = Market.Helpers.CookieConsent.given('statistics'); if (hasConsent) { setupGoogleAnalytics(); loadGoogleAnalytics(); loadLinkingForAllAccounts(); } } else { setupGoogleAnalytics(); loadGoogleAnalytics(); loadLinkingForAllAccounts(); } window.addEventListener('CookiebotOnAccept', handleCookiebotAcceptDeclineEvent, false); window.addEventListener('CookiebotOnDecline', handleCookiebotAcceptDeclineEvent, false); function handleCookiebotAcceptDeclineEvent() { if (Cookiebot.consent.statistics) { if (!(window.ga && ga.create)) { setupGoogleAnalytics(); loadGoogleAnalytics(); loadLinkingForAllAccounts(); } } else { unloadGoogleAnalytics() } } function getCookie(name) { var name = name + "="; var decodedCookie = decodeURIComponent(document.cookie); var cookieContent = decodedCookie.split(';'); for(var i = 0; i < cookieContent.length; i++) { var c = cookieContent[i]; while (c.charAt(0) == ' ') { c = c.substring(1); } if (c.indexOf(name) == 0) { return c.substring(name.length, c.length); } } return false; } function delete_cookie_by_name(name) { document.cookie = name + "=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;"; } function unloadGoogleAnalytics() { var payload = {"name":"m","allowLinker":true}; var accountId = "UA-11834194-12"; // Set the GA User Opt-out flag window['ga-disable-'+accountId] = true; // Do not explicitly make any further calls to ga() ga(payload.name+".remove"); // Delete any existing GA cookies (_ga, _gat & _gaid) and GA Client ID from localStorage delete_cookie_by_name('_ga'); delete_cookie_by_name('_gat'); delete_cookie_by_name('_gid'); // Delete LocalStorage Entries if (Market.Helpers.GaLsUtils.localStorageAvailable()) { var clientId = Market.Helpers.GaLsUtils.getClientId(); if (!clientId) { return; } Market.Helpers.GaLsUtils.removeClientId(); } // Do not transmit the Client ID to other sites upon navigation (i.e. autoLink) } function domLoaded() { return new Promise(resolve => { if ( document.readyState === 'interactive' || document.readyState === 'complete' ) { resolve() } else { document.addEventListener( 'DOMContentLoaded', () => { resolve() }, { capture: true, once: true, passive: true } ) } }) } function loadLinkingForAllAccounts() { domLoaded().then(() => { window._envGaTrackerNames = ACCOUNTS; for (var i = 0; i < ACCOUNTS.length; i++) { var t = ACCOUNTS[i]; ga(t+'.require', 'linker'); ga(t+'.require', 'linkid', 'linkid.js'); }; document.body.addEventListener('click', function(event) { decorateLink(event); }); document.body.addEventListener('contextmenu', function(event) { // Aside from a normal click, we need to handle the variety of ways users // can open a link in a new tab // Right click to open context menu decorateLink(event); }); document.body.addEventListener('mousedown', function(event) { // Aside from a normal click, we need to handle the variety of ways users // can open a link in a new tab // Middle mouse button click if (event.button === 1) { decorateLink(event); } }); }); } function decorateLink(event) { window._envGaTrackerNames = ACCOUNTS; var currentTarget = jQuery(event.target); var link = currentTarget.closest('a')[0]; var ourDomains = ["audiojungle.net","themeforest.net","videohive.net","graphicriver.net","3docean.net","codecanyon.net","photodune.net","elements.envato.com","build.envatohostedservices.com","author.envato.com","tutsplus.com","sites.envato.com","account.envato.com","forums.envato.com"]; var filteredDomains = ourDomains.filter(function(domain) { return domain !== document.location.hostname; }); for (var i = 0; i < ACCOUNTS.length; i++) { var t = ACCOUNTS[i]; if (link && link.href) { if (filteredDomains.includes(link.hostname) || currentSiteLinkOpensInNewWindow(link)) { ga(t+'.linker:decorate', link) } } } } function currentSiteLinkOpensInNewWindow(link) { return document.location.hostname === link.hostname && link.target === '_blank'; } function setupGoogleAnalytics() { (function () { var accountId = "UA-11834194-12"; window['ga-disable-'+accountId] = false; var options = {"name":"m","allowLinker":true}; if (Market.Helpers.GaLsUtils.localStorageAvailable()) { if (Market.Helpers.GaLsUtils.clientIdNotPresent()) { options.clientId = Market.Helpers.GaLsUtils.retrieveClientId(); } ga("create", accountId, options); ga(function() { var tracker = ga.getByName(options.name); Market.Helpers.GaLsUtils.storeClientId(tracker.get('clientId')); for (var i = 0; i < ACCOUNTS.length; i++) { var t = ACCOUNTS[i]; ga(t+'.set', 'dimension18', Market.Helpers.GaLsUtils.retrieveClientId()) } }) } else { ga("create", accountId, options); } window._envGaTrackerNames = ACCOUNTS; for (var i = 0; i < ACCOUNTS.length; i++) { var t = ACCOUNTS[i]; ga(t+'.require', ""); ga(t+'.require', 'ec'); ga(t+'.require', 'displayfeatures'); ga(t+'.set', 'dimension20', 'item:details') var itemPageIdMatch = window.location.pathname.match(/^\/item\/[a-z-]+\/(?:reviews\/)?(\d+)(?:\/comments|\/support)?$/); if (itemPageIdMatch) { // Fetch item ID from path var itemId = itemPageIdMatch[1]; ga(t+'.set', 'dimension23', itemId); } } loadLinkingForAllAccounts() }()); } function loadGoogleAnalytics() { (function () { var s=document.createElement('script'); s.type='text/javascript'; s.async=true; s.src='https://www.google-analytics.com/analytics.js'; var x=document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s,x); }()); } //]]> </script> <script nonce="rXYqdYIOgpote8Hih2sq8g=="> //<![CDATA[ trimGacUaCookies() trimGaSessionCookies() function trimGacUaCookies() { // Trim the list of gac cookies and only leave the most recent ones. This // prevents rejecting the request later on when the cookie size grows larger // than nginx buffers. let maxCookies = 15 var gacCookies = [] let cookies = document.cookie.split('; ') for (let i in cookies) { let [cookieName, cookieVal] = cookies[i].split('=', 2) if (cookieName.startsWith('_gac_UA')) { gacCookies.push([cookieName, cookieVal]) } } if (gacCookies.length <= maxCookies){return } gacCookies.sort((a, b) => { return (a[1] > b[1] ? -1 : 1) }) for (let i in gacCookies) { if (i < maxCookies) continue $.removeCookie(gacCookies[i][0], { path: '/', domain: '.' + window.location.host }) } } function trimGaSessionCookies() { // Trim the list of ga session cookies and only leave the most recent ones. This // prevents rejecting the request later on when the cookie size grows larger // than nginx buffers. let maxCookies = 15 var gaCookies = [] // safelist our GA properties for production and staging const KEEPLIST = ['_ga_ZKBVC1X78F', '_ga_9Z72VQCKY0'] let cookies = document.cookie.split('; ') for (let i in cookies) { let [cookieName, cookieVal] = cookies[i].split('=', 2) // explicitly ensure the cookie starts with `_ga_` so that we don't accidentally include // the `_ga` cookie if (cookieName.startsWith('_ga_')) { if (KEEPLIST.includes(cookieName)) { continue } gaCookies.push([cookieName, cookieVal]) } } if (gaCookies.length <= maxCookies){return } gaCookies.sort((a, b) => { return (a[1] > b[1] ? -1 : 1) }) for (let i in gaCookies) { if (i < maxCookies) continue $.removeCookie(gaCookies[i][0], { path: '/', domain: '.' + window.location.host }) } } //]]> </script> <script nonce="rXYqdYIOgpote8Hih2sq8g=="> //<![CDATA[ // Set Datadog custom attributes (function () { if (typeof window.datadog_attributes != 'object') window.datadog_attributes = {} window.datadog_attributes['pageType'] = 'item:details' })() //]]> </script> </body> </html>

CINXE.COM

XMENU - Ultimate Responsive Mega Menu by IndianCoder | CodeCanyon