PDA

View Full Version : Flashlevel Navigation Recreation



Voetsjoeba
December 19th, 2004, 01:51 PM
Recreation of the Flashlevel (http://www.flashlevel.com) navigation, requested by Simplistik. A little addition has been made to show a caption on rollover. However, you a free to choose your own rollover animation, whether or not with the caption. You can use the caption somewhere else as well and then use it as a title instead of a caption ... This menu uses an XML file to store links, image paths and captions in.

width=700 height=500

Download: http://downloads.voetsjoeba.com/?1099254535

mdipi
December 19th, 2004, 01:53 PM
Whoa! Cool stuff Voets! A little bit laggy on my machine (1.33ghz, 768megs of ram) but that might because of other apps open.

Great job though!

Voetsjoeba
December 19th, 2004, 01:55 PM
Lol that was fast ! Thanks ! :)

I'm on a 1.3 Ghz Athlon with 640 MB RAM and no lag here ... so it'll have to be your other applications that are open :)

Krilnon
December 19th, 2004, 02:22 PM
I think I saw this in the Best Of Kirupa section, no? Anyhow, its really nice!

Voetsjoeba
December 19th, 2004, 02:24 PM
I think I saw this in the Best Of Kirupa section, no? Anyhow, its really nice!
Yeah, Simplistik asked me to create it for him, and after I did someone requested to have it moved to BoK ... can't hurt to put all the source files together here :)

B3NKobe
December 20th, 2004, 01:37 AM
Thanks heaps for this Voetsjoeba, this will be really good to use in my new site, thanks!

kirupa
December 20th, 2004, 01:40 AM
Looks excellent voets! No lag here either :)

minimalistik
December 20th, 2004, 01:59 AM
P4 2.0 256mb, great edition Voets, as always ;)

i will learn fl
February 4th, 2005, 12:32 PM
Is it possible to make it horizontal as in left to right or right to left?

RevoGiant
February 4th, 2005, 06:44 PM
Hey I love this menu but I have a begginer type question:

if I want it to not goto a new page but instead ad an actionscript to the tag like:

on(press) {
main.gotoAndStop(10);
}

can I do that on the XML sheet?

you can check out what im talking about :

http://koldtouch.com/white-kold.html

any help would be GREATLY appretiated. Ive been wondering about the in XML for a while! Thanks!

mdjstudios
February 11th, 2005, 12:56 PM
I am at school on a slooow Pent. III, with 400mb RAM and it looks really smooth to me :) Good Job!

booler
February 14th, 2005, 11:09 PM
EDIT: I think I got it after looking at the Best of Thread... lemee see if I have this right I changed the getURL section to this...


