<a class="expander" href="#">click me</a>
<div class="content">
content to show/hide.
</div>
And one line of javascript:
$('.expander').simpleexpand();
View Demos
Thursday, June 14, 2012
Simple-expand: simple jQuery plug-in to expand/collapse elements
Simple-expand, as its name implies, the simplest collapse/expand solution I could think of. It works out of the box without any configuration.
All you need is:
Subscribe to:
Post Comments (Atom)
it doesn't work...
ReplyDeleteHi, what do you mean? Are you saying the paragraphs don't expand in the demo page? I tried them and they work. Can you give me more details?
DeleteHey this works great for me. But is there also a way to have it exanded by default and collapsed on click? Thanks!
ReplyDeleteYou can load the plug-in and trigger the click:
Delete$('.expander').simpleexpand();
$('.expander').click();
but you will see the expand animation.
It would be simple to add an option to support that. Please log an issue on the project's github issues list and I'll implement it.
Im not sure if you have developed coding, but Im looking for a Menu that has a submenu and when you click on the submenu, then a description will open up. All the menus have submenus and all the submenus have a description. Thanks in advance for your help.
ReplyDeleteexample:
Menu1
Menu2
------SubmenuA
---------Description
------SubmenuB
Menu3
Hi, I think what you are trying to accomplish is possible with the plug-in. But I don't understand your question. Can you rephrase?
DeleteWhat link should i put in the href=''#'' ?
ReplyDeleteNone, the '#' is enough. It's just to trick the browser into thinking that the link is valid.
DeleteGreat one! thanks for sharing, very simple once I found the rest of the javascript code for the function.
ReplyDeleteI have several sections on my page that need to expand or collapse when they are clicked. The plugin expands or collapses on ALL sections AT THE SAME TIME, meaning when one section is clicked, other sections also expand or collapse. What do I have to do to make it work on one section at a time. Thank you.
ReplyDeleteI get an error
ReplyDelete"VM8004:130 Uncaught TypeError: $ is not a function
at VM8004:130"
$(function () {
console.log("firing");
$('.expander').simpleexpand();
$('.expander').click();
});