[Boblin]

Hallo liebe Gemeinde,

ich baue mir gerade eine HP auf und stoße nun auf ein kleines Problem. Bisher habe ich mir Flash weitestgehend selbst beigebracht, aber für folgendes Problem komme ich nicht weiter. Ich möchte einen Imageslider bauen, der sich nach links oder rechts verschiebt, je nachdem wo der Mousezeiger sich gerade befindet. Der Imageslider besteht aus circa 30 Bildern und soll als Thumbnail für das größere Foto dienen.

Hier eine Beispielseite:

http://www.isabellnwedin.com/

Normale Galerien habe ich schon gebaut, nur gefallen sie mir nicht, weswegen ich etwas Dynamik in meine Seite bringen möchte. Im Forum und in den Tutorials bin ich nicht fündig geworden und die Angebote von Simpleviewer haben mir auch nicht so recht gefallen. Da ich im Moment nicht weiterkomme bitte ich um eure Hilfe.

[monika_g]

Warum muss es Flash sein? Es gibt doch dutzende Gallery Viewer für jQuery & Co?

[Boblin]

Ich baue meine HP komplett auf Flash auf. Habe mittlerweile versucht die Bilder über XML in Flash zu integrieren, aber leider sehe ich weder die Bilder noch die Thumbs. Hier mal mein Actionscript für Flash sowie der XML Code, ich weiß nicht wo der Fehler steckt (beide Dateien und Fotos liegen im selben Ordner):


[/b]ACTIONSCRIPT

import flash.net.URLLoader;
import flash.net.URLRequest;
import flash.display.Loader;

var galleryXML:XML;
var xmlLoader:URLLoader;
var xmlRequest:URLRequest;

xmlLoader = new URLLoader();
xmlRequest = new URLRequest('galleryXML.xml');

var numOfImages:int;
var currImage:int = 0;

var imageLoader:Loader;
var imageRequest:URLRequest;

imageLoader = new Loader();

var imagesList:Array = new Array();
var loadedImages:Array = new Array();

xmlLoader.load(xmlRequest);
xmlLoader.addEventListener(Event.COMPLETE,onComplete);

function onComplete(e:Event):void
{
galleryXML = new XML(xmlLoader.data);
numOfImages = galleryXML.photo.length();
var i:int = numOfImages;
while(i--)
{
imagesList.push(String(galleryXML.photo[i].url));
}
startLoading();
imageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE,loadNext);
}

function startLoading():void{
imageRequest = new URLRequest(imagesList[currImage]);
imageLoader.load(imageRequest);
}

function loadNext(e:Event):void
{
if(currImage == numOfImages-1)
{
loadedImages.push(imageLoader.content);
imageLoader.contentLoaderInfo.removeEventListener

(Event.COMPLETE,loadNext);

var i:int = galleryXML.photo.length();
container = new Sprite();
while(i--)
{
var rect:Bitmap = loadedImages[i];
var bitmapCont:Sprite = new Sprite();
bitmapCont.addChild(rect);
container.addChild(bitmapCont);
bitmapCont.x = i * 120;
bitmapCont.width = 100;
bitmapCont.height = 60;
bitmapCont.addEventListener(MouseEvent.CLICK,draw);
bitmapCont.addEventListener(MouseEvent.MOUSE_OVER,overFunc);
bitmapCont.addEventListener(MouseEvent.MOUSE_OUT,outFunc);
}
addChild(container);
container.y = 325;
addEventListener(Event.ENTER_FRAME,update);

return;
}
loadedImages.push(imageLoader.content);
currImage++;
imageRequest = new URLRequest(imagesList[currImage]);
imageLoader.load(imageRequest);
}

function overFunc(e:Event):void
{
e.currentTarget.width = 110;
e.currentTarget.height = 70;
}

function outFunc(e:Event):void
{
e.currentTarget.width = 100;
e.currentTarget.height = 60;
}


import flash.display.Sprite;
import flash.events.Event;
import flash.display.BitmapData;
import flash.display.Bitmap;
import flash.events.MouseEvent;

var bd:BitmapData = new BitmapData(1022,767);

var b:Bitmap = new Bitmap(bd);
b.x = 75;
b.y = 15;
b.width = 400;
b.height = 300;
addChild(b);
var container:Sprite

var vel:Number = 0;
var acc:Number = 0;
var damp:Number = 0.95;


function update(e:Event):void
{
acc = 0;
if(mouseX<150)
acc = - - - -0.5;
if(mouseX>400)
acc = - - -0.5;
vel +=acc;
vel*=damp;
container.x += vel;
if(container.x>0)
container.x = 0;
if(container.x < 550-container.width)
container.x = 550-container.width;
}

function draw(e:MouseEvent):void
{
bd.draw(Sprite(e.currentTarget));
}



[b]XML

<?xml version="1.0" encoding="utf-8" ?>
- <gallery>
- <photo>
<url>Garden.jpg</url>
<title>Garden</title>
<description>lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum</description>
</photo>
- <photo>
<url>Waterfall.jpg</url>
<title>Garden</title>
<description>lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum</description>
</photo>
- <photo>
<url>Winterleaves.jpg</url>
<title>Garden</title>
<description>lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum</description>
</photo>
</gallery>

[monika_g]

[Boblin]

Da ich alles selber mache und ich von der Materie anfangs überhaupt keine Ahnung hatte, fand ich es für mich leicht zu erlernen. Mit meiner HP bin ich ziemlich weit gekommen nur stehe ich vor besagten Problem. Aber ich danke dir dennoch für deinen konstruktiven Beitrag und werde mich weiter durch den Wald der Tutorials schlagen in der Hoffnung etwas geeignetes zu finden.

[monika_g]

Ich hab das auch mal gesucht (ist ne Weile her) und habe es damals nur in einem Buch gefunden ("Flash fast forward"). Es könnte also sein, dass sich Dein Problem gar nicht so einfach lösen lässt.

Eine andere Sache ist eben: Wenn alle Inhalte Deiner Homepage nur innerhalb von Falsh sichtbar sind, vergibst Du Dir eine Menge. Es wird von Suchmaschinen nicht vernünftig indiziert, kann von den mobilen i-Geräten gar nicht angesehen werden und evtl. tut sich auch nicht jeder die Ladezeit an.

Es ist schön für Dich, dass Du damit Flash gelernt hast. Aber die Zeit wäre wahrscheinlich sinnvoller investiert gewesen, wenn Du stattdessen andere Techniken gelernt hättest (jQuery z.B).

Ich finde Flash-Websites übrgiens toll. Wenn sie Techniken zeigen, die adäquat sind (betrifft vor allem gut gemachte Nutzerinterfaces, e-Learning-Anwendungen, Spiele, Kunst). Für stinknormale Websites und Galerien gibt es sinnvollere Techniken.