CODEWITHSUNDEEP
javascriptjquerymagentommenu
mohammadx90
mohammadx90

Reputation: 3

use jquery mmenu with Magento

I am trying to use mmenu in my Magento website. But I can not figure out how to do it.

It works fine as a separate file, but when I insert the same code in a CMS page in Magento, it does not work at all. Please help.

<script type="text/javascript" src="http://code.jquery.com/jquery-2.2.0.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jQuery.mmenu/5.7.0/js/jquery.mmenu.all.min.js"></script>
<script type="text/javascript">
	$(function() {
   			$('nav#menu').mmenu();
 		});
		</script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jQuery.mmenu/5.7.0/css/jquery.mmenu.all.css" />
<div id="page">
	<div class="">
		<a href="#menu" style="display: block;width: 40px;height: 40px;"></a>
				Demo
	</div>

	<nav id="menu">
		<ul>
			<li><a href="#">Home</a></li>
			<li><span>About us</span>
		  <ul>
			  <li><a href="#about/history">History</a></li>
			  <li><span>The team</span>
					<ul>
						<li><a href="#about/team/management">Management</a></li>
						<li><a href="#about/team/sales">Sales</a></li>
						<li><a href="#about/team/development">Development</a></li>
					</ul>
				</li>
			<li><a href="#about/address">Our address</a></li>
		</ul>
			</li>
			<li><a href="#contact">Contact</a></li>
		</ul>
	</nav>
</div>

Upvotes: 0

Views: 422

Answers (1)

RichTea
RichTea

Reputation: 1435

You need to ensure that jquery is running in noconflict mode, so that it can run alongside prototype.

 var $j = jQuery.noConflict(); 

 $j(function() {
    $j('nav#menu').mmenu();
 });

You should also call js files via local.xml rather than inline.

Upvotes: 1

Related Questions