_root.contents.loadMovie(this._parent.link);
(http://www.followthebeat.com/nagmier/ftb_testhelp.zip)

frozenRage
February 15th, 2005, 05:09 AM
that is pretty awesome man, keep it up

booler
February 15th, 2005, 11:47 AM
Seems I've figured out the below problem but now I have a new question.... been snooping around the fla and can't seem to find anywhere where the thumbCaption MC is called I'm trying to move the clip above the thumb scroller so its more like a changing title and I can't seem to find anywhere its even called I seem the XML loading the caption in the AS but I can't find the call the the MC or where its placed on the stage so I assume its placed at runtime but I can't find it in the darn actionscript

ok heres some more monkeywrench to the problem, It seems to work fine as a standalone swf but when I _root.clipname.loadMovie("filename.swf"); it breaks it and the images go up and the arrows go down past the "box" it looks fine at first until you try to click on one of the images or just move them up and down :stunned:

ok think I got it working let me know if this is the wrong way to fix it....


slideMenu = function () {
diff = _parent._ymouse-this._y;
scale = diff*100/this.mask._height;

I changed it to the from this below and it seem ok now


slideMenu = function () {
diff = _root._ymouse-this._y;
scale = diff*100/this.mask._height;

simplistik
February 15th, 2005, 11:57 AM
I use this


loadMovie(this._parent.link, _root.mc1);

But what I have it doin is goin out side to the parent, and back into it into the mc1. just so you can see how it works i my layout here is my ghetto image of how I have it layed out.

booler
February 15th, 2005, 12:32 PM
I haven't actually tested out the loadmovie code yet as I'm still trying to move the caption to somewhere above the scroller but I think it will work not 100% yet and I'll be loading into a different movieclip one that will contain the "contents" for that link... Its just trying to figure out how he placed the captions its driving me nuts... I think I might be able to add something to the rollover function to just change the text in another dynamic text field just gonna have to play with it some if Voetsjoeba doen't have time to check out this thread today.

maciejwantusiak
February 16th, 2005, 10:25 PM
great stuff!
I've been trying to make it work in horizontal and everything seems to work preety cool if it is played in a separate .swf. But as soon as i use it in my other project, none of the thumbs shows up, and it doesn't recognize them as buttons either. I tried using the original vertical version - same thing again.
The nav bar is loaded into another movie dynamically...

here is the code for horizontal:


MovieClip.prototype.easeX = function(x) {
this.onEnterFrame = function() {
this._x = x-(x-this._x)/1.2;
if (Math.abs(x-this._x)<=1) {
delete this.onEnterFrame;
this._x = x;
}
};
};
images = new Array();
xml_file = "images.xml";
xmlload = new XML();
xmlload.ignoreWhite = true;
xmlload.onLoad = function(ok) {
if (ok) {
count = this.firstChild.childNodes.length;
for (var i = 0; i<count; i++) {
curNode = this.firstChild.childNodes[i];
images[i] = {path:curNode.childNodes[0].firstChild.nodeValue,link:curNode.childNodes[1].firstChild.nodeValue,caption:curNode.childNodes[2].firstChild.nodeValue};
}
boot();
} else {
trace("Could not load "+xml_file+".");
}
};
xmlload.load(xml_file);
// ------------------------------------------------------------
spacing = 5;
boot = function () {
for (var i = 0; i<images.length; i++) {
mc = container.attachMovie("thumbMC", "thumb"+i, i);
mc._x = i*(60+spacing);
mc.path = images[i].path;
mc.link = images[i].link;
mc.over.captionMC.caption.text = images[i].caption;
}
setRollOver();
};
setRollOver = function () {
this.onEnterFrame = function() {
if (this.mask.hitTest(_root._xmouse, _root._ymouse)) {
slideMenu();
}
};
};
slideMenu = function () {
diff = this._xmouse-this._x;
scale = diff*100/this.mask._width;
target = -scale*(this.container._width-this.mask._width)/100;
this.arrows.easeX(diff);
this.container.easeX(target);
};


As you can see, Im even using the same images as were provided in the .zip.
Can someone help me out please - i've been stuck with it for some time already but i don't want to just give up...
thanks

vanbasten
March 3rd, 2005, 10:03 AM
Hi Voets

Id like put your menu in my website like an swf, but when my mouse is over the images the arrows go down further on images.
How can I fix it ?
Many thanks

simplistik
March 3rd, 2005, 12:29 PM
Hi Voets

Id like put your menu in my website like an swf, but when my mouse is over the images the arrows go down further on images.
How can I fix it ?
Many thanks

The arrows should go the height of the images, so it will go to the absolute bottom of the last image and the absolute top of the top image. But should never go passed the mask. If you've got it in an external swf that you're calling into a MC in you need to change
diff = _root._ymouse-this._y; to
diff = _ymouse-this._y;

vanbasten
March 3rd, 2005, 01:38 PM
It works!!!

Thank you so much!!!!! :-)

simplistik
March 3rd, 2005, 02:07 PM
It works!!!

Thank you so much!!!!! :-)

Sure thing :D, glad to help. I'm no AS guru like Voet or Sen, but I've got tricks here and there ;)

vanbasten
March 3rd, 2005, 06:00 PM
Why it works now ?
Maybe the _root statements make a reference to my MC and not to Voets swf?

simplistik
March 3rd, 2005, 06:43 PM
Oh... cause root is forcing it to grab the x and y of the main stage instead of staying with in the movie clip. taking out root contains that.

