Selteco Software
Selteco.com > FlashDesignerZONE.com > Tutorials > T1092

Flash jewelry viewer

One of the key factors of successful sale is a high quality picture of your product. If the space is limited you can implement a simple zoom-in and out viewer on your website.

Click arrows to zoom-in and zoom-out the picture, move the image with your mouse.

  1. Launch Alligator Flash Designer and choose Blank Document
  2. Draw a new Sprite that will appear as Sprite1

  3. Import the picture to Sprite, you can either paste it or import it from file with File > Import Image
  4. Place the picture so the center of it will be at 0,0 coordinate of the Sprite
  5. Hit Esc to quit the sprite
  6. Choose Insert > Icon and place zoom-in and zoom-out icons, you can use arrows or other symbols
  7. Select the zoom-in icon, choose Action > OnClick and paste the code: 

    if(Sprite1._xscale<100)
{
Sprite1._xscale = Sprite1._xscale * 2;
Sprite1._yscale = Sprite1._yscale * 2;
}

  8. Select the zoom-out icon, choose Action > OnClick and paste the code: 

    if(Sprite1._xscale>25)
{
Sprite1._xscale = Sprite1._xscale / 2;
Sprite1._yscale = Sprite1._yscale / 2;
}

  9. Choose Frame > ActionScript and paste the code: 

    // initial scale of the picture
Sprite1._xscale = 25;
Sprite1._yscale = 25;

Sprite1.onPress = function()
{
Sprite1.startDrag();
};
Sprite1.onRelease = function()
{
Sprite1.stopDrag();
};

  10. Press F9 to launch preview window
Download source project t1092.zip (59 kb)