View Full Version : rollover problem :-(

06-20-2006, 11:11 PM
Hi guys. I wonder if any one could help. I have a sidebar full of buttons each with two rollover effects applied.

The 1st effect is a simple rollover, ie it changes the actual button image to another rollover button image using the image objects, rollover function.

The other effect is a disjointed rollover - it changes an image at the top of the page when you rollover the button. This is applied through the behaviors panel, swap image function.

The problem is dreamweaver wont let me have both effects. When I apply the disjointed rollover effect the simple rollover is disabled. Is there any way to have both?

Really appreciate any help, cheers

06-21-2006, 12:00 AM
auto insert behaviors in dreamweaver are pretty llamo.

you can do anytype of roll overs just just plain css. dis-jointed ones u can do with javascripting.

check out htis nav where i work - its done with css for the image swaps and the secondary nav is done with js

06-22-2006, 03:02 PM
I took your advice and am now using css for the image swap but theres a problem, it looks absolutely fine on firefox but doesnt appear at all in iinternet explorer. Here is the code below:

<title>CSS Rollovers</title>
<style type="text/css">

#swap { height: 38px; }

#swap img { padding: 0; margin: 0; }
#swap a { float: left; }

.rollover { display: block; }
.rollover img { width: 100%; height: 100%; border: 0; }
.rollover:hover { visibility: visible; }
.rollover:hover img { visibility: hidden; }
#swap01, #swap02, #swap03, #swap04, { width: automatic; height: automatic; }

#swap01 { background-image: url(home2.gif); }
#swap02 { background-image: url(news2.gif); }
#swap03 { background-image: url(con2.gif); }
#swap04 { background-image: url(links2.gif); }


<div id="swap">
home1.gif (#)
news1.gif (#)
con1.gif (#)
links1.gif (#)


Im sure it's just one small element in the css thats causing all the trouble. Does anyone know what it is?