I am a beginner at web development and I am now using semantic-ui framework for my font-end development.I have tried the sample code for the first example menu at this link.
http://semantic-ui.com/collections/menu.html
But my menu don't change active state on click like this.I have tried $("..").menu() method and it shows $(..).menu is not a function.I wonder if you could help me please.Shall I have to write my custom Javascript code to change active state on click or on hover. Here is my code
<!DOCTYPE html>
<html lang="">
<head>
<script src="jquery.js"></script>
<link rel="stylesheet" type="text/css" href="Semantic-UI-master/dist/semantic.min.css">
<script src="Semantic-UI-master/dist/semantic.min.js"></script>
<style>
</style>
</head>
<div class="ui three item menu">
<a class="item">Editorials</a>
<a class="item">Reviews</a>
<a class="item active">Upcoming Events</a>
</div>
</html>
Semantic UI is an open-source framework that uses CSS and jQuery to build great user interfaces. It is the same as a bootstrap for use and has great different elements to use to make your website look more amazing. Semantic-UI Menu is used to display the grouped navigation menu.
Semantic UI is a modern framework used in developing seamless designs for the website, It gives the user a lightweight experience with its components. It uses predefined CSS and jQuery to incorporate different frameworks. The menu is a component that displays a group of items that serve as navigation between one section of the website to another.
This allows each menu item to automatically stretch to the size of the largest item. Many of the following examples use a coupling with dropdowns to display dropdown menus inside of ui menu.
A menu may contain a link item, or an item formatted as if it is a link. An item may contain a nested menu in a dropdown. A menu may contain another menu group in the same level as menu items.
Use this:
$('.ui .item').on('click', function() {
$('.ui .item').removeClass('active');
$(this).addClass('active');
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With