A Flash Developer Resource Site

Results 1 to 4 of 4

Thread: help me customize a scrolling image tutorial pls

  1. #1
    Junior Member
    Join Date
    Mar 2010
    Posts
    13

    help me customize a scrolling image tutorial pls

    hi, i'm hoping you guys can help me figure out how to customize this flash scrolling book movie i have. I found a great tutorial online and followed it and loved it. http://www.republicofcode.com/tutori.../imagegallery/

    my scrolling book movie - http://bit.ly/cmbafB

    in that tutorial you will notice he has the user clicking on the images and seeing the image larger. I would like each image when clicked to go to a specified url.

    I don't know crap about code and want to finish my project. i would like to understand what is going on so I can figure it out next time myself.
    His comments are VERY helpful, but i am still confused a bit.

    Code:
    for (i=1; i<=imagesNumber; i++) {
    container.attachMovie("thumb"+i,"thumb"+i+"_mc",i);
    when this code runs i is equal to 1.
    imagesNumber is 17, so we know i is less than imagesNumber. i++ increments i, so is i now = to two? so is the container that will be created named: thumb2_mc?
    what does the i (i bolded it)mean on the end of the code?

    to add my urls, how do i tell this thing to attach my urls to each thumb_mc?
    I did a trace on myThumb_mc and it's 17 everytime. why is that? Where in the code is it assigning each image a name and can I assign a url to it too?
    sorry to be a pain. i got a lot of questions and i'm confused as heck.



    Code:
    import mx.transitions.Tween;
    import mx.transitions.easing.*;
    
    //Creating the Container
    this.createEmptyMovieClip("container",1);
    
    
    var imagesNumber:Number = 17;
    for (i=1; i<=imagesNumber; i++) {
    container.attachMovie("thumb"+i,"thumb"+i+"_mc",i);
    
    //Attaching the Images and Aligning Them on Stage
    
    myThumb_mc = container["thumb"+i+"_mc"];
    myThumb_mc._x = (i-1)*myThumb_mc._width;
    myThumb_mc._y = (Stage.height-myThumb_mc._height)/2
    }
    
    //Creating the Scrolling Effect - to speed up or slow down change (*5) container.onEnterFrame = function (){
    this._x += Math.cos((-_root._xmouse/Stage.width)*Math.PI)*5;
    if (this._x>0) {
    this._x = 0;
    }
    if (-this._x>(this._width-Stage.width)) {
    this._x = -(this._width-Stage.width);
    }
    };
    
    //Assigning a Variable to Each Thumb
    
    for (i=1; i<=imagesNumber; i++) {
    container.attachMovie("thumb"+i,"thumb"+i+"_mc",i);
    myThumb_mc = container["thumb"+i+"_mc"];
    myThumb_mc._x = (i-1)*myThumb_mc._width;
    myThumb_mc._y = (Stage.height-myThumb_mc._height)/2
    myThumb_mc.largerImage = i;
    }
    
    
    
    //making the buttons clickable
    
    myThumb_mc.onRelease = function(){
    			
    _root.attachMovie("image"+this.largerImage,"large_mc",2);
    trace(myThumb_mc);
    }
    }
    can't i simply add a if(myThumb_mc is = to 3 url ="http....) instead of _root.attach...
    myThumb_mc.onRelease = function(){

    _root.attachMovie("image"+this.largerImage,"large_ mc",2);
    trace(myThumb_mc);
    Last edited by christylove; 11-08-2010 at 04:44 PM.

  2. #2
    Junior Member
    Join Date
    Mar 2010
    Posts
    13
    no tutorial? no nothing, daMN!

  3. #3
    Senior Member
    Join Date
    Apr 2002
    Posts
    2,849
    You asked a lot of questions here (seven, in fact). You might consider in the future picking the 2-3 you're most interested in, as you're basically asking someone to write a page. It's exhausting just thinking about responding to a post like this.

    But let's give it a shot.

    1. Yes, it increments i, so i becomes 2, 3, etc until it reaches 17.
    2. Yes, the container created would be thumb2_mc, thumb3_mc, etc.
    3. The last i is the depth, which is also set to 2, 3, etc. If two things overlap, something at depth 3 would be on top of something at depth 2.
    4. You can add the urls in the for loop, but that's going to be a little complicated, so let's come back to that.
    5. myThumb_mc is 17 because you're tracing it after the for loop code has run. "i" was 17 the last time myThumb_mc gets set.
    6. It's assigning a name in the attachMovie line. The name is thumb2_mc, thumb3_mc like you asked about in question 2.
    7. No, you can't simply add if(myThumb_mc is = to 3 url ="http....) instead of _root.attach because myThumb_mc is always 17, as you've already noticed. You could say something like if this._name=="thumb2_mc", but you'd need 17 different if statements.

    Back to question 4, the way I'd suggest setting your urls is to use an array, which is just a list you can loop through. So you'd have something like:

    Code:
    var urlArray=new Array();
    urlArray[1]="http://www.google.com";
    urlArray[2]="http://www.yahoo.com";
    // and so on...
    Then in your loop, you'd assign that to the clip, something like:

    Code:
    myThumb_mc.urlLink=urlArray[i];
    Finally, you'd put your onRelease code within the loop and change it to:

    Code:
    myThumb_mc.onRelease = function() {
    		getURL(this.urlLink);
    	};
    Past all that, as far as I can tell you have two for loops when you only need one. Here's my adaptation of your code removing that second for loop and using only 2 images:

    Code:
    import mx.transitions.Tween;
    import mx.transitions.easing.*;
    
    //Creating the Container
    this.createEmptyMovieClip("container",1);
    
    var imagesNumber:Number = 2;
    
    //Creating the Scrolling Effect - to speed up or slow down change (*5) 
    container.onEnterFrame = function() {
    	this._x += Math.cos((-_root._xmouse/Stage.width)*Math.PI)*5;
    	if (this._x>0) {
    		this._x = 0;
    	}
    	if (-this._x>(this._width-Stage.width)) {
    		this._x = -(this._width-Stage.width);
    	}
    };
    //Assigning a Variable to Each Thumb 
    var urlArray=new Array();
    urlArray[1]="http://www.google.com";
    urlArray[2]="http://www.yahoo.com";
    
    for (i=1; i<=imagesNumber; i++) {
    	container.attachMovie("thumb"+i,"thumb"+i+"_mc",i);
    	myThumb_mc = container["thumb"+i+"_mc"];
    	myThumb_mc._x = (i-1)*myThumb_mc._width;
    	myThumb_mc._y = (Stage.height-myThumb_mc._height)/2;
    	myThumb_mc.urlLink=urlArray[i];
    	myThumb_mc.largerImage = i;
    	myThumb_mc.onRelease = function() {
    		getURL(this.urlLink);
    	};
    }

  4. #4
    Junior Member
    Join Date
    Mar 2010
    Posts
    13
    Thank you, thank you. Sorry to be a pain in the you know what. I'm going try this.

Tags for this Thread

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