www.webdeveloper.com
Results 1 to 4 of 4

Thread: CSS & Templates? Image Rotation How to...

  1. #1
    Join Date
    Nov 2007
    Posts
    75

    CSS & Templates? Image Rotation How to...

    Really quick -- and probably simple question. If you save a css file as a template for your website, how can you ensure that say -- all five pages of your site have a different image. For instance, the template has a promotional area where an image is located. How would you go about ensuring that Pages 2, 3, 4, and 5 have different images if you are using CSS as your template?

    Thanks.

  2. #2
    Join Date
    Nov 2006
    Location
    Springfield, MO
    Posts
    1,541
    I'd just google for JavaScript or PHP image rotator script...thousands are available.

    Either that or if your image area is in a DIV, create extra DIV's with different images and then apply that to each page, i.e.,

    Code:
    <div id="rotate">
    
    </div>
    Page 2

    Code:
    <div id="rotate_about">
    
    </div>
    CSS:

    Code:
    #rotate_about{
    background-image:url(myimage.jpg);
    }
    Hope it helps,

  3. #3
    Join Date
    Jun 2003
    Location
    here
    Posts
    4,551
    css doesn't make good for templates(only styling the templates you already have in HTML), but you could give your pages all unique IDs to the body:
    HTML Code:
    <body id="homepage">
    then use the CSS to style an object different based on page:
    Code:
    body#homepage div#uniqueBG{
      background-image: url(IMG);
    }
    but that requires the use of background images and special styling, as well as editing the HTML for all the pages as well. rather a lot of work.

  4. #4
    Join Date
    Nov 2007
    Posts
    75
    All very good suggestions. Thanks so much - I will try and let you know.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles