Rotating Image in CSS - Post ID 124645

User 47216 Photo


Registered User
210 posts

Couple of questions...

I am designing a website for a friend of mine I have a temp test page setup at www.reverendjillpidcock.com

On the left of the main content there is a photo which is set as a background as defined in the css file. Is there a way to do a rotating random picture in that section with every page load while still utilizing the css file or at the least placing a flash file in there?

Also, as you can see in the gray content area the right side top and bottom corners of the gray are have rounded corners. They are identified with jpg's in the css file also. I would also like them on the left side of the content box. I can reproduce them by mirroring them to two new graphics but I cannot figure out the coding to place in the css file in order to have them appear properly in there. Any help would be appreciated.

The css file for the style is located at www.reverendjillpidcock.com/style.css
User 364143 Photo


Guest
5,410 posts

There a lots of Javascripts on the net that rotate images. Just Google javascript image rotator.
CoffeeCup... Yeah, they are the best!
User 122279 Photo


Senior Advisor
14,649 posts
Online Now

Ronald, do you mean one picture that is supposed to be rotated, or several pictures to come up one at a time as a slide show?

If the former, then do as the Joker says, search for a script. In case of the latter, you can achieve the effect by using either the CoffeeCup Firestarter or Photo Gallery.

I'm trying some experiments with your css file in order to answer your second question and will post later, unless someone beats me to a solution for you, that is. ;)
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 47216 Photo


Registered User
210 posts

k thanks - yes I was looking for a different pic to load on each page load / refresh
User 122279 Photo


Senior Advisor
14,649 posts
Online Now

If you want the pictures to change for every reload or new page, then a script would be the right thing. By 'slideshow' I was more thinking of images alternating while a page is open. You can, however, link one and the same slideshow to several pages, if that is an option for you.

As to your rounded corners, I reckon you want it like in the attached picture?

I have modified your html and your css a bit, mainly created a small pic, bg.png, for the background in the content div. then I placed a pic in every corner. I also had to take out the top right one out of the div it was sitting in and move it to the content div, and at the same time I renamed it from what I guess was a typo (bogy_etc...) to body_etc...
To make everything fit nicely I also had to adjust some padding and margin here and there.

Files that I have modified/created in the attachment
Attachments:
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 47216 Photo


Registered User
210 posts

THANK YOU SO MUCH!
User 47216 Photo


Registered User
210 posts

Hey Inger - I ran into one small problem. After I got everythign the way I would like it I noticed that there is a black bar showing up at the bottom of the gray content area on the page. For some reason I am only seeing it in firefox bit in IE everything appears fine.

Any idea?
User 47216 Photo


Registered User
210 posts

I dont know what caused it. I went back to an original files of the index and the css and started over to format to my liking and it appears it is no longer appearing (at least in my version of FF and IE) please confirm with yours at this link
http://www.reverendjillpidcock.com/index2.php
User 364143 Photo


Guest
5,410 posts

Sorry man, I just both posts because I found I was wrong. Each time as you were typing. I know you're not talking to yourself. :)
CoffeeCup... Yeah, they are the best!
User 47216 Photo


Registered User
210 posts

Gotcha! So looking ok on your end now?

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.