Hello Everybody,
I want to fine-tune my working portfolio setup.
It’s builds a row of thumbnails and when pressed the
portfolio item aka website or graphic is loaded in a larger version included
with information and link to the specified project.
To make it look allot smoother, i want to incorporate a sequential preload of the thumbnails
Now:Visualize a row of 20 small thumbnails on a horizontal row…
When they get loaded a want a small preloader inside and exact size of the thumb: for example filling the thumb from left to right and on loadcomplete it gets transparent…
I searched a lot of forums for sequential preloading, but no succes…
Hope someone can/wil bring up some usefull code…
here is my actionscript:
ActionScript Code:
showItemType = "website"
// DisplayInfo is used when an item is pressed
// it shows the infobox_mc, assigning the content of the selected item
function DisplayInfo(mc){
infobox_mc.title_txt.text = mc._parent.itemTitle_txt.text;
trace(mc._parent.itemTitle_txt.text);
infobox_mc.content_txt.text = mc.itemDesc_text;
infobox_mc.url_txt.text = mc.itemUrl_text;
infobox_mc.image_mc.loadMovie(mc.itemImage_text)
}
// define basic variables for setting up the menu
var item_spacing = 150; // how far menu items are spaced veritcally
var item_count = 0; // counts menu items as they are added from the XML
// CreateMenu creates a menu based on the XML object passed.
// It loops through all the items with a for loop adding clips to the menu_mc
// movieclip on the timeline, defining the appropriate text where and thumb needed
function CreateMenu(menu_xml){
// start with the first item in the XML
var items = menu_xml.firstChild.firstChild.childNodes; // menu -> menuitems -> child nodes array
for (var i=0; i<items.length; i++) {
// only continue if the type of this item is = showItemType
if (items*.attributes.type == showItemType) {
// create variables for our elements
var itemTitle = items*.firstChild; // same as items*.childNodes[0]
var itemDesc = items*.childNodes[1]; // second childNode
var itemUrl = items*.childNodes[2]; // third childNode
var itemThumb = items*.childNodes[3]; // fourth childNode
var itemImage = items*.childNodes[4]; // fifth childNode
// Create a menu item movie clip in the menu_mc instance on the main timeline
// for each item element offsetting each additional further down the screen
var item_mc = menu_mc.attachMovie("menu_item","item"+item_count, item_count);
menu_mc["item"+item_count]._y = item_count * item_spacing;
menu_mc["item"+item_count]._x = i%50*120;
menu_mc["item"+item_count]._y = Math.floor(i/50)*87
// assign text using nodeValue to get the text
// from the text nodes and CDATA sections
menu_mc["item"+item_count].itemTitle_txt.text = itemTitle.firstChild.nodeValue;
menu_mc["item"+item_count].main_btn.itemDesc_text = itemDesc.firstChild.nodeValue;
menu_mc["item"+item_count].main_btn.itemUrl_text = itemUrl.firstChild.nodeValue;
menu_mc["item"+item_count].main_btn.itemThumb_text = itemThumb.firstChild.nodeValue;
menu_mc["item"+item_count].main_btn.itemImage_text = itemImage.firstChild.nodeValue;
menu_mc["item"+item_count].thumb_mc.loadMovie(itemThumb.firstChild.nodeValue);
// set the onRelease of the item button to the DisplayInfo function
menu_mc["item"+item_count].main_btn.onRelease = function(){
DisplayInfo(this);
}
item_count++;
}
}
DisplayInfo(menu_mc.item0.main_btn);
}
// manage XML
// create new XML object instance, remembering to ignore white space
var squirrel_xml = new XML();
squirrel_xml.ignoreWhite = true;
// define an onLoad to create our itemDesc menu when the XML has successfully loaded.
squirrel_xml.onLoad = function(success){
if (success) CreateMenu(this);
else trace("Error loading XML file"); // no success? trace error (wont be seen on web)
}
// load the xml file!
squirrel_xml.load("portfolio.xml");
Thanks for your efforts…!
Best
Arn