SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast
    Join Date
    Sep 2006
    Posts
    91
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How do I create a similar effect to this?

    Hi,

    I need to do something like this animation here:
    http://www.thelondonnyc.com/

    Are all the photo's just on different layers, with motion tweens and varying opacity?

    It looks familiar, like I've seen this effect before, does anyone know of any tutorials that do something similar or can you let me know.

    James

  2. #2
    SitePoint Wizard jim_morrison3's Avatar
    Join Date
    Apr 2004
    Location
    UK
    Posts
    2,324
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes the images are arranged in different layers, depending upon your skills in flash you can also do this dynamically by pulling images from xml.
    Good Luck!
    There are things known and Things unknown
    And in between are the Doors.
    I love hand Coding.

  3. #3
    Community Advisor silver trophy

    Join Date
    Nov 2006
    Location
    UK
    Posts
    2,547
    Mentioned
    40 Post(s)
    Tagged
    1 Thread(s)
    I was just looking at a slideshow I did for somebody a while back that had a similar effect of the overlaid bars:

    Code:
    // create overlaid animated transparent bars
    min_width = min_alpha = 10;
    max_alpha = 40;
    max_width = Stage.width / 5;
    speed = 5;
    bars = 10;
    vs=System.capabilities.version.split(" "); fv=vs[1].substr(0,1);
    blend = "overlay";
    
    // create some bars
    for(i=0;i<bars;i++){
    	m=this.createEmptyMovieClip("mc"+i,this.getNextHighestDepth()+i);
    	m.beginFill("0xFFFFFF",100);
    	m.moveTo(0, 0);
    	m.lineTo(100, 0);
    	m.lineTo(100, Stage.height);
    	m.lineTo(0, Stage.height);
    	m.lineTo(0, 0);
    	m.endFill();
    	m._alpha=min_alpha+random(max_alpha-min_alpha);
    	m._width=random(max_width);
    	m._x=m._width+random(Stage.width-m._width*2);
    	m.velocity=-speed+random(speed*2);
    	if(Math.abs(m.velocity)<0.5){m.velocity=0.5+random(1);}
    	if(fv>=8){m.blendMode=blend;}
    }
    
    // animate the bars
    this.onEnterFrame=function(){
    	for(i=0;i<bars;i++){
    		this["mc"+i]._x+=this["mc"+i].velocity;
    		if(this["mc"+i]._x<(-20-this["mc"+i]._width)){
    			this["mc"+i]._x=Stage.width+this["mc"+i]._width;
    		}
    		if(this["mc"+i]._x>(20+Stage.width+this["mc"+i]._width)){
    			this["mc"+i]._x=0-this["mc"+i]._width;
    		}
    	}
    }


Bookmarks

Posting Permissions

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