Niklas Rosencrantz
Niklas Rosencrantz

Reputation: 26655

Why won't my tabs work?

I'm trying the tab example from semantic ui but I can't make it work. the tabs don't change. did I forget to include something?

$(function() {
  $('.menu .item').tab();
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.2/semantic.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.2/semantic.min.js"></script>
<div class="ui top attached tabular menu">
  <a class="item active" data-tab="first">First</a>
  <a class="item" data-tab="second">Second</a>
  <a class="item" data-tab="third">Third</a>
</div>
<div class="ui bottom attached tab segment active" data-tab="first">
  First
</div>
<div class="ui bottom attached tab segment" data-tab="second">
  Second
</div>
<div class="ui bottom attached tab segment" data-tab="third">
  Third
</div>

Upvotes: 0

Views: 123

Answers (1)

Shlomi Haver
Shlomi Haver

Reputation: 974

I beleive you need to call this

$(function () {
   $('.menu .item').tab();
});

to make your tabs works.

And semantic-ui have great documentation you should look there.

Upvotes: 1

Related Questions