A Flash Developer Resource Site

Results 1 to 9 of 9

Thread: expand images

  1. #1

    expand images

    Hello,

    I have been searching online to figure out a way to expand images on rollover EXACTLY as is show on this site (skip intro to see what i mean)

    Does this involve AS or just simple tweening. Need to give my boss and answer asap, so any help is greatly appreciated..! thanx!

    http://www.templatemonster.com/flash...ates/9476.html

  2. #2
    Senior Member
    Join Date
    May 2000
    Location
    Bombay, India
    Posts
    926
    Hi,

    This is done using ActionScript.

    This is the way i would do it. This is for one image only

    Create a movie clip (MC) with 5 frame
    Place an image on the timeline in frame 1
    Create a new layer...change its properties to MASK
    Draw out a rectangle on this mask layer, so that it masks just a part of the image on frame 1. Make the rectangle into a graphic symbol.
    Repeat the mask on frame 5. Just increase the width of the rectangle symbol.
    Remember: In Flash a mask, shows what is under it...and hides stuff outside its boundaries.

    Place a stop action in the first and last frame of the MC. So it dosent play till needed.
    Now apply a motion tween between frame 1 and frame 5 in the mask layer.

    Now create another layer for the button above the mask layer.
    Create a rectangle as large as the image below, in this layer.
    Make the rectangle into a button symbol.
    Yeah..the rectangle button hides the image - select the button and choose edit in place.

    In the timeline of the button symbol, move the rectangle into the last keyframe named Hit. This will make the button invisible.

    When u go back to your main timeline, you'll see the button as a
    see-thru aqua-blue. Don't worry, it will not be seen in your final swf.

    Give the button this code

    Code:
    on (rollOver){
    	gotoAndPlay (2)
    }
    on (rollOut){
    	gotoAndStop(1)
    }
    Thats it....create as many different images that you want...and line them up

    Hope that helps
    RanTen
    Unrepentant Rebel & Boat Rocker
    http://ranten.celltrix.com

  3. #3
    Developing For Dunkets mneil's Avatar
    Join Date
    Mar 2007
    Location
    Lincoln City
    Posts
    2,156
    I've done just that. I don't have the files with me right now, I wrote it a long time ago in as2. If you want, I'll find the files when I get home and upload them for you so you can take a look at them.
    http://code.mneilsworld.com/
    Text Effects | Bubbles | Dynamic Resize
    4 weeks , 20 papers ... thats 2 dollars .....Caassshhh!

  4. #4
    Thank you RanTen...
    this is actually not working...there is a glitch somewhere...when i rollover my image (lets say the first one) the image expands fine, but the image next to it (the second image) appears on top of it. Its pretty hard to explain, but basically when the images expand, the ones next to them appear non expanded.
    i followed the instructions accurately...the rollover works fine on its own

    am i doing something wrong? I am using AS2

    mneil i would really like to take a look at your files if that is ok.

    thank u!

  5. #5
    I attached an example of how i did this, using two images. ANy help is greatly appreciated..!
    Attached Files Attached Files

  6. #6
    Senior Member
    Join Date
    May 2000
    Location
    Bombay, India
    Posts
    926
    Hi,

    Cannot open your file.

    I have Flash CS3...

    Can you repot the file for CS3 or lower version please?
    RanTen
    Unrepentant Rebel & Boat Rocker
    http://ranten.celltrix.com

  7. #7
    ok its attached.
    Attached Files Attached Files

  8. #8
    Senior Member
    Join Date
    May 2000
    Location
    Bombay, India
    Posts
    926
    Hi,

    I just changed the order of the layers....is this the way you want it to work???

    Let me know
    Attached Files Attached Files
    RanTen
    Unrepentant Rebel & Boat Rocker
    http://ranten.celltrix.com

  9. #9
    Developing For Dunkets mneil's Avatar
    Join Date
    Mar 2007
    Location
    Lincoln City
    Posts
    2,156
    Well, I can't find my fla that had exactly what you're looking for But I did find another file that has the functionality you need. It's a slideshow that reads from an xml file and load a stylesheet to format some html text from the xml to do captions. At the bottom of the slideshow it numbers, basically, the image and that part has the animation you're looking for. If you're just starting out what I wrote may be a bit confusing but if you can pull out the part that has the animation I think it could really help you.

    get it at clients.mneilsworld.com/flashkit/slider.zip
    http://code.mneilsworld.com/
    Text Effects | Bubbles | Dynamic Resize
    4 weeks , 20 papers ... thats 2 dollars .....Caassshhh!

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