search

Semantic-Org / Semantic-UI

Semantic is a UI component framework based around useful principles from natural language.
http://www.semantic-ui.com
MIT License
51.12k stars 4.94k forks source link

Accordion unavailable! #4409

Closed kwaninmacau closed 8 years ago

kwaninmacau commented 8 years ago

Hi, I just now install semantic-ui. First of all, I was troubled in accordion issue.As you can see clicking on my project source code,accordion is unavaiable. I think that I have attached all files to be needed with accordion, but why not avaiable? Thank you! My project

<link rel="stylesheet" href="/joomla1/semantic/out/semantic.min.css" type="text/css">
<script src="http://semantic-ui.com/javascript/library/jquery.min.js"></script>
<script src="http://semantic-ui.com/dist/semantic.min.js"></script>
<script src="http://semantic-ui.com/javascript/accordion.js"></script>
<script type="application/javascript">$('.ui.accordion').accordion();</script>

<div class="ui styled accordion">
  <div class="title">
    <i class="dropdown icon"></i>
    What is a dog?
  </div>
  <div class="content">
    <p class="transition hidden">A dog is a type of domesticated animal. Known for its loyalty and faithfulness, it can be found as a welcome guest in many households across the world.</p>
  </div>
  <div class="title active">
    <i class="dropdown icon"></i>
    What kinds of dogs are there?
  </div>
  <div class="content active">
    <p class="transition visible">There are many breeds of dogs. Each breed varies in size and temperament. Owners often select a breed of dog that they find to be compatible with their own lifestyle and desires from a companion.</p>
  </div>
  <div class="title">
    <i class="dropdown icon"></i>
    How do you acquire a dog?
  </div>
  <div class="content">
    <p>Three common ways for a prospective owner to acquire a dog is from pet shops, private owners, or shelters.</p>
    <p>A pet shop may be the most convenient way to buy a dog. Buying a dog from a private owner allows you to assess the pedigree and upbringing of your dog before choosing to take it home. Lastly, finding your dog from a shelter, helps give a good home to a dog who may not find one so readily.</p>
  </div>
</div>
marcelodeolive1ra commented 8 years ago

@kwaninmacau I think your code would work if you put the line <script type="application/javascript">$('.ui.accordion').accordion();</script> in the end, AFTER the declaration of the accordion.

kwaninmacau commented 8 years ago

Thank you!Great!

marcelodeolive1ra commented 8 years ago

Great @kwaninmacau! Just remember to close this issue now it's solved.