vanbasten
March 5th, 2005, 05:03 AM
Many thanks Simpli :-)
Id like recreate a menu like this www.panasonic.co.uk (http://www.panasonic.co.uk) , is it possible use the voets swf without putting the full code?

josefjohny
March 5th, 2005, 06:22 AM
wow thanks mate i was looking for this !!!

simplistik
March 5th, 2005, 11:33 PM
Many thanks Simpli :-)
Id like recreate a menu like this www.panasonic.co.uk (http://www.panasonic.co.uk) , is it possible use the voets swf without putting the full code?

That would require more coding than what is in there... but you could do something like when you load your movie you can make the mc visible=false or alpha zero... play an animation and when the animation is done make it visible=true or alpha 100.... get it?

vanbasten
March 6th, 2005, 12:44 PM
That would require more coding than what is in there... but you could do something like when you load your movie you can make the mc visible=false or alpha zero... play an animation and when the animation is done make it visible=true or alpha 100.... get it?

Hi
I tried both with visible=true both with alpha, I put this code within mc menu, but in this manner the links and the caption doesn't works.
I explain better. I create a text , when the mouse is over this text the mc is visible, then I put within mc the rollover command to put alpha=0 or visible = false, this work but the links and the captions disappear :-(
Sometimes As is very strange :-)

Libyan
March 6th, 2005, 01:29 PM
Really i like this menu !!!

Alvaro Moreira
March 6th, 2005, 02:47 PM
Buenas tardes

I need to put this menu as an external .swf... i manage to do that, but on.release, I dont want to load a new html... instead, I need to load a jpg on a mc, that is located on the main swf, in the same that the menu is loaded into.

So I need to change the url of the xml... but Im not sure what to put instead... I´ve tried a couple of combinations, but neither really worked... Theres a post on top wich asks my exact question, but it was never answered... was it?

imagine the image name is 01.jpg, and is located on a folder called pic, in the same folder that the main.swf.

thank you very much...

simplistik
March 6th, 2005, 06:55 PM
Hi
I tried both with visible=true both with alpha, I put this code within mc menu, but in this manner the links and the caption doesn't works.
I explain better. I create a text , when the mouse is over this text the mc is visible, then I put within mc the rollover command to put alpha=0 or visible = false, this work but the links and the captions disappear :-(
Sometimes As is very strange :-)

Wait... so are you trying to make the captions disappear and reappear or the whole MC?

If you're trying to make the whole thing disappear you do this on a button/mc:


but.onRollOver = function() {
if (scroller._visible == true){
scroller._visible=false;
}
else {
scroller._visible=true;
}
}
or of course you can do this as well


but.onRollOver = function() {
scroller._visible=false;
}
but.onRollOut = function() {
scroller._visible=true;
}
everything should be fine, that way.

But if you're tryin to control the text... I'm sure it's working but you'll never know since the only time you'd ever see that text anyway, is on rollover... and since you have it's alpha set to 0... you'll never see it, LoL.

simplistik
March 6th, 2005, 07:10 PM
Buenas tardes

I need to put this menu as an external .swf... i manage to do that, but on.release, I dont want to load a new html... instead, I need to load a jpg on a mc, that is located on the main swf, in the same that the menu is loaded into.

So I need to change the url of the xml... but Im not sure what to put instead... I´ve tried a couple of combinations, but neither really worked... Theres a post on top wich asks my exact question, but it was never answered... was it?

imagine the image name is 01.jpg, and is located on a folder called pic, in the same folder that the main.swf.

thank you very much...

LoL... ok... first in the xml document make the [url] the path of your images... so in your case I guess it would be pic/01.jpg.

2nd, make an empty MC on the root level... or where ever you want. And give it an instance name for this example I'm calling it: jpgMC

Next... go into thumbMC, you can find it in your library. Find this piece of code:



getURL(this._parent.link, "_blank");


and replace it with



loadMovie(this._parent.link, _root.jpgMC);


That should do it.

vanbasten
March 6th, 2005, 10:04 PM
Hi Simpli

Id like when the mouse is rolling out the scroller, the scroller must disappear,
I tried putting the rollout code into the scroller mc but in this manner the links of the scroller are inactive, I put my files in the attachement so you can see :-)

simplistik
March 6th, 2005, 11:11 PM
Here man... you'll see all the AS on the first frame, and I commented the AS to help you out. I changed some things around too... like removed the button and replaced it w/ a movie clip for more control.

vanbasten
March 7th, 2005, 05:47 AM
Here man... you'll see all the AS on the first frame, and I commented the AS to help you out. I changed some things around too... like removed the button and replaced it w/ a movie clip for more control.
Many thanks man but the problem remain :-(
when I click over the scroller the links doesn't work and the caption doesn't appears.
It seems something coverup the scroller

simplistik
March 7th, 2005, 08:56 AM
Many thanks man but the problem remain :-(
when I click over the scroller the links doesn't work and the caption doesn't appears.
It seems something coverup the scroller

LoL... oops... didn't pay attention to details... here this works... it's not pretty... but it works :P, sorry did this in like 5min. I'm sure Voet can code it to work properly... but he's busy ;)

vanbasten
March 7th, 2005, 09:41 AM
GREAT :-)
if you were a girl I 'd like kiss you! :-D

