A Flash Developer Resource Site

Results 1 to 7 of 7

Thread: how do I make this?

  1. #1
    Registered User
    Join Date
    Nov 2001
    Location
    Mostly In The Clouds
    Posts
    214
    Hi, how can I make this effect http://www.b3design.ch/blocks.html (You'll find the invisible rollover buttons top left) I want to make that effect on a larger scale.... there I only used 16 blocks, I would like to use between 50 and 100 in the next one. Problem is that that little animation has 32 different mc's running and it took me over an hour to do it. Anyone have an idea of how I could achieve the same effect (ie: where ever the mouse is the blocks are more opaque and the further the mouse is from the blocks, the less alpha they have) but with the use of some AS or something??

    thanks

  2. #2
    Senior Member
    Join Date
    May 2002
    Posts
    248
    After taking a look at the link you posted, I made a similar version. You can decide how many rows and columns of squares you want, and their position and spacing on the stage. Right-click the link on my home page to download the .fla.

    Keep in mind that the more columns and rows you create, the slower the movie will run, because each square is calculating the distance from itself to the mouse pointer (using ant enterFrame clip event). All of the variables are in the 1st (and only) frame of the movie.

    The URL is http://www.danmedel.com

    Lemme know how you like it!
    -Dan

  3. #3
    Registered User
    Join Date
    Nov 2001
    Location
    Mostly In The Clouds
    Posts
    214

    WOW!

    After my petty little at an attempt you quickly make a blinder version of mine!! WOW, I really like it!

  4. #4
    Registered User
    Join Date
    Nov 2001
    Location
    Mostly In The Clouds
    Posts
    214
    Would you mind If I used your script on a site of mine?
    If so, I have a couple of questions, how do I make the "masked" are bigger and how could I make it sothat it shows less blocks on rollover, as far as I can tell it's showing about 9 or 10 across, I would like it to show about 5...


    Thanks again

  5. #5
    Senior Member
    Join Date
    May 2002
    Posts
    248
    Sure, you can use that script if you like.

    There's nothing actually masked in this movie. Basically, each clip's enterFrame event is calculating its distance from the mouse pointer and setting it's _alpha to the inverse of that number. So if the mouse is 0 pixels away, the alpha is at 100. If the mouse is 50 pixels away , alpha = 50. Mouse distance = 10px, alpha = 90px etc...

    So, we can take that number and multiply or divide it to see more or less white boxes. Open the file, double-click the box in the library, and look at the code in the top frame. All the way at the end of the equation, right before the terminating semi-colon, try multiplying by 2 or 3, or dividing by 2 or 3 to see different effects. i.e...<pre>alpha = 100 - Math.sqrt(Math.pow(_x - _root._xmouse, 2) + (Math.pow(_y - _root._ymouse, 2))) / 2;</pre>-Dan

  6. #6
    Registered User
    Join Date
    Nov 2001
    Location
    Mostly In The Clouds
    Posts
    214
    Ok, I want to apply it to a fullscreen movie and I want that effect to be covering most of the screen. I dunno if I'm seeing it different to you because I get a 550 x 400 window and the rollover only seems to work in the top leftish corner, that corect? If so, how can I make it for use over a fullscreen movie?

    Thanks again

  7. #7
    Senior Member
    Join Date
    May 2002
    Posts
    248
    If you're going to view the movie in a web page, then open the .fla in Flash, and choose scaling in the publish settings. Also, mess around with the code inthe first frame of the movie to position the boxes. initialX and initialY are the _x and _y values of the top-left box. spacing = the distance between each of the boxes.

    -Dan

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