Avatar billede zaditor Nybegynder
13. august 2006 - 12:59 Der er 29 kommentarer og
1 løsning

crossfading slideshow skal kunne maskes

Hej eksperter!

Jeg faldt over et slideshow, som jeg vil lege lidt med.. Kilde: http://whatdoiknow.org/archives/001629.shtml

Scriptet er:

/****************************/
/* Crossfading slide show  */
/* Author: Todd Dominey    */
/* http://whatdoiknow.org  */
/* http://domineydesign.com */
/****************************/

// set random # variables - each must be 0 for first 'while' loop below
var randomNum = 0;
var randomNumLast = 0;

// parent container
var container_mc = this.createEmptyMovieClip("container",0);
// movie clip containers
container_mc.createEmptyMovieClip("loader1_mc",2);
container_mc.createEmptyMovieClip("loader2_mc",1);

// preload watcher
this.createEmptyMovieClip("watcher_mc",100);

// load xml
images_xml = new XML();
images_xml.ignoreWhite=true;
images_xml.onLoad = parse;
images_xml.load("images.xml");

function parse(success) {
    if (success) {
        imageArray = new Array();
        var root = this.firstChild;
        _global.numPause = Number(this.firstChild.attributes.timer * 1000);
        _global.order = this.firstChild.attributes.order;
        _global.looping = this.firstChild.attributes.looping;
        _global.fadetime = Number(this.firstChild.attributes.fadetime);
        _global.xpos = Number(this.firstChild.attributes.xpos);
        _global.ypos = Number(this.firstChild.attributes.ypos);
        var imageNode = root.lastChild;
        var s=0;
        while (imageNode.nodeName != null) {
            imageData = new Object;
            imageData.path = imageNode.attributes.path;
            imageArray[s]=imageData;
            imageNode = imageNode.previousSibling;
            s++;
        }
        // place parent container
        container_mc._x = _global.xpos;
        container_mc._y = _global.ypos;
        // parse array
        imageArray.reverse();
        imageGen(imageArray);
    } else {
        trace('problem');
    }
}

// depth swapping
function swapPlace(clip,num) {
    eval(clip).swapDepths(eval("container_mc.loader"+num+"_mc"));
}

function loadImages(data,num) {
    if (i==undefined || i == 2) {
        i=2;
        createLoader(i,data,num);
        i=1;
    } else if (i==1) {
        createLoader(i,data,num);
        i=2;
    }
}
function createLoader(i,data,num) {
    thisLoader=eval("container_mc.loader"+i+"_mc");
    thisLoader._alpha=0;
    thisLoader.loadMovie(data[num].path);
    watcher_mc.onEnterFrame=function () {
        var picLoaded = thisLoader.getBytesLoaded();
        var picBytes = thisLoader.getBytesTotal();
        if (isNaN(picBytes) || picBytes < 4) {
            return;
        }
        if (picLoaded / picBytes >= 1) {
            swapPlace("container_mc.loader2_mc",1);
            alphaTween = new mx.transitions.Tween(thisLoader, "_alpha", mx.transitions.easing.Regular.easeOut,0,100,_global.fadetime,true);
            timerInterval = setInterval(imageGen,_global.numPause,data);
            delete this.onEnterFrame;
        }
    }
}
function imageGen(data) {
    // random, or sequential?
    if (_global.order=="random") {
        // choose random # between 0 and total number of images
        while (randomNum == randomNumLast) {
            randomNum = Math.floor(Math.random() * data.length);
            trace(randomNum);
        }
        loadImages(data,randomNum);
        randomNumLast = randomNum;
    } else if (_global.order=="sequential") {
        // start at 0, increment to total number of images, then drop back to zero when done
        if (p==undefined || p==data.length && _global.looping=="yes") { p=0; } else { break; }
        loadImages(data,p);
        p++;
    } else {
        trace ("order attribute in xml isn't correct - must specify either 'random' or 'sequential'");
    }
    clearInterval(timerInterval);
}
stop();

