9 Replies Latest reply on Jul 22, 2009 12:38 PM by Jim_Babbage

    Why is a simple swap image so difficult to do!!!!

    CShockr Level 1
      All I want to do is create a simple rollover or swap image where the start or Up image is an actual picture and the swap or over image is a box with text links to pages in the site contained inside...This was totally simple in ImageReady, but seems impossible with Fireworks!!!!

        • 1. Re: Why is a simple swap image so difficult to do!!!!
          Level 7
          I've never tried doing this with Fireworks, but it is very simple with
          Dreamweaver.

          Peter
          _______________________
          "MGD/PHO/JOU" <webforumsuser@macromedia.com> wrote in message
          news:f71oh4$9b0$1@forums.macromedia.com...
          | All I want to do is create a simple rollover or swap image where the start
          or
          | Up image is an actual picture and the swap or over image is a box with
          text
          | links to pages in the site contained inside...This was totally simple in
          | ImageReady, but seems impossible with Fireworks!!!!
          |
          |
          |


          • 2. Re: Why is a simple swap image so difficult to do!!!!
            CShockr Level 1
            Ok...so how do you do it.

            It works fine if the text box is the initial up state, but if you want to use an image as an upstate there seems to be no way (neither show/hide or rollover etc.) to call the box with links...

            The links are what are important here...I've tried importing from Fireworks, cut and paste with Fireworks HTML, using a Dreamweaver image placeholder and exporting the Fireworks image and html code...)
            • 3. Re: Why is a simple swap image so difficult to do!!!!
              Level 7
              MGD/PHO/JOU wrote:
              > Ok...so how do you do it.
              >
              > It works fine if the text box is the initial up state, but if you want to use
              > an image as an upstate there seems to be no way (neither show/hide or rollover
              > etc.) to call the box with links...
              >
              > The links are what are important here...I've tried importing from Fireworks,
              > cut and paste with Fireworks HTML, using a Dreamweaver image placeholder and
              > exporting the Fireworks image and html code...)
              >

              Have you looked at the FW help Files? This excerpt and much more is
              available by typing "rollovers" into the search box of the help window:

              ----------------------------------------------------------
              Creating a simple rollover

              A simple rollover swaps in the frame directly under the top frame and
              involves only one slice.

              To attach a simple rollover to a slice:
              1. Ensure that the trigger object is not on a shared layer. For more
              information, see Sharing layers.

              2. Select Edit > Insert > Slice to create a slice on top of the trigger
              object.

              3. Create a new frame in the Frames panel by clicking the New/Duplicate
              Frame button.

              4. Create, paste, or import an image to use as the swap image on the new
              frame.

              Position the image beneath the slice you created in step 2, which is
              still visible even though you're in Frame 2. Slices are visible across
              all frames.

              5. Select Frame 1 in the Frames panel to return to the frame that has
              the original image.

              6. Select the slice and place the pointer over the behavior handle. The
              pointer changes to a hand.

              7. Click the behavior handle and select Simple Rollover from the menu.

              8. Click the Preview tab and test the simple rollover, or press F12 to
              preview it in a browser.

              --------------------------------------------------------------

              You can also use the button editor to create up to 4-state rollovers.

              As for Dreamweaver, there are several ways. A simple one is to go to
              Insert > Image Objects > Rollover Image. The images must be available in
              order to do this.

              HTH

              --
              Jim Babbage - .:Community MX:. & .:Adobe Community Expert:.
              Extending Knowledge, Daily
              http://www.communityMX.com/
              CommunityMX - Free Resources:
              http://www.communitymx.com/free.cfm
              ---
              .:Adobe Community Expert for Fireworks:.
              news://forums.macromedia.com/macromedia.fireworks
              news://forums.macromedia.com/macromedia.dreamweaver
              • 4. Re: Why is a simple swap image so difficult to do!!!!
                Level 7
                MGD/PHO/JOU wrote:
                > Ok...so how do you do it.
                >
                > It works fine if the text box is the initial up state, but if you want to use
                > an image as an upstate there seems to be no way (neither show/hide or rollover
                > etc.) to call the box with links...
                >
                > The links are what are important here...I've tried importing from Fireworks,
                > cut and paste with Fireworks HTML, using a Dreamweaver image placeholder and
                > exporting the Fireworks image and html code...)
                >

                It's also helpful if yo can post a link to the file so we can see things
                in detail. Removes the guess work. :-)

                --
                Jim Babbage - .:Community MX:. & .:Adobe Community Expert:.
                Extending Knowledge, Daily
                http://www.communityMX.com/
                CommunityMX - Free Resources:
                http://www.communitymx.com/free.cfm
                ---
                .:Adobe Community Expert for Fireworks:.
                news://forums.macromedia.com/macromedia.fireworks
                news://forums.macromedia.com/macromedia.dreamweaver
                • 5. Re: Why is a simple swap image so difficult to do!!!!
                  Level 7
                  Nowadays, I would use some kind of CSS to do this, but in the past I used
                  the Dreamweaver method Jim describes.

                  Peter
                  ___________________
                  "Jim Babbage .:CMX:. & .:Adobe Community Expert:."
                  <jbabbage@newmediaservices.ca> wrote in message
                  news:f73tnm$1uq$1@forums.macromedia.com...
                  | MGD/PHO/JOU wrote:
                  | > Ok...so how do you do it.
                  | >
                  | > It works fine if the text box is the initial up state, but if you want
                  to use
                  | > an image as an upstate there seems to be no way (neither show/hide or
                  rollover
                  | > etc.) to call the box with links...
                  | >
                  | > The links are what are important here...I've tried importing from
                  Fireworks,
                  | > cut and paste with Fireworks HTML, using a Dreamweaver image placeholder
                  and
                  | > exporting the Fireworks image and html code...)
                  | >
                  |
                  | Have you looked at the FW help Files? This excerpt and much more is
                  | available by typing "rollovers" into the search box of the help window:
                  |
                  | ----------------------------------------------------------
                  | Creating a simple rollover
                  |
                  | A simple rollover swaps in the frame directly under the top frame and
                  | involves only one slice.
                  |
                  | To attach a simple rollover to a slice:
                  | 1. Ensure that the trigger object is not on a shared layer. For more
                  | information, see Sharing layers.
                  |
                  | 2. Select Edit > Insert > Slice to create a slice on top of the trigger
                  | object.
                  |
                  | 3. Create a new frame in the Frames panel by clicking the New/Duplicate
                  | Frame button.
                  |
                  | 4. Create, paste, or import an image to use as the swap image on the new
                  | frame.
                  |
                  | Position the image beneath the slice you created in step 2, which is
                  | still visible even though you're in Frame 2. Slices are visible across
                  | all frames.
                  |
                  | 5. Select Frame 1 in the Frames panel to return to the frame that has
                  | the original image.
                  |
                  | 6. Select the slice and place the pointer over the behavior handle. The
                  | pointer changes to a hand.
                  |
                  | 7. Click the behavior handle and select Simple Rollover from the menu.
                  |
                  | 8. Click the Preview tab and test the simple rollover, or press F12 to
                  | preview it in a browser.
                  |
                  | --------------------------------------------------------------
                  |
                  | You can also use the button editor to create up to 4-state rollovers.
                  |
                  | As for Dreamweaver, there are several ways. A simple one is to go to
                  | Insert > Image Objects > Rollover Image. The images must be available in
                  | order to do this.
                  |
                  | HTH
                  |
                  | --
                  | Jim Babbage - .:Community MX:. & .:Adobe Community Expert:.
                  | Extending Knowledge, Daily
                  | http://www.communityMX.com/
                  | CommunityMX - Free Resources:
                  | http://www.communitymx.com/free.cfm
                  | ---
                  | .:Adobe Community Expert for Fireworks:.
                  | news://forums.macromedia.com/macromedia.fireworks
                  | news://forums.macromedia.com/macromedia.dreamweaver


                  • 6. Re: Why is a simple swap image so difficult to do!!!!
                    drubinoff

                    I'm doing exactly this (I think), and yet nothing happens when I preview in a browser....the cursor changes to a hand over the affected images, but no roll over action happens.  I've tried adding the rollover image on another frame, and I've tried pointing it to a jpeg file.

                    • 7. Re: Why is a simple swap image so difficult to do!!!!
                      Jim_Babbage Level 4

                      They're not hard to do. Draw a slice over the object, put another 

                      object in a second state in the exact same pixel location, and choose 

                      Add Simple Rollover from the Behaviors handle in the slice.

                       

                      You might be using a hotspot by accident, and that won't generate the 

                      rollover on its own.

                       

                      HTH

                       

                      Jim Babbage

                      • 8. Re: Why is a simple swap image so difficult to do!!!!
                        drubinoff Level 1

                        You were correct:  I was using a hotspot instead of a slice.  Now that I have a slice, it is working.  I think I need to better understand when to use a hotspot versus a slice.

                         

                        Hugs!

                        • 9. Re: Why is a simple swap image so difficult to do!!!!
                          Jim_Babbage Level 4

                          Hotspots can be used for image maps, to add additonal interactivity on 

                          an existing slice or to trigger a remote rollover, but in order for 

                          the rollover to work, the area to be swapped must have a slice placed 

                          over it.

                           

                          HTH

                           

                          Jim Babbage