simplistik
March 7th, 2005, 09:44 AM
GREAT :-)
if you were a girl I 'd like kiss you! :-D

LoL... eh... thx... but like I said it's kinda ghetto, I went old school on it. But if it works... it works... LoL.

spectreman
March 18th, 2005, 10:16 PM
voets or simplistik,

seeing as you 2 are the masters of this, i've been messing around with this great script using pixel fonts. is it possible to have this scroller land on an even pixel (so no blur)? i tried using Math.round in the AS, but that doesn't work...

any ideas?? (see attachment for easier reference)

thanks a million,
s.

simplistik
March 18th, 2005, 11:45 PM
voets or simplistik,

seeing as you 2 are the masters of this, i've been messing around with this great script using pixel fonts. is it possible to have this scroller land on an even pixel (so no blur)? i tried using Math.round in the AS, but that doesn't work...

any ideas?? (see attachment for easier reference)

thanks a million,
s.
Well the reason I've mastered this is cause I asaked for it. And I hate having things that I know nothing about. But anywho... I'll have to tell you that this was an odd way to use the nav but it works I guess, LoL.

Here is what you need to change.

on line 3 change


this._y = y-(y-this._y)/1.2;

to


this._y = Math.ceil(y-(y-this._y)/1.2);


and on line 6 I change


this._y = y;

to


this._y = Math.ceil(y);


You can use Math.round in place of Math.ceil depends on what suits your fancy.

I know Voets lubs me for learning this all and being able to take on the question for him :D

spectreman
March 19th, 2005, 12:39 PM
YES! Thanks.

simplistik
March 19th, 2005, 01:42 PM
YES! Thanks.

Sure thing.

Voetsjoeba
March 19th, 2005, 02:04 PM
Go Sim ! :D

simplistik
March 20th, 2005, 03:25 AM
Go Sim ! :D

LoL... I try :love: :kir:

I think all questions about this Nav have been answered though... so there may not be anymore :D yay!

sneakyninja
March 20th, 2005, 08:09 PM
Not too sure how to get the xml to load up a certain frame in my movie rather than an external url?!?!

simplistik
March 20th, 2005, 08:13 PM
ummm.... change


loader.onRelease = function() {
getURL(this._parent.link, "_blank");
};

to


loader.onRelease = function() {
gotoAndPlay(this._parent.link);
};

sneakyninja
March 21st, 2005, 12:52 PM
Thank You!!! :mu:

leira
April 20th, 2005, 05:19 PM
Read this the whole thread and unless my eyes are going bad, did anyone post a solution on how to make this horizontal? Appreciate it, thanks!

pou-pou
April 20th, 2005, 10:44 PM
I know it's somewhere, but can't find it now so I'll just upload it here.

leira
April 20th, 2005, 11:05 PM
Thanks gnu!

RoggaH
April 21st, 2005, 10:59 AM
I like to use this fantastic script, but without the XML-file. I want to use several movieclips (vertical buttons) in this scroller. Can this be done?

simplistik
April 21st, 2005, 11:29 AM
I like to use this fantastic script, but without the XML-file. I want to use several movieclips (vertical buttons) in this scroller. Can this be done?
seems pointless... what will that accomplish that isn't already being accomplished?

pixie101
May 16th, 2005, 07:27 AM
Wow, i just love this menu! Is it possible to make it load external .swf instead of just jpeg into the thumb container? If that is possible I think other cool stuff can be done to make it more dynamic.

Voetsjoeba
May 16th, 2005, 09:32 AM
Well since loadMovie is used to load the jpgs in, and loadMovie can be used for both swfs and jpgs, that should be possible yes. Just replace the jpgs by swfs in the XML file and it should work.

RevoGiant
May 16th, 2005, 03:06 PM
How cool would it be to add a floating caption while it loads external .swfs? That would be awsome....dunno still how to change that xml and AS so it loads external swfs though

simplistik
May 16th, 2005, 03:28 PM
How cool would it be to add a floating caption while it loads external .swfs? That would be awsome....dunno still how to change that xml and AS so it loads external swfs though
If you read the posts I've already covered how to load an external swf. as for the changing the xml all you need is there... captions are in the xml. and to place them outside of the nav you can go here:
http://www.kirupa.com/forum/showthread.php?t=86046

hypercane
May 16th, 2005, 07:06 PM
Alright now:

loader.onRelease = function() {
loadMovie(this._parent.link, _root.test)

This works to load an external image in an instance called 'test'.

However, this does not work for an external .swf to load in this instance, or even better: on a level on stage.

I cannot get this to work. Please please help.

hypercane
May 16th, 2005, 07:24 PM
Never mind, i fixed it already ;)

mahesh2k
May 18th, 2005, 11:42 AM
Nice nav voet.

penguin
May 21st, 2005, 11:05 PM
loven this, yall rock. But the first and last one are hard to get to, is there any way to add a spacer on the ends like the one between each thumbs.

Voetsjoeba
May 22nd, 2005, 04:46 AM
Yeah good question penguin, I noticed that too and felt the need for it. I updated the formula in one of my projects I think, I'll look it up

booler
May 22nd, 2005, 04:58 AM
Yeah good question penguin, I noticed that too and felt the need for it. I updated the formula in one of my projects I think, I'll look it up

sweetness! I'd love to see that!

webmask
May 24th, 2005, 02:52 PM
thanks for sharing mate.. ill use this on my site. :) coool

13forever
May 29th, 2005, 01:32 PM
I know it's somewhere, but can't find it now so I'll just upload it here.

would really appreciate it, but is there a MX version for this to make it horizontal?

pacno
June 5th, 2005, 11:22 AM
mhhmm....just found this - hope the thread is still up a bit.

This scroller works fine, but I need a change and I don't know where to do it.
Can it be done that there is some "buffer-space" at the beginning and end of the scroller, so you can see the first and last pic better.
Now you have to move your mouse to the edge to see the whole pic.

Thank's for a great source....



...And one more thing:
Can I control a second scroller simultaneously with the movements from the first one and maybe in opposite direction - so I can simulate a mirrorreflection, do you know what I mean?

pacno
June 7th, 2005, 01:21 PM
...anyone????

just noticed that it takes so long until the images are loaded, but maybe it seems just like that cause they're loaded shuffled...

If you take a look at 24-7media.de portfolio - similar to this - it's loading the pics in the array 1,2,3,......with fade in :) is it possible to make that?

Voetsjoeba
June 8th, 2005, 02:48 PM
Hey pacno - yeah I've noticed that issue myself about the padding on the first and last items, and I already made a fix to it though I haven't got the time at the moment to delve deeper into it to make it understandable for you guys. I'm in the middle of my exames, see.

pacno
June 9th, 2005, 03:58 AM
Hey, that sounds good - can wait for that feature, but is it possible to change the xml code, so the first thumb loads first, then the second and so on and maybe with a fade in?

Voetsjoeba
June 9th, 2005, 07:28 AM
Here's the .fla with the fix. The var used is called 'diffspacing', and it controls how much pixels from the top and bottom the scrolling should become active. The recommended value for this is half the height of the content frames, because that'll make it stop right when the hand cursor is at the middle of that first and last frame.

pacno
June 9th, 2005, 02:17 PM
Thank's for the file, but I can't get it to work.....:?
Tried to change it to a horizontal type:



MovieClip.prototype.easeX= function(x){
this.onEnterFrame = function(){
this._x = x-(x-this._x)/1.2;
if(Math.abs(x-this._x) <= 1){
delete this.onEnterFrame;
this._x = x;
}
}
}

images = new Array();
xml_file = "images.xml";

xmlload = new XML();
xmlload.ignoreWhite = true;
xmlload.onLoad = function(ok) {
if (ok) {
count = this.firstChild.childNodes.length;
for (var i = 0; i<count; i++) {
curNode = this.firstChild.childNodes[i];
images[i] = {path:curNode.childNodes[0].firstChild.nodeValue,link:curNode.childNodes[1].firstChild.nodeValue,caption:curNode.childNodes[2].firstChild.nodeValue};
}
boot();
} else {
trace("Could not load "+xml_file+".");
}
};
xmlload.load(xml_file);

// ------------------------------------------------------------