Når billederne loader ind, loades de altid ind oven på alt andet... Kan man (ved lidt ændringer i koden) gøre sådan, at det lægger nedenunder noget andet? Sådan at jeg evt. kunne køre en mask hen over det?... Har det noget at gøre med den depth de forskellige mc får?.. Som det måske fremgår, så er jeg stadigvæk lidt rookie i det, men ja, vil gøre et forsøg :)
Avatar billede zaditor Nybegynder
13. august 2006 - 14:13 #1
Anybody?
Avatar billede zaditor Nybegynder
13. august 2006 - 15:05 #2
Der må da sidde en Flash-haj, der lige ka' greje det? :P
Avatar billede zaditor Nybegynder
13. august 2006 - 15:59 #3
Det kan da ikke passe
Avatar billede mat Nybegynder
13. august 2006 - 16:55 #4
Jeps det er dybdesorteringen. Alt hvad du sidder og "tegner" i flash bliver lagt i z index under 0, alt du laver med kode ligger normalt i dybder over 0. I ovenstående ligges "container_mc" i dybde 0, så du skal vel egentlig bare lægge dit indhold over denne dybde?

Lav det du vil have forrest til et movieclip og skriv;

mit_movieclip.swapDepths(1000);

Skulle jeg mene...

mvh mat
Avatar billede zaditor Nybegynder
13. august 2006 - 17:02 #5
Okay - jeg prøver lige.. Melder lige tilbage senere så :)
Avatar billede zaditor Nybegynder
13. august 2006 - 17:11 #6
Hmm.. Jeg er lidt i tvivl.. For altså.. Det, som jeg egentlig gern vil ha' lavet er, at min mask-animation også skal køre henover de billeder, som bliver loaded via ovenstående kode.. Pt. er det kun alt andet, der bliver "masket".. Ved ik', om du forstår?
Avatar billede zaditor Nybegynder
13. august 2006 - 17:13 #7
Jeg har lige prøvet på at gi' min mask-animation en instance name, "mask_mc", og så skrevet mask_mc.swapDepths(1000); i mit actions-layer
Avatar billede mat Nybegynder
13. august 2006 - 17:19 #8
Hvis du vil maske et movieclip der laves i runtime, skal du bruge setMask, noget ala;

container_mc.setMask(mask_mc);
Avatar billede zaditor Nybegynder
13. august 2006 - 17:23 #9
hvor er det så præcist i den ovenstående kode, jeg skal indsætte det? - det ka' måske bare skrives uden for det?
Avatar billede mat Nybegynder
13. august 2006 - 17:25 #10
det skal jo ihvertfald stå efter instansieringen af container_mc :)
Avatar billede zaditor Nybegynder
13. august 2006 - 18:05 #11
hmm... Jeg kan ik' få container_mc og så det andet mc til at køre sammen.. Altså kan ik' få masken til at køre på dem begge..
Avatar billede zaditor Nybegynder
13. august 2006 - 18:29 #12
container_mc.setMask(mask_mc);
menubg_mc.setMask(mask_mc);

har jeg skrevet, men den ta'r kun og kører masken på menubg_mc'et ?
Avatar billede mat Nybegynder
13. august 2006 - 18:34 #13
Ifølge hjælpen (F1) så; "However, you can't use the same mask for multiple masks[..]", så det forklarer vel lidt?
Avatar billede zaditor Nybegynder
13. august 2006 - 18:40 #14
hmm... Nå, jamen så ska' jeg vel til at lave to masks?
Avatar billede zaditor Nybegynder
13. august 2006 - 18:42 #15
eller hva'?
Avatar billede mat Nybegynder
13. august 2006 - 18:42 #16
Det kunne tyde på det, eller du kan indlejre dine movieclips i hinanden, så du kun behøver maske det ene (fordi det andet reelt ligger i det første).
Avatar billede zaditor Nybegynder
13. august 2006 - 18:46 #17
Jaeh.. Men hvordan gør jeg så lige det med koden oven over?.. er det så noget med, at jeg gør som følger:

