2 Replies Latest reply on Jun 19, 2008 12:26 PM by rclifto2

    Slider Bar & Collision Detection question

    rclifto2 Level 1
      I have been unable to find anything to help resolve my problem through my various searches and have turned to posting. First off - I am strictly a hobbyist and am attempting to create a Biography Timeline for a genealogy site I am building.
      I have a slider bar with a pocket watch graphic as the dragger. What I am hoping to achieve is that when the watch is slid along the timeline and stopped on a marker (Indicated as a year), I would like text to pop up relevant to that date in time.

      My slider is a movieclip and the year markers are buttons. Through my searching, it appears as though I need to utilize both collision detection and some type of load script attached to it. It is quite possible that I am overreaching my skill level, but I wanted to reach out in the event that there may be help for me.

      I really don't have any code to post as I am very uncertain as to what would be the appropriate code to start with. The example of what I am trying to accomplish can be seen here --> My slider bar

      I currently have the text attached to the "over" frame within the button as an example.

      Thank you in advance,
        • 1. Slider Bar & Collision Detection question
          Noelbaland Level 1
          Hello there,

          A quick fix for your situation that doesn't involve collison detecting is to instead, track the x position of your clock dragger movieclip. You can use collision detecting if you want, but by the way you've set up your movie, it'll involve a lot of targeting and property retrieving. This way requires you only add some lines to some code you already have.

          Follow these steps

          1) From the main stage, double click into your mc with the clock and line in it. Create a new layer and put 2 dynamic textboxes on it. Give the first textbox an instance name of "xpos" and the other one an instance name of "marker". Position xpos near the bottom right of the stage and marker on the opposite side. We will be using these boxes for testing.

          2) Click on the Actions Layer and find the line that says

          ratio = Math.round(this._x);

          type this under it

          xpos.text = ratio;

          Test your movie and you should see your x position update in the bottom corner as you drag the clock. Working? Good, thats what we want.

          3) Under the last line type in the following

          var space = 3;

          if(ratio > 36-space && ratio < 36+space){
          marker.text = "1900";
          } else
          if(ratio > 172-space && ratio < 172+space){
          marker.text = "1915";
          } else
          if(ratio > 399-space && ratio < 399+space){
          marker.text = "1945";

          OK - explanation - what's going on here is we're testing whether the clock is over one of the markers and sending the right text information to the other marker textbox we created earlier. If you test your movie and drag to the centre of the 1900 marker you'll see it's x position is about 36. The space variable adds or subtracts 3 from that position so that we have a good size "hit area". In other words if the x position is between 33 and 39 then we are over the 1900 marker. The same with the other two - between 169 and 175 is 1915 marker, between 396 and 402 is 1945 marker.

          You can now replace the marker.text="1900" line with whatever you want. You could make the marker textbox a movieclip and have it fade or slide in with the information you want.

          If this helps, then don't forget to delete the xpos textbox off the stage and delete the line of script that uses it. It was just for testing.

          Here's the full code

          • 2. Re: Slider Bar &amp; Collision Detection question
            rclifto2 Level 1
            Works perfectly!!!
            I sincerely appreciate you taking the time to offer me assistance - I'm grinning from ear to ear knowing that I'll be able to add this great feature to my genealogy site.
            I also appreciate you explaining the meaning of the code as I'll add this to my knowledge pool and hopefully build on it in the future.
            A very thankful,