18 Replies Latest reply on Apr 9, 2009 9:25 PM by kglad

    Flash menu help !

    peterg2000 Level 1

      Hi ,

       

      I'm creating a menu that uses images as if they were folders ! As the user slides the mouse over them they slide

      out as if you were pulling them out of a file cabinet to get a better look!  So as you move your mouse over they slide

      out then back in as your mouse moves to the next folder ! But the problem is that it works with the first pass, but then they stay stuck out !

       

       

                image1

                image2

                image3

       

      ( replace the word image with a real image object movie clip ! )

       

           image1

                image2                     this is on the first pass the images slides over nicely !

                image3

       

                image1

           image2                         as you move the mouse down the next one slides out !

                image3

       

       

                image1

                image2                    and the next  

           image3

       

           image1

           image2                          but on the second pass they all stay left and snap back right when I mouse over  !

           image3

       

       

      Here is the code ! Each image was worked on in a subscene and given up down and out labels on a label layer

      tweens were put on a tween layer and actions was put on an action layer with stop(); after each label!

       

      frame 1 of the main script !

      stop();

      citadelle.addEventListener(MouseEvent.MOUSE_OVER, onButtonup);
      citadelle.addEventListener(MouseEvent.MOUSE_OUT, onButtonOut);
      postecanada.addEventListener(MouseEvent.MOUSE_OVER, pconButtonup);
      postecanada.addEventListener(MouseEvent.MOUSE_OUT, pconButtonOut);
      capitole1.addEventListener(MouseEvent.MOUSE_OVER, capButtonup);
      capitole1.addEventListener(MouseEvent.MOUSE_OUT, capButtonOut);

       

      function onButtonup(e:MouseEvent):void
      {
          e.currentTarget.gotoAndPlay("up");
        
      }

       

      function onButtonOut(e:MouseEvent):void
      {
       
          e.currentTarget.gotoAndPlay("out");

          }

       

      function pconButtonup(e:MouseEvent):void
      {

          e.currentTarget.gotoAndPlay("up");

      }

       

      function pconButtonOut(e:MouseEvent):void
      {

          e.currentTarget.gotoAndPlay("out");
       
          }
         
          function capButtonup(e:MouseEvent):void
      {
       
          e.currentTarget.gotoAndPlay("up");

      }

       

      function capButtonOut(e:MouseEvent):void
      {
        
          e.currentTarget.gotoAndPlay("out");

          }

       

       

       

       

      What else would I need to do ?

       

      Thanks

       

      Pete

        • 1. Re: Flash menu help !
          kglad Adobe Community Professional & MVP

          there's nothing in the code you showed that would cause failure on repeat mouseover.  that code should only execute once, though.  (ie, frame 1 should only be entered once.)

           

          also, you only need two listener functions.  the last 4 can all be removed and you can just change each buttons listener function to be one of the first two listed.

           

          your specific problem doesn't make sense.  you said on 2nd pass they all stay left.  they're all to the right when you start your 2nd pass, correct?  so, how do they all get to the left?

          • 2. Re: Flash menu help !
            RossRitchey Level 4

            Like peterg said, your code has a lot more functions than necessary.  It should look like this:

             

             

             

            citadelle.addEventListener(MouseEvent.MOUSE_OVER, onButtonup);

            citadelle.addEventListener(MouseEvent.MOUSE_OUT, onButtonOut);
            postecanada.addEventListener(MouseEvent.MOUSE_OVER, onButtonup);
            postecanada.addEventListener(MouseEvent.MOUSE_OUT, onButtonOut);
            capitole1.addEventListener(MouseEvent.MOUSE_OVER, onButtonup);
            capitole1.addEventListener(MouseEvent.MOUSE_OUT, onButtonOut);

             

            function onButtonup(e:MouseEvent):void
            {
                e.currentTarget.gotoAndPlay("up");

            }

             

            function onButtonOut(e:MouseEvent):void
            {
                e.currentTarget.gotoAndPlay("out");

            }

             

            stop();

             

             

             

            Notice I also moved the stop to the bottom of the actions.  This often doesn't make a difference, but I have had problems with it in the past.

             

            It sounds like your problem is that, the second time you mouse over it, the MOUSE_OUT doesn't fire.

             

            Throw a trace in each function to check if they are firing.

             

            trace("firing up");

            and

            trace("firing out");

             

            If they are not firing, then the problem is finding out why they aren't firing.

            If they are firing, then the problem is, why isn't the movie clip going to the "out" frame.

            • 3. Re: Flash menu help !
              peterg2000 Level 1

              I tried your code and it is much more efficient , but it still gives the same results !

               

              On the second pass the images snap over to the left ! They don`t tween ! If I roll over them while they are left

              they snap back right!  I`m wondering if I`d need to put a mask area to properly define the roll out area !

               

               

              Pete

              • 4. Re: Flash menu help !
                peterg2000 Level 1

                The first time the code executes it works fine but if I roll over the images a second time that is

                when they snap right and stay there ! They don`t tween right, they snap and when I roll over them on the right they snap back left!

                 

                 

                 

                Pete

                • 5. Re: Flash menu help !
                  RossRitchey Level 4

                  Can you attach the SWF, or post a link to an example showing the problem.  I think kglad and I would have an easier time helping you if we could see it first hand.

                  • 6. Re: Flash menu help !
                    kglad Adobe Community Professional & MVP

                    the problems are on your movieclip buttons' timelines.  you must have stop() methods on some of those frames.  in addition, you may be mousing-out, when you want to still be over.

                     

                    you would have a nicer result and remove your problems, if you used actionscript to tween your movieclipbuttons rather than using timeline animation.

                    • 7. Re: Flash menu help !
                      kglad Adobe Community Professional & MVP

                      try:

                       

                       

                      import fl.transitions.Tween;
                      import fl.transitions.easing.*;
                      var tw:Tween;
                      var startX:Number = citadelle.x;
                      var endX:Number = startX-citadelle.width;
                      var duration:Number = 1;
                      citadelle.addEventListener(MouseEvent.MOUSE_OVER, onButtonup); citadelle.addEventListener(MouseEvent.MOUSE_OUT, onButtonOut); postecanada.addEventListener(MouseEvent.MOUSE_OVER, onButtonup); postecanada.addEventListener(MouseEvent.MOUSE_OUT, onButtonOut); capitole1.addEventListener(MouseEvent.MOUSE_OVER, onButtonup); capitole1.addEventListener(MouseEvent.MOUSE_OUT, onButtonOut); function onButtonup(e:MouseEvent):void {      tw = new Tween(e.currentTarget, "x", Elastic.easeOut, e.currentTarget._x, endX, duration, true); } function onButtonOut(e:MouseEvent):void {      tw = new Tween(e.currentTarget, "x", Elastic.easeOut, e.currentTarget._x, startX, duration, true); } stop();
                      • 8. Re: Flash menu help !
                        peterg2000 Level 1

                        I tried your script with worse results but didn`t have time to check if I added it right !

                        Its almost working after I added some stops to the up and removed them from the out !

                         

                        OK here is the swf with the first code  !

                         

                        I have to go out for a while , I`ll check back later !

                         

                        thanks guys

                         

                        Pete

                        • 9. Re: Flash menu help !
                          RossRitchey Level 4

                          Change kglads script to:

                           

                          import fl.transitions.Tween;
                          import fl.transitions.easing.*;
                          var tw:Tween;
                          var startX:Number = citadelle.x;
                          var endX:Number = startX-citadelle.width;
                          var duration:Number = 1;
                          citadelle.addEventListener(MouseEvent.MOUSE_OVER, onButtonup); citadelle.addEventListener(MouseEvent.MOUSE_OUT, onButtonOut); postecanada.addEventListener(MouseEvent.MOUSE_OVER, onButtonup); postecanada.addEventListener(MouseEvent.MOUSE_OUT, onButtonOut); capitole1.addEventListener(MouseEvent.MOUSE_OVER, onButtonup); capitole1.addEventListener(MouseEvent.MOUSE_OUT, onButtonOut); function onButtonup(e:MouseEvent):void {      tw = new Tween(e.currentTarget, "x", Elastic.easeOut, e.currentTarget.x, endX, duration, true); } function onButtonOut(e:MouseEvent):void {      tw = new Tween(e.currentTarget, "x", Elastic.easeOut, e.currentTarget.x, startX, duration, true); } stop();

                           

                           

                          He accidentally mixed AS2 and AS3 a little bit.  That should fix it right up for you.

                          1 person found this helpful
                          • 10. Re: Flash menu help !
                            kglad Adobe Community Professional & MVP

                            ooops.  thank you for the fix.

                            • 11. Re: Flash menu help !
                              peterg2000 Level 1

                              We`ll we`re almost there !

                               

                               

                              I probably need some sort of mask to make the animations behave more smoothly !

                               

                              I didn`t think it was that easy to do the tweening via AS directly !  As you can see I`m fairly new to flash !

                               

                              What do I keep in the sub.scene layers ! I seem to still need to put a stop(); in there as it didn`t work

                              if I left out the stops altogether and only relied on the stops in your code! 

                              I also assume I need the labels and the layer that shows where the animations go !

                              In your code the folders come out all the way , is how far they come out due to the width variable ?

                               

                              Here is the last version of the SWF !

                               

                              Pete

                              • 12. Re: Flash menu help !
                                kglad Adobe Community Professional & MVP

                                remove all your goto code and remove the timeline animation of movieclip buttons.

                                • 13. Re: Flash menu help !
                                  peterg2000 Level 1

                                  Its almost there , but I suspect I`d need to use a mask to define exactly what the up part is and

                                  since it slides off to the left my out is now moved as well ! So I`d probably need to define an area

                                  which covers the new slide to area as well as a bar where the visible part of the at rest folder is !

                                   

                                  In this last version I removed everything you said and changed this line so the folder stays in more !

                                  var endX:Number = (startX-citadelle.width)+30;

                                   

                                   

                                  Since you answered my first part , I could open another question if you want, to get the extra well deserved points !

                                   

                                  Pete

                                  • 14. Re: Flash menu help !
                                    peterg2000 Level 1

                                    Oooops here it its !

                                     

                                    I`m guessing I`d have to create the area invisible as a mask, then convert it to a movie clip and have the listener

                                    watch it but act on the visible image its a mask of !

                                     

                                    Pete

                                    • 15. Re: Flash menu help !
                                      kglad Adobe Community Professional & MVP

                                      there's no need for a mask.  just assign the parameter values (in particular, startX and endX) that suite your situation.

                                      • 16. Re: Flash menu help !
                                        peterg2000 Level 1

                                        The startX and EndX are just for positioning of the tween !   I was refering to where the area where the mouse over takes effect.

                                        I you noticed, when you do a mouse over the center of an image, it bounces back and forth because when the tween activates it moves

                                        the target out from under the mouse ! So the only way to make it work is to trail your mouse pointer over the far left of the image so that

                                        it will still be under the mouse when the tween activates !

                                           I`m try to figure out how to keep the `'mouse over`` active even if you drag the mouse over the far right of the folder image!

                                        I could tack on a bar at the right height to the image so that there is still an active part under the mouse even when the tween activates and drags the image left !

                                         

                                        Pete

                                        • 17. Re: Flash menu help !
                                          peterg2000 Level 1

                                          Ok my idea worked , I added a tranparent bar to the symbol and now it behaves nicely !

                                           

                                          Thanks so much , I`ve learned quite a bit today ! I was looking an online tutorial for the last week to find a solution !

                                           

                                          I`ve attached the latest version , I still need to polish it up , but its what I wanted !

                                           

                                           

                                          Pete

                                          • 18. Re: Flash menu help !
                                            kglad Adobe Community Professional & MVP

                                            you're welcome.