spacing = 1;
boot = function(){
for(var i=0;i<images.length;i++){
mc = container.attachMovie("thumbMC","thumb"+i,i);
loader = mc.loader;
aux = mc.aux;
mc._x = i*(150+spacing);
mc.loader.loadMovie(images[i].path);
mc.aux.onEnterFrame = function(){
if(this._parent.loader._width > 0){
delete this.onEnterFrame;
this._parent.onRelease = function(){

}
}
}
}
setRollOver();
}
setRollOver = function(){
this.onEnterFrame = function(){
if(this.mask.hitTest(_root._xmouse,_root._ymouse)) {
slideMenu();
}
}
}
slideMenu = function(){
diffspacing = 20;
diff = _root._xmouse - (this._x+diffspacing);
scale = diff*100/(this.mask._width-2*diffspacing); // once to compensate, another to add
scale = Math.max(0,Math.min(100,scale)); // confine within 0->100
target = -scale*(this.container._width-this.mask._width)/100;
this.container.easeX(target);
this.arrows.easeX(diff);

}


Nothing loads ???????
What did I wrong here?

pacno
June 9th, 2005, 02:17 PM
Thank's for the file, but I can't get it to work.....:?
Tried to change it to a horizontal type:



MovieClip.prototype.easeX= function(x){
this.onEnterFrame = function(){
this._x = x-(x-this._x)/1.2;
if(Math.abs(x-this._x) <= 1){
delete this.onEnterFrame;
this._x = x;
}
}
}

images = new Array();
xml_file = "images.xml";

xmlload = new XML();
xmlload.ignoreWhite = true;
xmlload.onLoad = function(ok) {
if (ok) {
count = this.firstChild.childNodes.length;
for (var i = 0; i<count; i++) {
curNode = this.firstChild.childNodes[i];
images[i] = {path:curNode.childNodes[0].firstChild.nodeValue,link:curNode.childNodes[1].firstChild.nodeValue,caption:curNode.childNodes[2].firstChild.nodeValue};
}
boot();
} else {
trace("Could not load "+xml_file+".");
}
};
xmlload.load(xml_file);

// ------------------------------------------------------------

spacing = 1;
boot = function(){
for(var i=0;i<images.length;i++){
mc = container.attachMovie("thumbMC","thumb"+i,i);
loader = mc.loader;
aux = mc.aux;
mc._x = i*(150+spacing);
mc.loader.loadMovie(images[i].path);
mc.aux.onEnterFrame = function(){
if(this._parent.loader._width > 0){
delete this.onEnterFrame;
this._parent.onRelease = function(){

}
}
}
}
setRollOver();
}
setRollOver = function(){
this.onEnterFrame = function(){
if(this.mask.hitTest(_root._xmouse,_root._ymouse)) {
slideMenu();
}
}
}
slideMenu = function(){
diffspacing = 20;
diff = _root._xmouse - (this._x+diffspacing);
scale = diff*100/(this.mask._width-2*diffspacing); // once to compensate, another to add
scale = Math.max(0,Math.min(100,scale)); // confine within 0->100
target = -scale*(this.container._width-this.mask._width)/100;
this.container.easeX(target);
this.arrows.easeX(diff);

}


Nothing loads ???????
What did I wrong here?

Voetsjoeba
June 9th, 2005, 02:27 PM
Wait wait wait - did it work vertically ?

Voetsjoeba
June 9th, 2005, 02:27 PM
Wait wait wait - did it work vertically ?

pacno
June 10th, 2005, 03:57 AM
Yes, it did, but without caption and arrows, so I tried to implement

this.arrows.easeX(diff); - for the arrows
....nodeValue,caption:curNode.childNodes[2].firstChild.nodeValue}; for the caption

kay2464
June 10th, 2005, 01:47 PM
I have the Flashlevel Navigation working as its own .swf, but when I include it within another movie, which then opens into the root movie, I'm not sure how to edit the paths correctly. A bit lost here, being so new at this. Any advice?

Here's the code I have currently (for a horizontal version):



