Let me be more specific, this is the code I have:
$(function() {
$("#accordion1").addClass("ui-accordion ui-widget ui-helper-reset")
.find("h3")
.addClass("ui-accordion-header ui-helper-reset ui-state-default
ui-corner-top ui-corner-bottom")
.prepend('<span class="ui-icon ui-icon-triangle-1-e"/>')
.hover(function() {
$(this).addClass("ui-state-hover");
},
function() {
$(this).removeClass("ui-state-hover");
})
.click(function() {
$(this).toggleClass("ui-accordion-header-active").toggleClass("ui-state-active")
.toggleClass("ui-state-default").toggleClass("ui-corner-bottom")
.find(">
.ui-icon").toggleClass("ui-icon-triangle-1-e").toggleClass("ui-icon-triangle-1-s")
.end().next().toggleClass("ui-accordion-content-active").toggle();
return false;
})
.next().addClass("ui-accordion-content ui-helper-reset
ui-widget-content ui-corner-bottom").hide();
//$("#accordion1").sortable();
})
Where am I going wrong?
--- On Fri, 5/15/09, Richard D. Worth <rdwo...@gmail.com> wrote:
From: Richard D. Worth <rdwo...@gmail.com>
Subject: [jQuery] Re: Sortable accordion-like widget
To: jquery-en@googlegroups.com
Date: Friday, May 15, 2009, 10:51 AM
Sure, here you go:
http://jsbin.com/aqeca
You can edit this example here:
http://jsbin.com/aqeca/edit
It's not perfect, since when you sort one, it also toggles it, but it's a start.
- Richard
On Fri, May 15, 2009 at 10:19 AM, Danny Nolan <danny_no...@yahoo.co.uk> wrote:
Example? Im very new to jQuery, the old code was partially provided by someone
else with a few edits, so not sure how to create that new level you was talking
about.
--- On Thu, 5/14/09, Richard D. Worth <rdwo...@gmail.com> wrote:
From: Richard D. Worth <rdwo...@gmail.com>
Subject: [jQuery] Re: Sortable accordion-like widget
To: jquery-en@googlegroups.com
Date: Thursday, May 14, 2009, 10:12 PM
You'll need to add an extra level: section divs containing each related h3 and
content div. Then you can call .sortable() the main div#accordion1
- Richard
On Thu, May 14, 2009 at 9:38 PM, DanN <danny_no...@yahoo.co.uk> wrote:
Got this coded, its an accordion like tool. It functions just how I
need it, except id love to make it sortable. Anyone help with the code
update?
jQuery :
$(function() {
$("#accordion1").addClass("ui-accordion ui-widget ui-helper-reset")
.find("h3")
.addClass("ui-accordion-header ui-helper-reset ui-state-default
ui-
corner-top ui-corner-bottom")
.prepend('<span class="ui-icon ui-icon-triangle-1-e"/>')
.hover(function() {
$(this).addClass("ui-state-hover");
},
function() {
$(this).removeClass("ui-state-hover");
})
.click(function() {
$(this).toggleClass("ui-accordion-header-active").toggleClass("ui-
state-active")
.toggleClass("ui-state-default").toggleClass("ui-corner-bottom")
.find(">
.ui-icon").toggleClass("ui-icon-triangle-1-e").toggleClass
("ui-icon-triangle-1-s")
.end().next().toggleClass("ui-accordion-content-active").toggle();
return false;
})
.next().addClass("ui-accordion-content ui-helper-reset
ui-widget-
content ui-corner-bottom").hide();
})
HTML:
<div id="accordion1">
<h3><a href="#">DRAW2</a></h3>
<div>
CONTENT
</div>
<h3><a href="#">DRAW2</a></h3>
<div>
CONTENT
</div>
</div>
Help appreciated in advance.
