PDA

View Full Version : Website Fading Slideshow div background?!



whackeddragon
30 Apr 2011, 06:53 AM
Hello and firstly thank you for taking the time to look at my [First] post in your wonderful knowledge rich forum.

I am making a website which needs a fading background image slideshow in a centered DIV on the homepage... I have downloaded a Javascript fading slideshow and put it into the centered div. I then needed to put my text on top of the slideshow background so made a content div and tried to position it on top of the other using various methods including Z-index.. but the slideshow would not go behind the text it always shows above..

I have an example website the uses the desired effect;
http://www.louisebradley.co.uk/portfolio/

Could anyone help me out with trying to find out how to re-create this effect:confused:

MartinRinehart
01 May 2011, 12:07 PM
Bradley's got a lot of stuff going on. (Impressive site!) Which are you trying to do?

Is the slideshow in some JS that you neither wrote nor understand? Writing a slideshow is a good beginner's JS project.

Try this in HTML (no JS). Put up a page with a lovely image. Create a second div, over the image. Put some text into div 2. If the image comes first in the HTML, it will be painted first. (That implies that the second image is painted over it.) If you DO NOT use any background in the second div, the text will be pained over the image.

My site begins with a div that says Welcome! in the center. The Welcome! fades away (5 second cheshire cat act). You might want to steal some of my fade code - it solves ugly cross-browser issues. www.MartinRinehart.com.