MovieClip.prototype.easeX = function(x) {
this.onEnterFrame = function() {
this._x = x-(x-this._x)/1.2;
if (Math.abs(x-this._x)<=1) {
delete this.onEnterFrame;
this._x = x;
}
};
};
images = new Array();
xml_file = "images.xml";
xmlload = new XML();
xmlload.ignoreWhite = true;
xmlload.onLoad = function(ok) {
if (ok) {
count = this.firstChild.childNodes.length;
for (var i = 0; i<count; i++) {
curNode = this.firstChild.childNodes[i];
images[i] = {path:curNode.childNodes[0].firstChild.nodeValue,link:curNode.childNodes[1].firstChild.nodeValue,caption:curNode.childNodes[2].firstChild.nodeValue};
}
boot();
} else {
trace("Could not load "+xml_file+".");
}
};
xmlload.load(xml_file);
// ------------------------------------------------------------
spacing = 12;
boot = function () {
for (var i = 0; i<images.length; i++) {
mc = container.attachMovie("thumbMC", "thumb"+i, i);
mc._x = i*(55+spacing);
mc.path = images[i].path;
mc.link = images[i].link;
mc.over.captionMC.caption.text = images[i].caption;
}
setRollOver();
};
setRollOver = function () {
this.onEnterFrame = function() {
if (this.mask.hitTest(_root._xmouse, _root._ymouse)) {
slideMenu();
}
};
};
slideMenu = function () {
diffspacing = 25;
diff = _root._xmouse - (this._x+diffspacing);
scale = diff*100/(this.mask._width-2*diffspacing); // once to compensate, another to add
scale = Math.max(0,Math.min(100,scale)); // confine within 0->100
target = -scale*(this.container._width-this.mask._width)/100;
this.arrows.easeX(diff);
this.container.easeX(target);
};

penguin
June 10th, 2005, 03:32 PM
what do I need to change if I am doing it horizontal.

kay2464
June 10th, 2005, 07:30 PM
I know I'm missing something pathetic here.. but no matter what I can't get the actual thumbs to show up when I add the scroller to another stage, and then load that movie from the _root. I don't know where to change the paths and am going a little mad over it, after too many attempts. What am I missing?

Also, is there a way to keep the arrows in line with the mouse despite the padding on the first and last images?

Thanks guys.

kay2464
June 13th, 2005, 10:57 PM
K, found some answers (thanks Penguin). Now I have another question...

How can I set up the xml sheet and the "thumbMC" so I can load 4 different images (or swfs) into separate containers at the same time (mcLG, mcM1, mcM2, mcM3).

Right now, I have this code in the "thumbMC":

loader.onRelease = function() {
image = this._parent._parent._parent._parent.mcLG;
image.loadMovie (this._parent.link);
};



Any advice?

simplistik
June 13th, 2005, 11:55 PM
K, found some answers (thanks Penguin). Now I have another question...

How can I set up the xml sheet and the "thumbMC" so I can load 4 different images (or swfs) into separate containers at the same time (mcLG, mcM1, mcM2, mcM3).

Right now, I have this code in the "thumbMC":

loader.onRelease = function() {
image = this._parent._parent._parent._parent.mcLG;
image.loadMovie (this._parent.link);
};



Any advice?
LoL... don't do it... that's my advice. You guys are askin to turn a Pinto into a Lamborgini. Made 3 different navigations and you guys still aren't pleased. To load from the same XML you need to add nodes then reference them correctly. What will want to do is use 4 different XML documents. That'd be the easiest way.

kay2464
June 14th, 2005, 02:16 PM
Thanks for the reply Simplistik. But by no means would I credit it with merely "Pinto status". The flashlevel navigation is a very cool piece!! Kudos! Just that I had intended to use it this way all along, but am new at this... so I'm learning. Is it too hard to do the way you suggested? I wouldn't know how to begin with adding nodes and referencing them. Any help?

Thanks again! :be:

booler
June 14th, 2005, 02:20 PM
check out the XML tutoials on this site there are some really good refernces there they sure helped me out alot people are overwhelmed by XML sometimes but for tasks like this and the xml photogallery XML isn't really that hard to understand

http://www.kirupa.com/web/index.htm

check out the PHP/XML in flash section really good primers in there

kay2464
June 14th, 2005, 02:41 PM
thanks booler! will do.

pacno
June 17th, 2005, 04:29 AM
Still doesn't work for me.
Do anybody have a horizontally example for me?

kay2464
June 17th, 2005, 12:18 PM
Pacno - did you download gnu's example from this thread (page 4)?

simplistik
June 17th, 2005, 12:34 PM
Post #47 Pacno... it's only page 2 for me so if you have it the way I do saying page 4 means nothing... so look at post #47. And kay did you figure out how to add the nodes, is everything working good? You'll have to add a little bit more to the coding but it shouldn't be to rough.

