13 Replies Latest reply on Apr 29, 2009 9:49 PM by Erik Arckens

    How to add URL's to a scrolling picture banner

    Erik Arckens Level 1

      Hi,

      I have a scrolling picture banner where a series of about 10 pictures are placed horizontally; this banner scrolls slowly horizontally across the screen. An example can be seen here (I replaced the cloud layer in this example with a layer that contains all pictures bordering one another): http://www.kirupa.com/developer/flash5/imagescroll.htm

       

      Now I want each picture to contain a hyperlink on the picture area or on part of the picture area; this hyperlink should for every picture point to a differetn page on my site. At all times must the links remain accessible for clicking on the visible pictures while the banner is scrolling.

       

      I was advised to use a function attached to each picture: onClipEvent(mousedown) getURL("http://www.mysite.com","_self") ; another advise was to use imagex.onRelease=function(){getURL("http://www.site1.com");}

      imagey.onRelease=function(){getURL("http://www.site2.com");}

      etc...

      but I am not familiar with this and would like to get either some more help on how to attach such a function to each picture.

       

      Or else I thought of using a transparent button placed on each picture containing a hyperlink. But that is just my inexperienced idea, and I feel the first two suggestions are far more appropriate.

       

      Thanks for your help,

      Erik

        • 1. Re: How to add URL's to a scrolling picture banner
          kglad Adobe Community Professional & MVP

          that mousedown advice is terrible.  who gave that?

           

          the 2nd bit of advice is good.  attach that code to a frame that contains the imagex, imagey etc movieclips.

           

          it should work fine as long as there are no mouse handlers for any parent movieclips of the image movieclips.

          • 2. Re: How to add URL's to a scrolling picture banner
            Erik Arckens Level 1

            Oh thanks for your prompt reply. Now just this one: I read my first Flash handbook: "Flash for dummies" , and I learned how to get a scrolling banner with pictures; but there is no advice on how to attach this (or any) function.

             

            I have this one layer with all the pictures, so I would need to attach a function to each picture in that layer. But I am totally ignorant on how to do this. Can you please give some more detail on how to attach this to the pictures?

             

            Thank you so much,

            erik

             

            ps: there are no mouse handlers or anything; i would not even know how to attache those..

            • 3. Re: How to add URL's to a scrolling picture banner
              kglad Adobe Community Professional & MVP

              you won't attach anything to your pictures.  again, you attach the onRelease code to a frame.  for each movieclip that you want to respond to the mouse, you'll have one line of code just as you showed above.

               

              in fact, add one line of code for one picture moviecilps.   each picture is a movieclip, correct?  each movieclip has an instance name (imagex, imagey etc), correct?

              • 4. Re: How to add URL's to a scrolling picture banner
                Erik Arckens Level 1

                No kglad, each picture is not a movieclip. I took the cloud banner from this example http://www.kirupa.com/developer/flash5/imagescroll.htm, removed the cloud, and placed all the pictures, one next to the other in one frame. So I have a frame 200px high and about 2200px wide. That scrolls across the screen. So, instead of a long cloud moving across, I have this series of pictures gently scrolling.

                 

                But maybe this is not the right approach, I dont know; maybe Flash for Dummies really is what it says.. .

                I have two objectives: a scrolling horizontal picture banner, and each picture with its own link (URL).

                • 5. Re: How to add URL's to a scrolling picture banner
                  kglad Adobe Community Professional & MVP

                  right click each picture, click convert to movieclip and assign an instance name in the properties panel.  use that name to assign the onRelease code you showed in your first message.

                  • 6. Re: How to add URL's to a scrolling picture banner
                    Erik Arckens Level 1

                    ok, this is what I have now:

                    1. Making a movieclip of each picture works; naming each picture its own instance also works.

                    2. when I try to get the .onRelease function and navigateToURL function (which appears in yellow in the as3 listing, why?) I get this script written down fine. BUT: when checking the script syntax, I get an error saying "Statement must appear within on/onClipEvent handler".

                    3. when trying the as2 example using getURL: same error

                    4. when trying the onClipEvent(mouseDown){getURL("http://www.mysite.com");} example I get no error.

                     

                    I prefer your method, kglad, but I would like to know where I make the error that I describe.

                    I appreciate your help, thanks;

                    Erik

                     

                    ps: last night I did not answer anymore because it was 23.00 local time (bedtime )

                    • 7. Re: How to add URL's to a scrolling picture banner
                      kglad Adobe Community Professional & MVP

                      that error message is because you're attaching the code to the movieclip, not a frame.  to remedy, click on your movieclip, cut the code to remove it, click on an empty part of the stage, now right click in the actions panel and click paste.  retest.

                      • 8. Re: How to add URL's to a scrolling picture banner
                        Erik Arckens Level 1

                        Perfect!!!

                         

                        Just to recap, to make sure I understand the principles:

                        1. each picture needs to be given a movieclip definition (why??) and an instance name (to enable it to be associated with an action script)

                        2. the actionscript needs to be associated with the frame in which the picture resides (the layer in the movie in my case; which contains all the individually named pictures): therefor I need to write an actionscript not related to the picture but to the frame (your last comment). I use the individual instance names (related to each individually named picture) to relate the action to the specific picture(s).

                        3. The difference with the onclipEvent(mouseDown) is that this script is attached to the frame and relates by name to each picture; while this last command is attached to each picture.. advantage??

                         

                        Where can I find good tutorials on actionscript writing?

                         

                        Thank you so much, kglad!!!

                        Erik

                        • 9. Re: How to add URL's to a scrolling picture banner
                          kglad Adobe Community Professional & MVP

                          1.  you can't reference an image with actionscript.  converting it to a movieclip allows you to assign an instance name and allows you to us movieclip methods and properties (actionscript)

                           

                          2.  layers are irrelevant except to organize your work and assign relative object depths.  as part of good coding practice, all your code should go on its own layer.

                           

                          3.  onMouseDown executes whenever the mouse is down, whether the mouse is over the object dispatching that event or not.  so, that was just bad advice.  the difference between onClipEvent(release) and onRelease is the former needs to be attached to a movieclip and the 2nd attached to a frame.  the 2nd is much preferred because it's easier to debug and edit your code when it's easy to find.  when you have to click on movieclips to find code, you have a mess that's difficult to create, even more difficult to debug and nearly impossible to edit a year or two after you finish the project.  the onClipEvent() coding style is left over from the earliest versions of flash and should never be used when publishing for any flash player version that can do better.

                          1 person found this helpful
                          • 10. Re: How to add URL's to a scrolling picture banner
                            Erik Arckens Level 1

                            I have a problem with the banner:

                             

                            Symptoms:

                            after selecting the full set of pictures (to which I did assign instances and individual actionscripts), and convert them to act as a scrolling banner, only one picture allows URL activation. I set the starting and ending keyframes and insert a classic tween between them; all the pictures scroll nicely along from start to end and then all over again automatically. But only the fourth picture has possibility to click thru to the assigned URL. The rest does nothing when clicked upon or when moused over.

                             

                            Detailed description:

                            When I click on this frame in the stage, it returns "property" as "graphic", and "Instance of: Tween 2".

                            When I click anywhere on the timeline, it says in "Properties": "frame", and the actionpanel shows me the script for the 4th picture (image4.onrelease=function..... etc..).

                             

                            When I click on the frame again in the stage, anywhere between 0 and 500, it returns "property" as "Document" and  "Banner with symbols all scripted with tween".

                            When I click on the frame again in the stage (named "scene 1"), it opens up as "Tween 2" and then again every picture shows up with its individual instance and its respective actionscript (with proper URL assignment).

                             

                            The timeframe starts at 1 (and shows a little "a" in the first keyframe), and ends at 500 with just a dot in the keyframe there. The banner scrolls nicely along and repeats itself, but no action possible except on 1 picture.

                             

                            When  I added the tween, I selected "classic tween".

                             

                            My goal:

                            Now I need every picture in the banner to keep its actionscript when the banner is scrolling, not just one. What did I do wrong?

                             

                            Any help will be greatly appreciated!

                            Erik

                            • 11. Re: How to add URL's to a scrolling picture banner
                              kglad Adobe Community Professional & MVP

                              what's in the properties panel when you click on the image movieclip?

                              • 12. Re: How to add URL's to a scrolling picture banner
                                Erik Arckens Level 1

                                When I click on the time frame it says "Graphic", "instance of: Tween 2"; when I doubleclick on the frame in the stage it says "Document", "banner with symbols all scripted with tween".

                                • 13. Re: How to add URL's to a scrolling picture banner
                                  kglad Adobe Community Professional & MVP

                                  if you had converted those images to movieclips correctly, you would see movieclip in the properties panel and you should have assigned an instance name that's visible in the properties panel.