Need help with graphics around a Flash image rotator

I have an image rotator that is good but I want to add some spice to it by adding some simple graphics around the rotator. I don’t know if this belongs in the Graphics section or CSS. What I did was take the dimensions of the rotator and added a divider font that will go around it. However, I cannot get the graphic positioned properly to work. I have tweaked the HTML and the CSS and cannot figure this out. Here is the link to the test page. Thanks for helping me with this.

It will be much easier if you just open up your fla file and add the devider font inside the flash file.

You need to center the rotator inside the div that the background is applied to AND bump down the rotator a little.

Dimensions (for reference):
JS rotator: 629x210
div containing bg image: 691x278
vertical difference: 78px (39px each side)
horizontal difference: 68px (34px each side)

Currently, for your rotator to be centered you’d have 39px around it on top and bottom, 34px on the left and right. I would recommend having the same amount of space all the way around, easier to keep track of measurements. However your current background image is partly obscured when the rotator is centered. An extra 5px on each side would look a little nicer with the pattern kept on the edges.

  1. Increase the dimensions of the background image. To make it easy, give it the same amount of extra space on each side. 44px added to each side compared to the size of the rotator. (New image dimensions will be 701x288.)

  2. Give jsn-imageshow the same dimensions as the rotator, and add padding equal to the extra space.

<div id="rotator_container">
<div id="jsn-imageshow" style="width:629px; height:210px; padding:44px; background-image: url(images/rotator_bg.png);">
<embed id="imageshow" width="629" height="210" ... src="loader.swf" type="application/x-shockwave-flash"/>
<script type="text/javascript">

The rotator area also seems to be running into your main content area a bit, so keep an eye on that too. I’m not going to dig into that code since just talking about the rotator here.

Thank you so much for answering me. I will give this a try and see what happens.

Ooops, I typed in the wrong dimensions for the new image size. How embarrassing :blush: If you are going with the 44px on each side, your background image will be 717x298. Sorry if that was confusing.

I actually ended up using a different Flash rotator and built the background into the Flash show and it works perfectly but I do thank you for your help. I was trying to decide on what I wanted to purchase and decided to go with Slideshow Pro for Flash. It’s not very expensive and I can use it for all sorts of different sites.

Glad you found something that works. It looks good!