Semantic-UI
Semantic-UI copied to clipboard
semantic ui script not working
semantic ui script not working
Version
2.4.2
this is my head:
<head>
<!-- META -->
<meta charset="utf-8">
<meta name="Generator" content="XpressEngine">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- TITLE -->
<title>Welcome Page</title>
<!-- CSS -->
<link rel="stylesheet" href="/common/js/plugins/ui/jquery-ui.min.css">
<link rel="stylesheet" href="/layouts/semantic/css/semantic.min.css">
<link rel="stylesheet" href="/layouts/semantic/css/style.css">
<!-- JS -->
<script src="/common/js/jquery.min.js"></script>
<script src="/common/js/x.min.js"></script>
<script src="/common/js/xe.min.js"></script>
<script src="/layouts/semantic/js/semantic.min.js"></script>
</head>
code:
<header class="ui inverted top fixed menu header">
<div class="ui container">
<a href="/" class="item logo">
<img src="logo.png" />
</a>
<div class="item ui dropdown white">
Welcome Page <i class="dropdown icon"></i>
<div class="menu">
<a href="#" class="item">
SAMPLE 1
</a>
</div>
<div class="menu">
<a href="#" class="item">
SAMPLE 2
</a>
</div>
<div class="menu">
<a href="#" class="item">
SAMPLE 3
</a>
</div>
</div>
<div class="item ui dropdown white">
Board <i class="dropdown icon"></i>
<div class="menu">
<a href="#" class="item">
SAMPLE 1
</a>
</div>
<div class="menu">
<a href="#" class="item">
SAMPLE 2
</a>
</div>
</div>
</div>
</header>
css working fine. but when I click .dropdown element, dropdown not working
something wrong in my code?
Do you have the dropdowns initialized via
$('.ui.dropdown').dropdown() ?
This was my issue! Thank you! I couldn't find it under the getting started section ( https://semantic-ui.com/introduction/getting-started.html ) It might be good to add this for noobs like me.