Hello,
I am using the following script to toggle the amount of list items shown.
It works great, but instead of .toggle, I want to animate the toggle with .slideToggle, but it’s not working.
You can see the code here http://jsbin.com/ekolo/edit and below
$(function() {
var hiddenElements = $('.facet ul li:gt(6)').hide();
if (hiddenElements.size() > 0) {
var showCaption = '...' + hiddenElements.size() + ' More Choices';
$('.facet ul').append(
$('<li id="toggler">' + showCaption + '</li>')
.[COLOR="Red"]toggle[/COLOR](
function() {
hiddenElements.show();
$(this).text('...Fewer Choices');
},
function() {
hiddenElements.hide();
$(this).text(showCaption);
}
)
);
}
});
I have changed it the following with no avail:
$(function() {
var hiddenElements = $('.facet ul li:gt(6)').hide();
if (hiddenElements.size() > 0) {
var showCaption = '...' + hiddenElements.size() + ' More Choices';
$('.facet ul').append(
$('<li id="toggler">' + showCaption + '</li>')
.[B][COLOR="Red"]slideToggle[/COLOR][/B]([B][COLOR="Red"]'slow',[/COLOR][/B]
function() {
hiddenElements.show();
$(this).text('...Fewer Choices');
},
function() {
hiddenElements.hide();
$(this).text(showCaption);
}
)
);
}
});
And help appreciated.
Thank you.