[Pro] Box Model and Show/Hide

Having moved another step into retirement mode I have taken down my original web site and replaced it, at least temporarily, with something that is more relevant to what I do now. I have used Box Model principles, which have worked out fine, in the main.

However I have included a selection of layered images nested in a single container, so that they fit within the overall box model style - without over complex inline placement to juggle their positions and also to possibly allow overlapping graphics.

Consequently I cannot apply indivividual Rollover and Target Show/Hide Layer Actions to show larger images from thumbnails on mouseover. The Rollover selects the whole Div even if I select only one image in it.

Does anyone know of a way around this - or is back to dividing everything up into an inline jigsaw?

You can see an example page at:

http://www.colinalcock.co.uk/wrttenandvisualc.html

Bear in mind the site is still under development, so any criticisms are welcome.

Colin


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Did you try putting each image into it’s own div inside the single container?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks for that. It was what I meant by a ‘jigsaw’ of inline elements
and I was hoping i’d find someone who had already tried it before I
set out on the task. I’ll post what transpires.

Colin

On 18 Feb 2010, at 17:38, chuckamuck wrote:

Did you try putting each image into it’s own div inside the single
container?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

If you follow your two column idea with the images within the blue container it shouldn’t give you too much of a problem. Just insert all the divisions first, then import the photos. If you alternate the float on the divisions (1st one right, 2nd one left, 3rd right, etc.) it should be fine. Then you can add some padding to each of those divs before adding the graphics to keep things spaced nicely.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Will do - tomorrow. It’s mid-evening this side of the pond. I’ve done
something similar before - I was just being lazy trying to “simplify”
in order to get a quick replacement site up, whereas I know the real
answer is to be disciplined in the structure.

Colin

On 18 Feb 2010, at 19:37, chuckamuck wrote:

If you follow your two column idea with the images within the blue
container it shouldn’t give you too much of a problem. Just insert
all the divisions first, then import the photos. If you alternate
the float on the divisions (1st one right, 2nd one left, 3rd right,
etc.) it should be fine. Then you can add some padding to each of
those divs before adding the graphics to keep things spaced nicely.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

On 18 Feb 2010, 7:06 pm, ColinJA wrote:

… whereas I know the real
answer is to be disciplined in the structure.

This is especially true when following the box model.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks again - a quick test this morning showed that separate Divs per
image work fine. As soon as I have some self-time (after clients and
grand-kids, which will take up most of today) I’ll sort out the
padding, etc. for the final spacing of the ‘thumbs’.

Colin

On 18 Feb 2010, at 19:37, chuckamuck wrote:

If you follow your two column idea with the images within the blue
container it shouldn’t give you too much of a problem. Just insert
all the divisions first, then import the photos. If you alternate
the float on the divisions (1st one right, 2nd one left, 3rd right,
etc.) it should be fine. Then you can add some padding to each of
those divs before adding the graphics to keep things spaced nicely.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options