// parent container
var menubg_mc.container_mc = this.createEmptyMovieClip("container",0);
// movie clip containers
menubg_mc.container_mc.createEmptyMovieClip("loader1_mc",2);
menubg_mc.container_mc.createEmptyMovieClip("loader2_mc",1);

Eller er jeg helt forkert på den?
Avatar billede mat Nybegynder
13. august 2006 - 18:48 #18
Næh det ser da meget rigtigt ud.
Avatar billede zaditor Nybegynder
13. august 2006 - 18:51 #19
**Error** Scene=Scene 1, layer=actions, frame=1:Line 7: Syntax error.
    var menubg_mc.container_mc = this.createEmptyMovieClip("container",0);

Total ActionScript Errors: 1     Reported Errors: 1

Får jeg..?
Avatar billede mat Nybegynder
13. august 2006 - 18:56 #20
Hov ja, det er mig der sover..det skal nok være;

container_mc = menubg_mc.createEmptyMovieClip("container",0);

og da container_mc så holder på en reference til "container" i "menubg_mc", bør det ikke være nødvendigt at ændre de to linier under;

container_mc.createEmptyMovieClip("loader1_mc",2);
container_mc.createEmptyMovieClip("loader2_mc",1);

..gætter jeg umiddelbart på.
Avatar billede zaditor Nybegynder
13. august 2006 - 18:57 #21
Ved du hva', jeg prøver sq lige :D
Avatar billede zaditor Nybegynder
13. august 2006 - 19:11 #22
Super.. Men jeg har lige et spørgsmål?.. Hvordan får jeg så billederne vist i nederste venstre hjørne af mit menubg_mc?.. Jeg har fået det til at virke sådan her:

_global.xpos = Number(this.firstChild.attributes.xpos);
_global.ypos = Number(this.firstChild.attributes.ypos);

De to ovenstående linjer har jeg fjernet, og så har jeg ændret følgende:

        // place parent container
        container_mc._x = -448;
        container_mc._y = 58;

Så passer det med, at den sidder, hvor den skal.. Men hele mit mc er 700px bred og 300px høj.. Er der ik' en smartere måde at gøre det på?
Avatar billede zaditor Nybegynder
13. august 2006 - 19:12 #23
Og ja, sorry.. Nu stiller jeg yderliger spørgsmål inde i mit spørgsmål.. Gi'r gerne flere point..
Avatar billede mat Nybegynder
13. august 2006 - 19:14 #24
Hehe jeg er ikke sikker på at jeg forstår spørgsmålet? Spørger du bare om der er en smartere måde at sætte koordinaterne på?
Avatar billede zaditor Nybegynder
13. august 2006 - 19:18 #25
Ja, for jeg synes det er lidt sjovt, at jeg skal sætte den til -448.. Burde det egentlig ikke bare være 0 på x-aksen og så det antal px nedad på y-aksen, jeg vil?
Avatar billede mat Nybegynder
13. august 2006 - 19:22 #26
Well det er jo sikkert relateret til movieclipsnes relative positioner i hinanden, eller noget?
Avatar billede zaditor Nybegynder
13. august 2006 - 19:24 #27
Ja, det så jeg også lige nu.. Nå men.. Tusind tak for hjælpen.. Vil du svare, så du ka' få dine veltjente point?
Avatar billede mat Nybegynder
13. august 2006 - 19:25 #28
Det iorden :)
Avatar billede zaditor Nybegynder
19. august 2006 - 18:46 #29
Nu har jeg smidt den der preloader ind (som jeg refererede til) i den swf, som jeg loader ind via min enter-knap.. Den virker sådan set fint nok.. Den loader selve mit content ind, men hvis der er behov for, at den skal køre preloaderen, så gider den ik' loade de billeder ind, som jeg loader via følgende kode. Men alt andet loader den ind.