pacno
June 17th, 2005, 12:35 PM
Yes, I did, but was working on that problem with the padding of the first and last thumb (post # 67) and the loading of the xml in correct array (thumb 1, thumb 2 and so on).

I think I messed something up and now nothing work anymore....
Any suggestions for that?

kay2464
June 17th, 2005, 01:31 PM
Whoops! Thanks for correcting that Simplistick (referencing the post as opposed to the page).

As for the nodes... yes, I did get those working and have 5 images or swf files loading, but now I have another problem trying to attach a URL to one of those images being loaded:
http://www.kirupa.com/forum/showthread.php?t=93544&referrerid=26919

If you have any suggestions... please fire ahead. (I need all the help I can get understanding this stuff, as I don't think I have anything in the right place.) I tried natronp's suggestion, but no luck.

This is my current AS (minus that for the thumbMC):

MovieClip.prototype.easeX = function(x) {
this.onEnterFrame = function() {
this._x = x-(x-this._x)/1.2;
if (Math.abs(x-this._x)<=1) {
delete this.onEnterFrame;
this._x = x;
}
};
};
images = new Array();
xml_file = "images.xml?"+Math.round(Math.random()*10000);
xmlload = new XML();
xmlload.ignoreWhite = true;
xmlload.onLoad = function(ok) {
if (ok) {
count = this.firstChild.childNodes.length;
for (var i = 0; i<count; i++) {
var curNode = xmlload.firstChild.childNodes[i];
var PDFurl = curNode.childNodes[8].PDFurl;

images[i] = {thumb:curNode.childNodes[0].firstChild.nodeValue,
link:curNode.childNodes[1].firstChild.nodeValue,
caption:curNode.childNodes[2].firstChild.nodeValue,
imageLG:curNode.childNodes[3].firstChild.nodeValue,
imageM1:curNode.childNodes[4].firstChild.nodeValue,
imageM2:curNode.childNodes[5].firstChild.nodeValue,
imageM3:curNode.childNodes[6].firstChild.nodeValue,
imagePDF:curNode.childNodes[7].firstChild.nodeValue,
PDFurl:curNode:childNodes[8].firstChild.nodeValue};

PDFurl.mcTechSteps.onRelease = function () {
getURL(this._parent.PDFurl, _blank);
}
}
boot();
} else {
trace("Could not load "+xml_file+".");
}
};
xmlload.load(xml_file);
// ------------------------------------------------------------
spacing = 12;
boot = function () {
for (var i = 0; i<images.length; i++) {
mc = container.attachMovie("thumbMC", "thumb"+i, i);
mc._x = i*(55+spacing);
mc.thumb = images[i].thumb;
mc.link = images[i].link;
mc.over.captionMC.caption.text = images[i].caption;
mc.imageLG = images[i].imageLG;
mc.imageM1 = images[i].imageM1;
mc.imageM2 = images[i].imageM2;
mc.imageM3 = images[i].imageM3;
mc.imagePDF = images[i].imagePDF;

}

setRollOver();
};
setRollOver = function () {
this.onEnterFrame = function() {
if (this.mask.hitTest(_root._xmouse, _root._ymouse)) {
slideMenu();
}
};
};
slideMenu = function () {
diffspacing = 15;
diff = _root._xmouse - (this._x+diffspacing);
scale = diff*100/(this.mask._width-5*diffspacing);
scale = Math.max(0,Math.min(100,scale)); // confine within 0->100
target = -scale*(this.container._width-this.mask._width)/100;
this.arrows.easeX(diff);
this.container.easeX(target);
};

simplistik
June 17th, 2005, 01:56 PM
you need to add to
mc.link = images[i].link so it references the correct mcs just like you did the image links... I believe... although I could be wrong.

kay2464
June 17th, 2005, 02:47 PM
I had tried that, but it didn't work. However it may be part of the problem, just that something else is wrong as well.

mayan
June 26th, 2005, 12:21 PM
hey i really like this :D great work!

urm is there any chance that i could give actions when the thumbs are pressed rather than them just being hyperlinks

so for instance i could load another mc etc when a buttons clicked

Thanks

Mayan

simplistik
June 26th, 2005, 12:56 PM
hey i really like this :D great work!

urm is there any chance that i could give actions when the thumbs are pressed rather than them just being hyperlinks

so for instance i could load another mc etc when a buttons clicked

Thanks

Mayan
Read all the posts it's we've already explained how to do it.