View Full Version : Expando image problems

04-01-2009, 08:00 AM
Hi all
I have used Expando and am really pleased with it apart from one thing....My test images (which can be seen on a test page at www.saturdaysquares.com/Demo.html ) expand underneath each other and I would like them to either expand on top of each other, or as in the demo, move the others out of the way.
I have tried the revised expando.js file that I found in the forums but that makes the images disappear after they've contracted again.
Any help on this would be much appreciated

04-01-2009, 11:12 AM
In future, please post about Dynamic Drive Scripts in the Dynamic Drive Scripts Help section here where I've moved this thread, and:

Warning: Please include a link to the DD script in question in your post. See this thread (http://www.dynamicdrive.com/forums/showthread.php?t=6) for the proper posting format when asking a question.

Try it without (highlighted) these and similar:

<div id="bv_Html1" style="position:absolute;left:267px;top:179px;width:100px;height:100px;z-index:10" align="left">
<img class="expando" border="0" src="http://saturdaysquares.com/car.jpg" width="100" height="100">


04-01-2009, 08:18 PM
Hi John
Sorry for not posting this in the proper place and not following protocol.....it's my first post.
Thanks for the tip, it worked a treat apart from the images are now at the top of the page but I think I can sort that one out (says he who has just started this web site stuff at 50 years old!!!) :o

Thanks once again


04-01-2009, 09:07 PM
Ok I spoke too soon.....how can I position the images where I want them?



04-01-2009, 11:53 PM
I've just been looking at the original link that you posted. It's a definite improvement. But basically you need to make a choice. Are you going to have things expand and push other content around (as in the demo page for this script), or are you going to go for some type of modification where the images expand more or less in place - without displacing surrounding content. Aside from that, you may put the images wherever you like. After all, they are just ordinary image tags.

04-02-2009, 06:45 AM
Thank you for your continued help John
Idealy I would like the images to expand in place and on top of each other without the displacement. In time I want to resize the original images (which will all be different) to a uniform size and to have them expand within the page ie. expand left, expand right, expand up etc. Also I would like the expanded image to be "clickable" but that is beyond me at this time.
Right now, finding out how to position them where I want them is a challenge :)



04-02-2009, 08:19 AM
Then you should be working along the lines as developed in this thread:


The current live page may be seen here:


With a more basic demo (which includes the script modifications and styling, as well as an on page helper script) here (use 'view source' to get the code):


The modified script is here (right click, 'save as'):


Apart from that, it sounds as though you also need some basic and/or intermediate help with page layout. Each 'image' in this new scheme is actually an image nested in a div element, involving positioning and background styles, ex:

<div class="excontainer start" id="image1">
<img class="expando ex1" src="../vfs/images/01_lrg.jpg" width="75" height="56" alt="">

Once you have the modified code and units like the above, these may be (for positioning on the page) floated within another division, or each placed within a table's cell. Their individual styles determine which direction they will expand in.

04-04-2009, 06:24 AM
Thank you for your patience John.
I tried what you said but now the images are just disappearing once they've contracted.
I think I've bitten off more than I can chew here so I'm gonna leave it alone for a few days.
Thanks again for your help, must be an uphill struggle trying to help guys like me.....sharing your knowledge like this is breath of fresh air in this day and age!!!