//*** Billed-load ***//
// set random # variables - each must be 0 for first 'while' loop below
var randomNum = 0;
var randomNumLast = 0;

// parent container
var container_mc = menubg_mc.createEmptyMovieClip("container",0);
// movie clip containers
container_mc.createEmptyMovieClip("loader1_mc",2);
container_mc.createEmptyMovieClip("loader2_mc",1);

// preload watcher
this.createEmptyMovieClip("watcher_mc",100);

// load xml
images_xml = new XML();
images_xml.ignoreWhite=true;
images_xml.onLoad = parse;
images_xml.load("images.xml");

function parse(success) {
    if (success) {
        imageArray = new Array();
        var root = this.firstChild;
        _global.numPause = Number(this.firstChild.attributes.timer * 1000);
        _global.order = this.firstChild.attributes.order;
        _global.looping = this.firstChild.attributes.looping;
        _global.fadetime = Number(this.firstChild.attributes.fadetime);
        //*** _global.xpos = Number(this.firstChild.attributes.xpos);
        //*** _global.ypos = Number(this.firstChild.attributes.ypos);
        var imageNode = root.lastChild;
        var s=0;
        while (imageNode.nodeName != null) {
            imageData = new Object;
            imageData.path = imageNode.attributes.path;
            imageArray[s]=imageData;
            imageNode = imageNode.previousSibling;
            s++;
        }
        // place parent container
        container_mc._x = -448;
        container_mc._y = 58;
       
        // parse array
        imageArray.reverse();
        imageGen(imageArray);
    } else {
        trace('problem');
    }
}

// depth swapping
function swapPlace(clip,num) {
    eval(clip).swapDepths(eval("container_mc.loader"+num+"_mc"));
}

function loadImages(data,num) {
    if (i==undefined || i == 2) {
        i=2;
        createLoader(i,data,num);
        i=1;
    } else if (i==1) {
        createLoader(i,data,num);
        i=2;
    }
}
function createLoader(i,data,num) {
    thisLoader=eval("container_mc.loader"+i+"_mc");
    thisLoader._alpha=0;
    thisLoader.loadMovie(data[num].path);
    watcher_mc.onEnterFrame=function () {
        var picLoaded = thisLoader.getBytesLoaded();
        var picBytes = thisLoader.getBytesTotal();
        if (isNaN(picBytes) || picBytes < 4) {
            return;
        }
        if (picLoaded / picBytes >= 1) {
            swapPlace("container_mc.loader2_mc",1);
            alphaTween = new mx.transitions.Tween(thisLoader, "_alpha", mx.transitions.easing.Regular.easeOut,0,100,_global.fadetime,true);
            timerInterval = setInterval(imageGen,_global.numPause,data);
            delete this.onEnterFrame;
        }
    }
}
function imageGen(data) {
    // random, or sequential?
    if (_global.order=="random") {
        // choose random # between 0 and total number of images
        while (randomNum == randomNumLast) {
            randomNum = Math.floor(Math.random() * data.length);
            trace(randomNum);
        }
        loadImages(data,randomNum);
        randomNumLast = randomNum;
    } else if (_global.order=="sequential") {
        // start at 0, increment to total number of images, then drop back to zero when done
        if (p==undefined || p==data.length && _global.looping=="yes") { p=0; } else { break; }
        loadImages(data,p);
        p++;
    } else {
        trace ("order attribute in xml isn't correct - must specify either 'random' or 'sequential'");
    }
    clearInterval(timerInterval);
}


Hvad er det, der gør, at den så ik' gider vise billederne..?
Avatar billede zaditor Nybegynder
19. august 2006 - 18:47 #30
haha - forkert sted - ups :D
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
IT-kurser om Microsoft 365, sikkerhed, personlig vækst, udvikling, digital markedsføring, grafisk design, SAP og forretningsanalyse.

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester