Want to make this Demo 6

Question

1.00/5 (4 votes)

See more:

Hi
i want to make this demo 6 , this url but not able to do can you help help me.?
http://www.aakashweb.com/resources/pages/demos/jquery-collapser/[^]

Please share some code

Thanks

Posted 15-Sep-12 6:14am

ravinsit89

Add a Solution

Comments

[no name] 15-Sep-12 12:20pm

So make it "Demo 6". How is this a problem? Share some code? Okay how about "42"? Can you read the posting guidelines? You know the ones. They were right in front of you as you typed your vague non-question begging-for-code posting in.

Richard MacCutchan 15-Sep-12 12:35pm

Unfortunately the guidelines are not the first thing that is seen; give it a try and you'll see for yourself. I raised this in Bugs & Suggs some time ago but it never got changed.

Sergey Alexandrovich Kryukov 20-Sep-12 12:40pm

Are you serious? You already have the code -- you just referenced it in the question.

If, by some reason you need to show your code, don't do it in comment, do it in the body of the question. Use "Improve question" in this case, see above.
--SA

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

ray_mayukh · Answer 1 · 2012-09-15T12:45:00

JQuery

C#

** Demo 6 **********************************/

$('.panel').hide();

$('.demo6').collapser({
    target: 'next',
    effect: 'slide',
    changeText: 0,
    expandClass: 'expIco',
    collapseClass: 'collIco'
}, function(){
    $('.panel').slideUp();
});

HTML

XML

<!-- Demo 6 -->
<h4 class="demo6">Heading 1</h4><div class="panel">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div> <h4 class="demo6">Heading 2</h4><div class="panel">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div><h4 class="demo6">Heading 3</h4><div class="panel">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div>  <h4 class="demo6">Heading 4</h4><div class="panel">Lorem Ipsum is simply dummy

CSS

C#

.expArrow{
    padding-left: 20px;
    background: url(images/arrow-down.png) no-repeat 0px 4px;
}
.collArrow{
    padding-left: 20px;
    background: url(images/arrow-up.png) no-repeat 0px 4px;
}
.expIco{
    padding-left: 20px;
    background: url(images/plus.gif) no-repeat 0px 4px;
}
.collIco{
    padding-left: 20px;
    background: url(images/minus.gif) no-repeat 0px 4px;
}
.demo6{
    border: 1px solid #B9E3FF;
    background: #0099FF;
    padding-left: 5px;
    color: #FFFFFF;
}
.panel{
    border: 1px solid #B9E3FF;
    padding: 10px;
}

Sergey Alexandrovich Kryukov · Answer 2 · 2012-09-20T06:38:00

Solution 2

All the jQuery code is JavaScript code, so it is all totally opened for you. Take the full source code from the site you just referenced and use it to see how to do such things. It's way to easy.

—SA

Posted 20-Sep-12 6:38am

Sergey Alexandrovich Kryukov