Hi,

I have had a homepage design through that I need to chop up and I am not sure that the requested effect is possible. Well I can't see how/where to start. Does anyone have any ideas as to whether the following is possible and if so, I would be very grateful for any suggestions.

The problem as best as I can describe it:

1. The site is left aligned, with a header and footer bar that runs 100% width
2. The layout is too wide to display on a 1024 monitor (intentionally)
3. There is an image that runs to the left hand side of the screen, to about half way across
4. There is a gap of about 50px to the left of the rest of the content. This is the largest this gap should be
5. On 1024 monitors the content should slide over to the left so that the gap is only about 10px
6. The image should then shift with the content and therefore 40px of it will be out of the left of the screen
7. What is more fun is that the image needs to be hooked into JQuery to provide interaction and change when the user rolls over a list of options.

Any idea whether this is possible? I have never had to work with a left aligned design that needs to adjust to the change of screen resolution or viewport size by sliding out of the left of the screen but only to a set amount.

Many thanks for reading this and hopefully shedding some light on it for me.

Hi Davist11, I can't show you the actual design but I'll create a wireframe/mockup of it to illustrate.

Thanks for taking the time to read

Hi,

I have been partially successful in the implementation but only in Firefox. IE and Safari are not interested. Here is the experiment: http://code.likeaninja.co.uk/crumple/crumple.htm

Could anyone please spare a moment to have a look at this page in Firefox to see the sort of thing it should be doing and then shed any light on why no other browser will consider the crumple zone? Any suggestions in about the experiment/implementation in general appreciated.

Many thanks for your time and suggestions.