Доброго дня. Подобная проблема. После клика на ссылке страница открывается с закрытым аккордеоном. А надо, чтоб оставалось открытым на кликнутой ссылке.
сайт
<script type="text/javascript" src="http://delaisait.ucoz.ru/js/jQuery/plugin/multiple-accordion.js"></script>
<script language="JavaScript">
$(document).ready(function() {
$(".dssection").accordion({
accordion:true,
speed: 50,
closedSign: '<img src="http://gtrad.ucoz.net/arvniz.gif">',
openedSign: '<img src="http://gtrad.ucoz.net/arvverh.gif">'
});
});
</script>
<div class="dssection">
<ul>
<li><a href="#">Каталог</a>
<ul>
<li><a href="#http://gtrad.ucoz.net/index/0-19">БРС</a>
<ul>
<li><a href="#http://gtrad.ucoz.net/index/0-19">Камлоки</a>
<ul>
<li><a href="http://gtrad.ucoz.net/publ/14-1-0-2">Алюминий</a></li>
<li><a href="http://gtrad.ucoz.net/index/0-39">Нержа</a></li>
<li><a href="#">Полипропилен</a></li>
<li><a href="#">Кольца</a></li>
<li><a href="#">Размеры</a></li>
<li><a href="#">Адаптеры</a>
<ul>
<li><a href="#">Под приварку</a></li>
<li><a href="#">Фланцевые</a></li>
<li><a href="#">Подуровень 3</a></li>
<li><a href="#">Подуровень 4</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="#">Буровые</a></li>
<li><a href="#">Подуровень 3</a></li>
<li><a href="#">Подуровень 4</a></li>
</ul>
</li>
<li><a href="#">Уровень 1-2</a></li>
<li><a href="#">Уровень 1-3</a></li>
<li><a href="#">Рукава</a>
<ul>
<li><a href="#">Рукава 1</a></li>
<li><a href="#">Рукава 2</a></li>
<li><a href="#">Подуровень 3</a></li>
<li><a href="#">Подуровень 4</a></li>
</ul>
</li>
<li><a href="#">Уровень 1-4</a></li>
</ul>
</li>
<li><a href="#">Фильтр</a></li>
<li><a href="#">2я ячейка пунктов</a>
<ul>
<li><a href="#">Уровень 1</a></li>
<li><a href="#">Уровень 2 переход</a>
<ul>
<li><a href="#">Подуровень 1</a></li>
<li><a href="#">Подуровень 2</a></li>
<li><a href="#">Подуровень 3</a></li>
<li><a href="#">Подуровень 4</a></li>
</ul>
</li>
<li><a href="#">Уровень 1-2</a></li>
<li><a href="#">Уровень 1-3</a></li>
<li><a href="#">Уровень 1-4</a></li>
</ul>
</li>
<li><a href="#">3я ячейка пунктов</a>
<ul>
<li><a href="#">Уровень 1</a></li>
<li><a href="#">Уровень 1-2</a></li>
<li><a href="#">Уровень 2 переход</a>
<ul>
<li><a href="#">Подуровень 1</a></li>
<li><a href="#">Подуровень 2</a></li>
<li><a href="#">Подуровень 3</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
и скрипт
/*
* jQuery UI Multilevel Accordion v.1
* Copyright (c) 2011 Pieter Pareit
* [url]http://www.scriptbreaker.com[/url]
*/
//plugin definition
(function($){
$.fn.extend({
//передать переменную options в функцию
accordion: function(options) {
var defaults = {
accordion: 'true',
speed: 300,
closedSign: '[+]',
openedSign: '[-]'
};
// Расширьте наши параметры по умолчанию с предоставленными вами.
var opts = $.extend(defaults, options);
//Назначить текущий элемент переменной, в этом случае это элемент UL
var $this = $(this);
//добавьте отметку [+] в многоуровневое меню
$this.find("li").each(function() {
if($(this).find("ul").size() != 0){
//добавить многоуровневый знак рядом со ссылкой
$(this).find("a:first").append("<span>"+ opts.closedSign +"</span>");
//избегайте прыгать в верхнюю часть страницы, когда href является #
if($(this).find("a:first").attr('href') == "#"){
$(this).find("a:first").click(function(){return false;});
}
}
});
//открытый активный уровень
$this.find("li.active").each(function() {
$(this).parents("ul").slideDown(opts.speed);
$(this).parents("ul").parent("li").find("span:first").html(opts.openedSign);
});
$this.find("li a").click(function() {
if($(this).parent().find("ul").size() != 0){
if(opts.accordion){
//Ничего не делать, когда список открыт
if(!$(this).parent().find("ul").is(':visible')){
parents = $(this).parent().parents("ul");
visible = $this.find("ul:visible");
visible.each(function(visibleIndex){
var close = true;
parents.each(function(parentIndex){
if(parents[parentIndex] == visible[visibleIndex]){
close = false;
return false;
}
});
if(close){
if($(this).parent().find("ul") != visible[visibleIndex]){
$(visible[visibleIndex]).slideUp(opts.speed, function(){
$(this).parent("li").find("span:first").html(opts.closedSign);
});
}
}
});
}
}
if($(this).parent().find("ul:first").is(":visible")){
$(this).parent().find("ul:first").slideUp(opts.speed, function(){
$(this).parent("li").find("span:first").delay(opts.speed).html(opts.closedSign);
});
}else{
$(this).parent().find("ul:first").slideDown(opts.speed, function(){
$(this).parent("li").find("span:first").delay(opts.speed).html(opts.openedSign);
});
}
}
});
}
});
})(jQuery);
и css
.dssection {background: #f3f3f5;padding:0;list-style:none;}
.dssection ul{padding: 0;margin: 0;font-size: 11x;line-height: 12px;list-style: none;}
.dssection li {;list-style: none;}
/*menu0*/
.dssection li a {display: block;line-height: 12px;/*text-indent:5px;*/padding-left: 5px;color:#000;height: 15px;text-decoration: none;font-size: 11px;font-weight: normal;outline:none;}
.dssection li a:hover {display: block;background: #e6e6e6;text-decoration:none;}
/*menu-1 */
.dssection ul ul {background:#fff;/*padding: 10px 0 10px 0*/;display:none;}
.dssection ul ul li {margin: 0;padding: 0;clear: both;}
.dssection ul ul li a {/* Цвет фона внутри */background: #fff;padding: 0px 0 0 0;height:15px;line-height: 12px;text-decoration: none;/* Цвет текста */color: #005e2b;text-indent:10px;font-size:11px;}
.dssection ul ul li.active a {color: #000;font-weight: bold;}
.dssection ul ul li a:hover {/*menu-1 */background: #e6e6e6;padding: 0px 0 0 0;height:15px;line-height: 12px;text-decoration: none;/* Цвет текста при наведении */color: #005e2b;text-indent:10px;/* Размер текста при наведении */font-size:11px;}
/*menu-2 */
.dssection ul ul ul li a {color:#000;padding-left:5px;}
.dssection ul ul ul li.active a {color: #000;font-weight: bold;}
.dssection ul ul ul li a:hover {/* menu 2 */background-color:#D3CEB8;/* Цвет текста пункта при наведении */color:#675C7C;padding-left: 5px;}
/*menu-3 */
.dssection ul ul ul ul li a {color:#000;padding-left:10px;}
.dssection ul ul ul li.active a {color: #000;font-weight: bold;}
.dssection ul ul ul ul li a:hover {/* menu 2 */background-color:#D3CEB8;/* Цвет текста пункта при наведении */color:#675C7C;padding-left: 10px;}
/*menu-4 */
.dssection ul ul ul ul ul li a {color:#ff0000;padding-left:15px;}
.dssection ul ul ul li.active a {color: #000;font-weight: bold;}
.dssection ul ul ul ul ul li a:hover {background-color:#D3CEB8;color:#675C7C;padding-left: 15px;}
.dssection ul span{float: right;clear:both; padding-right:5px}
