Page 1 of 1

Expand and collapse info by header or image

Posted: Sun Oct 22, 2017 1:48 pm
by Elaini
I have a lot of information in my web profiles... no doubt it's tl;dr for many visitors but I still want to keep that information just in case someone gets interested and bothers to read it, and keep it as well organized, too. I do intend to keep my profiles as the center point of my IMVU activities, after all.

So I'm looking for a simple script that toggles the <div> below as visible or invisible simply by clicking a link above, either in a form of a header or an image. If the link and div are similarly titled in code, the script would link them somehow... or however it works.

An example in point...

If the script has an effect to it that slides it open or closed, all the better.

Re: Expand and collapse info by header or image

Posted: Tue Oct 24, 2017 12:13 pm
by Nums
You mean like a show/hide button ?

Like how I did on my page

http://www.imvu.com/shop/product.php?pr ... d=38769282

Re: Expand and collapse info by header or image

Posted: Tue Oct 24, 2017 7:49 pm
by gaf210
Made a quick little code to do just as you asked here:

http://filedrive.imvustylez.net/file/1508899704

Feel free to tweak around ^^

TIP: change the 'slow' for 'fast' if you want the toggle to be quicker ^^

Re: Expand and collapse info by header or image

Posted: Wed Oct 25, 2017 1:45 am
by Elaini
That's perfect, thanks Gaf. :D

Re: Expand and collapse info by header or image

Posted: Wed Oct 25, 2017 1:58 pm
by gaf210
wooot! let me know if you need any help setting the code up :)

Re: Expand and collapse info by header or image

Posted: Thu Oct 26, 2017 6:53 pm
by Elaini
gaf210 wrote:
Wed Oct 25, 2017 1:58 pm
wooot! let me know if you need any help setting the code up :)
I understood it. :) It's heavily used on all of my profiles now. They're not fully revamped yet with some newer graphics missing, but at least the mechanics are now working perfectly... so thanks again.

Re: Expand and collapse info by header or image

Posted: Thu Oct 26, 2017 7:34 pm
by gaf210
woah! i love how you styled the links and how you even nested them one into the other... you can really code hun! Love the feel of the page too... you really caught that Lord of the Rings elvish look :) Congrats!!

Re: Expand and collapse info by header or image

Posted: Fri Oct 27, 2017 4:34 am
by Elaini
gaf210 wrote:
Thu Oct 26, 2017 7:34 pm
woah! i love how you styled the links and how you even nested them one into the other... you can really code hun! Love the feel of the page too... you really caught that Lord of the Rings elvish look :) Congrats!!
Thank you... Well, it's a themed account. I didn't want to just snatch the name and then make it something random, so I make sure that it also honors the character. I'll make the background lighter later...

Re: Expand and collapse info by header or image

Posted: Sat Oct 28, 2017 11:02 am
by Nums
Wow, that drop down looks so professional. You wouldn't happen to mind if I used that code, would you? Puts my noob coding to shame.

Re: Expand and collapse info by header or image

Posted: Sun Oct 29, 2017 6:13 am
by Elaini
Nums wrote:
Sat Oct 28, 2017 11:02 am
Wow, that drop down looks so professional. You wouldn't happen to mind if I used that code, would you? Puts my noob coding to shame.
It's Gaf's, up to him. :)

Re: Expand and collapse info by header or image

Posted: Sun Oct 29, 2017 5:04 pm
by gaf210
Nums wrote:
Sat Oct 28, 2017 11:02 am
Wow, that drop down looks so professional. You wouldn't happen to mind if I used that code, would you? Puts my noob coding to shame.
Hehee of course theres no probs buddy! Its there for anyone that wants to use it.

Btw imvu homepages already include jquery so that first line of code can be ignored :)