mootools accordion not working

问题

I've been wanting to try out the Accordion effect on mootools but I can't get it to work, it's just like the js doesn't load at all

this is the HTML code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
 <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
    <title>BarDiJan - We Deliver</title> 
    <link rel="stylesheet" href="/stylesheets/reset.css" type="text/css" /> 
    <link rel="stylesheet" href="/stylesheets/style.css" type="text/css" /> 
    <script type="text/javascript" src="/javascripts/mootools-core-1.3-accordion.js"></script> 
    <script type="text/javascript" src="/javascripts/mootools-more.js"></script> 
    <script type="text/javascript" src="/javascripts/application.js"></script> 
 </head> 

<body>
    <div class="container"> 
    <div id="accordion"> 
  <h3 class="toggler">What we Do</h3> 
  <div class="element"> 
    <p>We are people who deliver professional quality identity to you, we have wide range of support.
    </p> 
  </div> 
  <h3 class="toggler">What we Did</h3> 
  <div class="element"> 
    <p>Under Construction</p> 
  </div> 
  <h3 class="toggler">What we Offer</h3> 
  <div class=""> 
    <ul> 
    <li>Web Design</li> 
    <li>Identity</li> 
    </ul> 
  </div> 
</div> 


    </div> 

  </body> 
</html>

This is the application.js code

windows.addEvent('domready', function() {

var accordion = new Accordion($$('h3.toggler'),$$('div.element'), {
    display: 2,
    opacity: false,
    alwaysHide: true,
    onActive: function(toggler) { toggler.setStyle('color', '#929292'); },
    onBackground: function(toggler) { toggler.setStyle('color', '#000000'); }
  });
});

Is there anything that I did wrong? Also I use sinatra if that matters.

Also thanks for your time. . .

回答1:

You forgot to add the element class to the last element.

This is a working jsfiddle: http://jsfiddle.net/arian/YqNuh/

回答2:

windows.addEvent('domready', function() {...

you make a mistake, window, not windows ;-) so :

window.addEvent('domready', function() {...

来源：https://stackoverflow.com/questions/4527829/mootools-accordion-not-working

标签

javascript

ruby

mootools

sinatra

javascript-framework