2 bits of Javascript...

PMWD · 14 Jul 2010 at 21:58

1. Those image based sliders on forms to change values, no idea how that works, anyone got any tutorials?
2. How do you get a div to expand to the right size when the content is random text so height isn't predetermined?

Thanks

Tripnologist · 14 Jul 2010 at 22:35

PMWD said:
1. Those image based sliders on forms to change values, no idea how that works, anyone got any tutorials?
2. How do you get a div to expand to the right size when the content is random text so height isn't predetermined?
Thanks

1. http://jqueryui.com/demos/slider/
2. If you don't give a div a set height, it will auto size itself to the content.

PMWD · 15 Jul 2010 at 08:34

1. You superstar that's perfect
2. Sorry I meant expand it with javascript, current content fades, div resizes (assuming it has a background colour or image) then you fade the new content back in.

Thanks

BunnyKillBot · 15 Jul 2010 at 10:44

I am a mootools monkey so i have no idea about jquery, but as has been previously said a div will automatically expand to include its contents. You can directly alter the contents of any element by setting its innerHTML.

http://www.tizag.com/javascriptT/javascript-innerHTML.php

In your example it is thereby a simple case of psuedocode;
transition out,
set innerHTML
transition in,

edit; if you want to alter the background text and/or image again i have no idea about jquery but in mootools you can use setStyles: http://mootools.net/docs/core/Element/Element.Style#Element:setStyles

Tripnologist · 15 Jul 2010 at 11:56

As BunnyKillBot has said, you'll need to transition out, change content and then transition in.

BunnyKillBot said:
...set innerHTML...
...no idea about jquery but in mootools you can use setStyles...

Setting html with jquery is done with .html() and inline styles are set with .css('name' : 'value')