Mootools手风琴无法正常工作 [英] mootools accordion not working
本文介绍了Mootools手风琴无法正常工作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我一直想尝试一下Mootools上的手风琴效果,但我无法使其正常工作,就像js根本没有加载
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
这是HTML代码
<!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>
这是application.js代码
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'); }
});
});
我做错了什么吗?另外,如果需要的话,我也使用sinatra.
Is there anything that I did wrong? Also I use sinatra if that matters.
也感谢您的宝贵时间. .
Also thanks for your time. . .
推荐答案
您忘记了将element
类添加到最后一个元素.
You forgot to add the element
class to the last element.
这是一个有效的jsfiddle: http://jsfiddle.net/arian/YqNuh/
This is a working jsfiddle: http://jsfiddle.net/arian/YqNuh/
这篇关于Mootools手风琴无法正常工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文