fading backgrounds
We have a client who is wanting us to redesign their current website, but they have had the graphics company who are doing their brochures do the actual design and have given us a PDF file with EXACTLY how they want each page to work! The thing that is causing an immediate headache is that within the main page they want a large picture to form the background of the middle cell of the table which isn't a problem apart from the fact they want this picture fading in & out to another picture. I know this can be done with javascript for images but it has to be a background as there is text to go over the top of it, which obviously has to be html text and not part of the image. Does anyone have any ideas how this can be achieved? Don't start on about tables!!!
Julia - if life was meant to be easy Michael Angelo would have painted the floor....
Megan posted this at 18:10 — 15th May 2006.
She has: 11,421 posts
Joined: Jun 1999
The only thing I can think of to try is to do it as normal images and then position a div on top.
Sounds like an example of how not to design a web site! Darned graphics designers
I would probably sit down with either the client or this designer and go over what can and cannot be done with the website design. There are surely a lot of things they didn't take into consideration.
Megan
Connect with us on Facebook!
timjpriebe posted this at 18:31 — 15th May 2006.
He has: 2,667 posts
Joined: Dec 2004
I would do it as an animated GIF. I've not tried that personally (as it sounds like it would be ugly), but that's the first thing I would try.
DaveyBoy posted this at 21:38 — 15th May 2006.
They have: 453 posts
Joined: Feb 2003
Yeah it would be ugly for sure! Imagine trying to read something with the background changing all the time. No thanks!
Agree with Tim for the method, an animated GIF - although expect it to be over 500kb if it's a large canvas with fade in/out frames!
papa-ante-portas posted this at 23:52 — 15th May 2006.
She has: 12 posts
Joined: Jul 2005
What about Flash?! You can do nearly everything in flash..also adding text. ...but it should all be flash than. Ans search engines don´t like it.
DaveyBoy posted this at 00:45 — 16th May 2006.
They have: 453 posts
Joined: Feb 2003
Yes, which rules flash out
Renegade posted this at 03:06 — 16th May 2006.
He has: 3,022 posts
Joined: Oct 2002
Well, I would also suggest the same as Tim. However, with large .gifs, you would get a very bad screen refresh problem so... it does look like you'll have to tell your client that you can't do that effect...
demonhale posted this at 08:54 — 16th May 2006.
He has: 3,278 posts
Joined: May 2005
This is not a straight solution, but can ajax help here? Ive seen some flash like features using ajax...
The Webmistress posted this at 09:05 — 16th May 2006.
She has: 5,586 posts
Joined: Feb 2001
The photos fade to the left so the text wouldn't really be over the photo part but I think I will have to try and talk them out of it. Thanks anyway!
Julia - if life was meant to be easy Michael Angelo would have painted the floor....
demonhale posted this at 09:16 — 16th May 2006.
He has: 3,278 posts
Joined: May 2005
I was thinking ajax as regular wide css as container... then use a z-index over the fading BG(css container) and reposition the site contents over the css/javascript imagery and use transparent BG. so it will show the texts over the fading BG...
DaveyBoy posted this at 09:52 — 16th May 2006.
They have: 453 posts
Joined: Feb 2003
That hurt my head Demonhale
Much easier to say "No, i'm sorry but that simply isn't an option" and save herself all the sleepness nights 
Plus then she could display it in her portfolio proudly without hating it lol.
JeevesBond posted this at 12:28 — 16th May 2006.
He has: 3,956 posts
Joined: Jun 2002
Firstly, that has nothing to do with AJAX. Secondly you've just suggested exactly what Megan said in the first reply but in a mind-bendingly complicated way!
I would agree that a gif is the way to go, although it's probably going to be huge! Did have a quick look to see if Flash could be used in place of a background image, but couldn't really find anything. Am pretty sure it could be done using Megans positioned div idea though.
Possibly better to dissuade them, if they definately want this then come back and we'll help with the code!
a Padded Cell our articles site!
DaveyBoy posted this at 12:34 — 16th May 2006.
They have: 453 posts
Joined: Feb 2003
His way seriously did hurt me noggin lol.
flash behind the div would be weird wouldn't it, what happens if you try to right click some text on it, will it give the flash player right-click or not? WHO KNOWS!!
demonhale posted this at 22:06 — 16th May 2006.
He has: 3,278 posts
Joined: May 2005
Yeah I actually got the idea from megan, the webmistress could decide another route, but its good to find somekind of discussion for a solution for such a nagging question that may also come my way in the future... the difference is I dont suggest using flash behind the css... use plain AJAX slideshow type image controls on a wide div container as a bg and as megan said position other div containers over it for the site content...
JeevesBond posted this at 12:30 — 17th May 2006.
He has: 3,956 posts
Joined: Jun 2002
What the heck has AJAX got to do with it?
DaveyBoy posted this at 12:35 — 17th May 2006.
They have: 453 posts
Joined: Feb 2003
Aren't they playing Feyenoord next week?
I dunno why people need to over-complicate things though!
demonhale posted this at 01:08 — 18th May 2006.
He has: 3,278 posts
Joined: May 2005
I think I misunderstood this part of the original post??? "want this picture fading in & out to another picture" ... I was then thinking use ajax here, you can achieve fade-in fade-out of pictures without using flash...
JeevesBond posted this at 12:46 — 18th May 2006.
He has: 3,956 posts
Joined: Jun 2002
LOL! Shame Arsenal lost eh?
Would you use XMLHttpRequest for that?! I wouldn't, I'd just load the bloomin images, you don't need to have any interaction with a database.
Sorry demonhale, it just annoys me when people confuse issues by using buzzwords. Especially when those buzz-words are wholly incorrect!
a Padded Cell our articles site!
The Webmistress posted this at 13:12 — 18th May 2006.
She has: 5,586 posts
Joined: Feb 2001
The reply was "but the graphic designers said it could be done!" so I asked them and they said "we thought you'd be building the site in flash"
Megan posted this at 14:09 — 18th May 2006.
She has: 11,421 posts
Joined: Jun 1999
LOL! Good lord
JeevesBond posted this at 21:47 — 18th May 2006.
He has: 3,956 posts
Joined: Jun 2002
Oh no, seriously? But they expect SEO right?
What're you going to do?
DaveyBoy posted this at 23:09 — 18th May 2006.
They have: 453 posts
Joined: Feb 2003
When In Doubt, Ajax It!!
demonhale posted this at 01:37 — 19th May 2006.
He has: 3,278 posts
Joined: May 2005
I was pertaining to this, http://www.couloir.org
It seems all inbound links and discussions about it is AJAX, and it can use different effect like swipe, fade etc... cant it be used?
Megan posted this at 01:58 — 19th May 2006.
She has: 11,421 posts
Joined: Jun 1999
Here's a page with more info about it:
http://www.maxkiesler.com/index.php/weblog/comments/ajax_slideshow/
Now, that link would have clarified things before all this got out of hand
Megan
Connect with us on Facebook!
The Webmistress posted this at 08:25 — 19th May 2006.
She has: 5,586 posts
Joined: Feb 2001
Thanks will take a look at it
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.