A Flash Developer Resource Site

Results 1 to 2 of 2

Thread: Dragging a mkas someone help ??

  1. #1
    Really this is me..... mentaleruptions's Avatar
    Join Date
    Apr 2002
    Location
    WV, USA
    Posts
    1,114
    Ok im trying to work out how to create a dragable mask with no success. I have looked on here for a tutorial and even in the movies section and there is nothing off use to me here. i need to have two images which one u will see static and the other u will see when the mask moves over it on just one axis. Can someone point me to a tutorial that can show me how to do this or any help will be appreciated.

    Thanks in advance:
    Mental

  2. #2
    Didn't do it. japangreg's Avatar
    Join Date
    Mar 2001
    Location
    \o/ |o| |o_ /o\
    Posts
    784
    Hey, Mentaleruptions.

    This is the topic I first came to Flashkit to study. Thanks to the kind efforts of many Flashkitters, I eventually solved the problem. The answer is decptivly simple, yet difficult to come to without some guidance.

    When a movie clip is converted into a mask, it loses some of its "movie clip" properties, such as the ability to attach it to the mouse.

    There are two ways to do what you are asking; the first is easier, and probably more suited to your needs. Simply create a movie clip with the image you want to apear as the visitor mouses over the static image. Create your mask shape on a layer above the image and align it to the left side of the stage. Create another keyframe 200 (if your movie is 400 pixels wide; see below) frames down the movie clip's timeline and create a motion tween so that the mask moves across the image to the right. Place this movie clip on the main stage over your static image, aligned to the right. Give it an instance name of "mask".

    In the actions panel for the "mask" MC, add:
    Code:
    onClipEvent(enterFrame){
    this._x = _xmouse;
    frame = _xmouse/2;
    gotoAndStop(frame);
    }
    So no when you move your mouse, the movie clip with the masked layer will follow the mouse horizontally. And, as the _x increases, the current frame of the "mask" MC will increase at half the rate, so the image shown below the mask in the "mask" MC will match the movement of the mouse (i.e., if your mouse is at 400 _x, the "mask" MC will show frame 200, which will be the same area of the real image).

    Sorry if this is confusing; it's easier to do than to explain.

    The second option is more difficult, so I'll just outline the technique rather than give specific examples.

    Create a new movie clip; create two layers. On the top layer, create a shape you would like to use as a mask and center it to the stage. On the bottom layer, insert the image you want to drag the mask over. Center it to the stage as well.

    Here's the trick: you on't be dragging the mask over the image. You'll be dragging the image behind the mask in the opposite direction of the movement of the mouse. Think about it for a minute and it'll make sense.

    Click on the image you have on the bottom layer and make it into a movie clip; give it an instance name ("image"). Turn on the masking for the top layer.

    On the main stage, drag the movie clip containing "image" and the mask onto the stage. Center it. The stage and image should have the same dimensions for best results. Give the clip an instance name ("dragMask"). Attach "dragMask" to the mouse. Add code to the clip so that as the _xmouse and _ymouse increase, the _x and _y of _root.dragMask.image decrease proportionally.

    That's all there is to it. If you need an example, see www.geocities.com/room_910/sniper.html

    hth
    japangreg

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center