# Image Portfolio! - thumbnail layout

**URL:** https://forum.kirupa.com/t/image-portfolio-thumbnail-layout/78523
**Category:** Uncategorized
**Created:** [February 5, 2005, 1:23pm UTC](https://forum.kirupa.com/t/image-portfolio-thumbnail-layout/78523 "2005-02-05T13:23:20Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![Wyatt](https://avatars.discourse-cdn.com/v4/letter/w/b19c9b/32.png) [@Wyatt](https://forum.kirupa.com/u/Wyatt)
#### Post date: [February 5, 2005, 1:23pm UTC](https://forum.kirupa.com/t/image-portfolio-thumbnail-layout/78523/1 "2005-02-05T13:23:20Z")

</div>

OK i’m an actionscript NOOB, and I did the tutorial thing on an XML Image portfolio!

[http://www.kirupa.com/web/xml/examples/portfolio.htm](http://www.kirupa.com/web/xml/examples/portfolio.htm)

and! it works great! but! I want to put in a bunch of pictures - and I’d like them to fit in a box ---- kinda confusing

[http://www.arwestudios.com/imageportfolio](http://www.arwestudios.com/imageportfolio)

– this is the page i’m working on- notice how the last thumbnail goes off the white box- does anyone know if its possible to get the thumbnails to go down to the next line? – and if not- if there’s an easier way to accomplish the same thing.  
–THANKYOU! for the help 😃 I love you

- here’s my code- just in case your extra crazy

```auto

stop();

image_mc.setMask(mask_mc);

var thumb_spacing = 55;

// load variables object to handle loading of text
var description_lv = new LoadVars();
description_lv.onData = function(raw_text){
	description_txt.text = raw_text;
}

function GeneratePortfolio(portfolio_xml){
	var portfolioPictures = portfolio_xml.firstChild.childNodes;
	for (var i = 0; i < portfolioPictures.length; i++){
		var currentPicture = portfolioPictures*;
		
		var currentThumb_mc = menu_mc.createEmptyMovieClip("thumbnail_mc"+i,i);
		currentThumb_mc._x = i * thumb_spacing;
		
		currentThumb_mc.createEmptyMovieClip("thumb_container",0);
		currentThumb_mc.thumb_container.loadMovie(currentPicture.attributes.thumb);
		
		currentThumb_mc.title = currentPicture.attributes.title;
		currentThumb_mc.image = currentPicture.attributes.image;
		currentThumb_mc.description = currentPicture.attributes.description;
		
		
		currentThumb_mc.onRollOver = currentThumb_mc.onDragOver = function(){
			info_txt.text = this.title;
		}
		currentThumb_mc.onRollOut = currentThumb_mc.onDragOut = function(){
			info_txt.text = "";
		}
		currentThumb_mc.onRelease = function(){
			image_mc.loadMovie(this.image);
			description_lv.load(this.description);
		}
	}
}

// xml object for xml content (defines sources for selections)
var portfolio_xml = new XML();
portfolio_xml.ignoreWhite = true;
portfolio_xml.onLoad = function(success){
	if (success) GeneratePortfolio(this);
	else trace("Error loading XML file"); // no success? trace error (wont be seen on web)
}
// load
portfolio_xml.load("portfolio.xml");

```