Fireworks animation and button states don't work in Dreamweaver

My FW animation and FW button states don't work in DW.  I have already done the Export, HTML, insert FW object route.  However, when I preview them in the browser, they are images only.  I ran an accessibility report and there were a number of lines that stated "Failed."  Inclusive answers and hints are very much appreciated as I am learning as I go-- and working with a deadline.  Thank-you so much for your expertise.
Who is Participating?
webwomanConnect With a Mentor Commented:
Not really --- it's not enough, and you don't include the javascript.

If you're trying to create a menu bar --
Make ALL the buttons in ONE file, set up EXACTLY how you want it to look. First frame is mouseout/initial setting of the graphic. Frame 2 is mouseOVER. Forget the other frames. They're basically useless anyway -- if you want something to be shown as active, they must be actually CLICKING it, and the other state would be when they were on ANOTHER PAGE, so you can set that yourself later.

Set up slices, set up a simple rollover behavior for each, with the link if you must (you can always add that later, in the actual code, where you have much more control). Then run the export wizard, generate HTML/images, put the images in a subfolder (it makes life easier), and CAREFULLY look at the code that's generated. Everything you need is there.

And change your names -- your graphics file names should have NO space, NO punctuation, NO special characters. Makes life a lot easier.

Another thing that will make your life a LOT easier (like by a factor of 1 gazillion) -- learn HTML, and the basics of javascript. Then when you create wizard done things in Fireworks or DW, you'll have a chance of fixing them when they don't do exactly what you want.
alexhoganConnect With a Mentor Commented:
Have you previewing your animated gifs outside of DW?
Do they animate?
CaddygirlAuthor Commented:
Yes.  I previewed it in FW and everything works great.
Cloud Class® Course: CompTIA Healthcare IT Tech

This course will help prep you to earn the CompTIA Healthcare IT Technician certification showing that you have the knowledge and skills needed to succeed in installing, managing, and troubleshooting IT systems in medical and clinical settings.

CaddygirlAuthor Commented:
I just figured out the animation.  Your answer tipped me off a little bit.  I had optimized it as a jpeg because it is a fade in on top of a photo, and I read that jpeg was best for photos.  I hadn't realized that an animation can only be gif.  So I tried optimizing it that way, and it works great now.  

However, still no luck with the buttons.  Does it have anything to do with Javascript?  I am not sure what to try if it does, but would love suggestions.
Yes, the button behavior is controlled by javascript.

You said that the button states don't work.  
Are they not swapping the graphics?  
Do you have FW creating tables?

Can you post the code?
CaddygirlAuthor Commented:
I created 5 buttons separately in FW with 4 states each and imported them all into one document, alligning them horizontally.  When I insert it into DW and check the preview, I can see the graphics, but when I move my pointer over them, the whole nav bar disappears.  

What kind of FW table do you mean?  

Which code?
Did you slice them up? Create the appropriate number of frames?

You CANNOT do an animation AND a rollover in the same Fireworks file. You must have SEPARATE files, with SEPARATE actions.

It is MUCH better to learn what is being generated, and how, and combine the javascripts AND the tables/graphics yourself.
CaddygirlAuthor Commented:
The animation is a separate file from the buttons and is working fine now.

As for the buttons--  Each button exists within its own FW file, and is also copied into one file which combines all of them.  Does that make sense?  In the one file, they all retain their respective behaviors (states), etc., they are just alligned next to one another.  So they rollover just fine next to one another until inserted in DW.

It was my understanding that FW is an easy way to create custom buttons, which are very necessary for the artistic end of my design...and that FW generates the Javascript for you.  So when it is inserted into DW, it already has the necessary attributes to make it work in DW.  Did I misunderstand that?
alexhoganConnect With a Mentor Commented:
No.., you got it correct.

FW is an easy and streamlined way to make custom buttons.  It does have a tendancy to produce too much code sometimes.  This might be what has happened here.

You don't need to make then seperate files though.  You can design them and house them in the same FW file and they'll work just fine.  You can seperate the different buttons by using directories on the layer panel.  If you put them in a buttons directory you can make the individual buttons subdirectories.


When using FW to make buttons to import into DW gets cranky sometimes.  Try this;

Create a FW file with 2 buttons on it.
Import that into DW and see if it works as expected.  If so, then it was the process of creating the buttons in seperate files and then placing them into the second FW file that hosed things.
CaddygirlAuthor Commented:
Great.  Thank-you, I will try that and let you know how it works.  Thanks for your patience and advice.
CaddygirlAuthor Commented:
I tried that approach, only I just included one button to see what would happen.  When I inserted it and previewed it, I got the same problem.

Maybe this will help:  the accessibility report says, "Non spacer IMG with valid ALT--- ALT of image is empty string."
CaddygirlAuthor Commented:

You asked for the code.  Here it is.  Does this help?

<blockquote> <a href="javascript:;" target="_top" onClick="MM_nbGroup('down','navbar1','About20Us20Button','About%20Us%20Button_f3.gif',1);" onMouseOver="MM_nbGroup('over','About20Us20Button','About%20Us%20Button_f2.gif','About%20Us%20Button_f4.gif',1);" onMouseOut="MM_nbGroup('out');"> <img name="About20Us20Button" src="Buttons/About%20Us%20Button.gif" width="100" height="25" border="0" alt=""> </a></blockquote>
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.