JSFiddle - React, Tailwind, and code Playground

by sanaullah Rais

HTML

<!DOCTYPE html>
<html>

<head>
    
	<title>Basic Navigation</title>

    <link rel="stylesheet" href="http://www.teezdemos.cf/tutorials/responsive-menus/assets/navigation-basic.css">
	<link rel="stylesheet" href="assets/slicknav/slicknav.min.css">

</head>

<body>

	<nav class="menu-navigation-basic">
		<a href="#" class="selected">Home</a>
		<a href="#">Products</a>
		<a href="#">Services</a>
		<a href="#">Reach us</a>
		<a href="#">About</a>
	</nav>


	<div class="menu">

		<img class="arrow" src="assets/images/demo-arrow-up.png" alt="arrow" height="120">

		<h1>Freebie: 4 Responsive Navigation Menus</h1>

		<h2><a href="http://tutorialzine.com/2015/05/freebie-4-sweet-and-responsive-navigation-menus/">Download</a></h2>

		<ul>
			<li><a href="index.html" class="active">Basic</a></li>
			<li><a href="navigation-icons.html">Icons</a></li>
			<li><a href="navigation-dark.html">Icons Dark</a></li>
			<li><a href="navigation-round.html">Round</a></li>
		</ul>

	</div>

	<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
	<script src="assets/slicknav/jquery.slicknav.min.js"></script>

	<script>

		$(function(){

	        var menu = $('.menu-navigation-basic');

	        menu.slicknav();

	        // Mark the clicked item as selected

	        menu.on('click', 'a', function(){
	            var a = $(this);

	            a.siblings().removeClass('selected');
	            a.addClass('selected');
	        });
	    });
	    
	</script>

	<!-- Demo ads. Please ignore and remove. -->
	<script src="http://cdn.tutorialzine.com/misc/enhance/v3.js" async></script>

</body>

</html>