XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   (X)HTML (http://xhtmlforum.de/forumdisplay.php?f=72)
-   -   Zufallsbild mitohne xml (http://xhtmlforum.de/showthread.php?t=70261)

cxlog 13.11.2013 15:45

Zufallsbild mitohne xml
 
Hallo und Entschuldigung für mein Halbwissen.

Ich habe einen Imageslider der von nun an zufällige Bilder laden soll.
Er läd bis eine xml aus wo der Pfad der Bilder verzeichnet ist. Ich bekomms nicht hin gegoogelte "Zufallsscripte" richtig zu implementieren.

Sind es nur ein paar glorreiche Zeilen die es brauch oder lässt sich das in diesem Imageslider nicht integrieren?


hier der Code des Imagesliders, des in einer .swf Datei ausgelesen wird:
---------
import gs.TweenLite;
import gs.easing.*;
stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;
//main variables
//sprites for hlding the images
var container:Sprite = new Sprite();
var containerIn:Sprite = new Sprite();

//xml variables
var xmlLoader:URLLoader;
var xml:XML;
var xmlList:XMLList;
var totalEntries:int;//total nubers of images, this is set after the xml is loaded
var arBigImagesPath:Array = new Array();//the path of the images, this is set after the xml is loaded
var currentId:int = 0;//the current image id, this is used for navigation, when an image is pressed
var countImg:int;//this is used for the timer to load images, each time an imgage is loaded this is increased by one
var mcAr:Array = new Array();//array to hold the image MovieClips

//positioning variables
var offsetH:Number = 50;
var imagesHeight:Number;
var spacing:Number = 70;

//conditional variables
var firstTimeLoading:Boolean = true;
var alphaToStart:Number = .15;

//loading the xml file
initXML("load/load.xml");
function initXML(path:String):void {
xmlLoader = new URLLoader();
xmlLoader.load(new URLRequest(path));
xmlLoader.addEventListener(Event.COMPLETE,onComple te);
function onComplete(e:Event):void {
xml = new XML(e.target.data);
xmlList = xml.image;
totalEntries = xml.image.length();
createContainer();
loadImage(xml.image.big_image[countImg]);
}
}

//create main containerIn, this is the Sprite that holds the images
function createContainer():void {
container = new Sprite();
imagesHeight = stage.stageHeight - offsetH;
container.y = offsetH/2;
addChild(containerIn);
addChild(container);
stage.addEventListener(Event.RESIZE,positionContin erAndOtherStuff);
}
//postition the main Sprite image holder
function positionContinerAndOtherStuff(e:Event):void {
imagesHeight = stage.stageHeight - offsetH;
container.y = offsetH/2;
resizeMcs();
navigate(currentId,true);
}
//function for loading the images
function loadImage(path:String):void {
var mc:MovieClip = new MovieClip();
loader_mc.txt.text = "LOADING 0%";
loader_mc.visible = true;
var loader:Loader = new Loader();
loader.load(new URLRequest(path));
loader.contentLoaderInfo.addEventListener(Event.CO MPLETE,handleComplete);
loader.contentLoaderInfo.addEventListener(Progress Event.PROGRESS,onProgress);
loader.contentLoaderInfo.addEventListener(IOErrorE vent.IO_ERROR,error);
function onProgress(e:ProgressEvent):void {
var percent:Number = e.target.bytesLoaded/e.target.bytesTotal;
loader_mc.txt.text = "LOADING IMAGE "+ (countImg +1) + "/" + totalEntries + " - " + Math.round(percent * 100) + "%";
}
function error(e:IOErrorEvent):void {
}
function handleComplete(e:Event) {
var bitamp1:Bitmap = new Bitmap();
bitamp1 = loader.content;
mc.id = countImg;
mc.addChild(bitamp1);
mc.alpha = 0;
mc.addEventListener(MouseEvent.MOUSE_DOWN,onMD);
mcAr.push(mc);
container.addChild(mc);
resizeMcs();
enableAll();
countImg ++;
if (countImg < totalEntries) {
loadImage(xml.image.big_image[countImg]);
}
if (firstTimeLoading) {
firstTimeLoading = false;
navigate(currentId,true);
TweenLite.to(mc,.4,{alpha:1,x:"-1",ease:Quad.easeOut});
} else{
TweenLite.to(mc,.4,{alpha:alphaToStart,ease:Quad.e aseOut});
}

loader.contentLoaderInfo.removeEventListener(Event .COMPLETE,handleComplete);
loader.contentLoaderInfo.removeEventListener(IOErr orEvent.IO_ERROR,error);
bitamp1 = null;
loader = null;
}
}
//LLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLfunctio n for size and position (this function positions and resizes each image)
function resizeMcs():void {
for (var i:int =0; i < mcAr.length; i++) {
redim(mcAr[i]);
if (i!=0) {
mcAr[i].x = mcAr[i-1].x + mcAr[i-1].width + spacing;
}
}
}
//navigate when the image is pressed
function onMD(e:MouseEvent):void {
currentId = e.currentTarget.id;
navigate(currentId,false);
}
function navigate(id:int,reseize:Boolean):void {
var xToGo:Number = 0;
for (var i:int =0; i < mcAr.length; i++) {
if (i <id) {
xToGo += (mcAr[i].width + spacing);
trace(xToGo);
}
if(id == i){
mcAr[i].getChildAt(0).smoothing = true;
TweenLite.to(mcAr[i],.4,{alpha:1,ease:Quad.easeOut});
}else{
mcAr[i].getChildAt(0).smoothing = false;
TweenLite.to(mcAr[i],.4,{alpha:alphaToStart,ease:Quad.easeOut});
}
}
trace(xToGo);
if (reseize) {
container.x =(xToGo * -1) + (stage.stageWidth/2 - mcAr[id].width/2);
} else {
TweenLite.to(container,.4,{x:(xToGo * -1) + (stage.stageWidth/2 - mcAr[id].width/2),ease:Quad.easeOut});
}
}

//disable/enable all
function disableAll():void {
root.mouseChildren = false;
}
function enableAll():void {
root.mouseChildren = true;
}

//this function resizez the images based on the broser resolution
function redim(mc) {
trace("redim");
var mcu = mc;
mcu.height = imagesHeight;
mcu.scaleX = mcu.scaleY;

}
-------------------


hier der Code der xml Datei:
------
<images>

<image>
<big_image>load/image/bild1.jpg</big_image>
</image>

<image>
<big_image>load/image/bild2.jpg</big_image>
</image>

</images>
-------

gabischatz 14.11.2013 18:57

Wo hast du den das her damit man sich das mal in Aktion ansehen kann.

cxlog 14.11.2013 19:06

so sieht das ganze dann als Slider aus.

Slider

explanator 14.11.2013 19:48

Ich seh nur das:
Zitat:


Zum Betreten des Online Portfolio benötigen Sie das neuste Adobe Flash Plugin, das Sie hier downloaden können!

Alternativ steht Ihnen eine Portfolio PDF zum download zur Verfügung.
Das ist aber nicht dein Ernst oder?

mymaksimus 14.11.2013 21:52

dsa ganze lässt sich genauso gut mir css machen.

cxlog 19.11.2013 22:46

hab mir schon gedacht das es auch ohne Flash zu lösen ist.
Da ich aber nicht über die nötigen Kentnisse verfüge versuche ich mit dem Baustein der ja sonst gut funktioniert zurecht zu kommen.

Wie lässt sich es denn mit css umsetzten? Damit meine ich den Zufallsgenerator.

explanator 20.11.2013 02:00

Mit CSS geht das nicht.
Aber mit Javascript.
siehe -> https://developer.mozilla.org/en-US/...ts/Math/random

cxlog 20.11.2013 11:55

math.random scheint mir geignet, aber wie lese ich den Container/ die Zahl aus und binde sie in "zufällige" einbindung der Dateien ein?

kann ich nicht auch einfach mit einer Syntax alle Bilder angeben und bei jedem laden (aus meiner xml) eine zufälligen rheinfolge schreiben?

Momentan läd meine xml die Dateien ganz strikt nacheinander ein und zeigt sie im Slider an


xml:
<image>
<big_image>load/image/bild1.jpg</big_image>
</image>

<image>
<big_image>load/image/bild2.jpg</big_image>
</image>


Alle Zeitangaben in WEZ +2. Es ist jetzt 10:53 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2021, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2020