5 Replies Latest reply on Apr 1, 2011 9:32 AM by Ned Murphy

    Interactive floor plan

    SuperBowl673

      Hi,

       

      I am trying to create a simple floor plan that highlights where the computers are on the floor.

      1. Each computer has a name for e.g. Comp1, Comp2, Comp3 etc.

      2. The computer names are in a list on the left hand side.

      3. On the right hand side is the simple floor plan with computer images (or clipart)

       

      This is what is expected:

      1. As the mouse is mover over the item on the list, the computer associated with it must light up (or highlighted)

          For e.g. when the mouse is over Comp1 in the list then computer1 image (or clipart) on the floor plan must light up

      2. When the mouse is over a computer on the floor plan, then the associated computer name in the list must light up

          For e.g. when the mouse is over computer2 image (or clipart), then Comp2 in the list must light up.

       

      I was trying to get some ideas from http://tv.adobe.com/. I was able to make the image for a computer. It doesn't go far enough to tell me how to accomplish the above.

       

      Using Excel, I did this nearly five years back, by putting the clipart in specific cells and hyperlinking them. Now we want to make it available on the web.

       

      Please help.

       

      Thanks in advance.

      Regards,

      SuperBowl673

        • 1. Re: Interactive floor plan
          Ned Murphy Adobe Community Professional & MVP

          One approach would be to make each list item and each computer a movieclip that has different frames for different interactions, namely a normal frame and a rollover frame.  Then you need to add the mouse over and mouse out code to command the list item and its accompanying computer to go to the mouse over frame and back per the interactions.

           

          If you name each list item similar to its computer's name then you can possibly share the same rollover/rollout functions for all the interactive pieces.

           

          The code you use will depend on which version of actionscript you are going to use.

          1 person found this helpful
          • 2. Re: Interactive floor plan
            SuperBowl673 Level 1

            Thank you, for the guidance.

            I am new to flash and never tried ActionScript. I have Flash CS4 professional. So, I guess I will be using ActionScript 3.0.

            Now, I have two more questions:

            1. Is this the simplest approach?

            2. Where on the web can I find some detailed guidance/writeups regarding this approach?

                 or which book will you recommend to target this specific issue?

             

            Thank you once again.

            • 3. Re: Interactive floor plan
              Ned Murphy Adobe Community Professional & MVP

              You are not likely to find anything that addresses your specific design due to it being both too specific and only requiring basic code elements for a solution - online tutorials typically address more complex matters.  I've prepared an example for you which is available from the following link...

               

              http://www.nedwebs.com/Flash/AS3_Highlight_Pairs.fla

              • 4. Re: Interactive floor plan
                SuperBowl673 Level 1

                Hi Ned,

                 

                Thank you very much. That was exactly what I was looking for.

                 

                Thank you for putting in the time to make the file. It saves me time reading all books on flash.

                 

                Thanks once again.

                • 5. Re: Interactive floor plan
                  Ned Murphy Adobe Community Professional & MVP

                  You're welcome... be sure to study it to learn what it doeshow it works... as I said it's basic stuff, so you'll do yourself a favor to understand it thoroughly.