Skip to content

Instantly share code, notes, and snippets.

@koshiaaaaan

koshiaaaaan/example.html

Created September 8, 2010 07:59
Show Gist options
  • Save koshiaaaaan/569799 to your computer and use it in GitHub Desktop.
Save koshiaaaaan/569799 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
example.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>test</title>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load("jquery", "1.4");</script>
<script type="text/javascript" src="jquery.accordion_tree.js"></script>
</head>
<body>
<script type="text/javascript">
//<!--
$(function(){
$('#accordionTree').accordionTree();
})
//-->
</script>
<ul id="accordionTree" class="style01">
<li><a href="/example">node1-1</a></li>
<li>
<a href="#">node1-2</a>
<ul>
<li><a href="/example">node1-2-1</a></li>
</ul>
</li>
<li>
<a href="#">node1-3</a>
<ul>
<li><a href="/example">node1-3-1</a></li>
<li>
<a href="#">node1-3-2</a>
<ul>
<li><a href="/example">node1-3-2-1</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#">node1-4</a>
<ul>
<li><a href="/example">node1-4-1</a></li>
<li>
<a href="#">node1-4-2</a>
<ul>
<li><a href="/example">node1-4-2-1</a></li>
<li>
<a href="#">node1-4-2-2</a>
<ul>
<li><a href="/example">node1-4-2-2-1</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</body>
</html>
Raw
jquery.accordion_tree.js
(function($){
$.fn.accordionTree = function(options){
var c = $.extend({
speed : 'fast',
openedClass : 'opened',
openerClass : 'opener',
action : function(elem,isOpener){}
}, options);
$(this).find('a').each(function(){
if(!$(this).hasClass(c.openedClass)){
if($('+ul',this).length > 0){
c.action(this,true);
$(this).addClass(c.openerClass);
$('+ul',this).hide();
$(this).click(function(){
// 動かない
$(this).next('ul').eq(0).toggle(function(){
$(this).slideDown(c.speed);
},
function(){
$(this).slideUp(c.speed);
});
// 動く
// $('+ul',this).toggle(c.speed);
return false;
});
} else {
$(this).addClass(c.openedClass);
}
}
if($(this).hasClass(c.openedClass)){
c.action(this,false);
}
});
}
})(jQuery)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment