Bilder links rechts scrollen

Nachtrag 11.03.2010 : Das Thema scheint jetzt zum Ende gekommen zu sein. Ich füge dem Beitrag die letzte Version 5 hinzu. Am Ende des Beitrages stehen alle Versionen zum Download bereit.

Dies ist die Beispieldatei für den Beitrag im Flashhilfe-Forum unter http://www.flashhilfe.de/forum/actionscript-3-0/anfaengerfrage-movieclip-ueber-button-in-eine-richtung-steuern-279435-279435.html

Zum Ende der Diskusion Version 5:

Erste Version:

Diese Datei zeigt wie man ganz einfach eine Reihe von Bildern nach link und rechts fahren läßt.

//Listener für Buttons
left_btn.addEventListener(MouseEvent.MOUSE_OVER, onMouseOver);
left_btn.addEventListener(MouseEvent.MOUSE_OUT, onMouseOut);
right_btn.addEventListener(MouseEvent.MOUSE_OVER, onMouseOver);
right_btn.addEventListener(MouseEvent.MOUSE_OUT, onMouseOut);

//Listener um band_mc zu Verschieben
addEventListener(Event.ENTER_FRAME, update);

//Laufrichtung für band_mc
var _dir:int = 0;
var _speed:int = 10;

/**
 * Setzt die Laufrichtung _dir
 */
function onMouseOver(evt:MouseEvent):void
{
	var theBtn:SimpleButton = evt.target as SimpleButton;

	switch (theBtn)
	{
		case left_btn:
			_dir = -1;
			break;
		case right_btn:
			_dir = 1;
			break;
	}
}

/**
 * Setzt die Laufrichtung auf 0
 */
function onMouseOut(evt:MouseEvent):void
{
	_dir = 0;
}

/**
 * Lässt band_mc in Richtung _dir bewegen
 */
function update(evt:Event):void
{
	//band_mc bewegen
	band_mc.x += (_dir * _speed);

	//position auf maximale Werte zurücksetzen
	var maxLeft:Number = left_btn.width>>2 + left_btn.x;
	if (band_mc.x > maxLeft)
		band_mc.x = maxLeft;

	var maxRight:Number = right_btn.x - (right_btn.width>>2);
	if (band_mc.x + band_mc.width < maxRight)
		band_mc.x = maxRight - band_mc.width;
}

Die Projekt-Dateien für das Scrollen findet ihr unter:
Bilder links-rechts scrollen erste Version.

Version 2 ist im Kommentar und nicht mehr als Datei vorhanden.

Bilder links-rechts scrollen V. 3

Bilder links-rechts scrollen V. 4

Bilder links-rechts scrollen V. 5


Teilen macht glücklich!
  • facebook
  • Twitter
  • Delicious
  • Digg
  • StumbleUpon
  • Google Bookmarks
  • email
  • RSS

Tags: , ,

4 Kommentare zu “Bilder links rechts scrollen”

  1. Stefan sagt:

    Super, danke. Wie kann ich das dahingehend erweitern, dass das Ende der Seiten mit einem weichen Abbremsen erreicht wird? :-)

  2. A. Khong sagt:

    So oder ähnlich kannst du am Randbereich langsamer werden.
    /**
    * Lässt band_mc in Richtung _dir bewegen
    */
    function update(evt:Event):void
    {
    //Begrenzung für links und rechts
    var maxLeft:Number = left_btn.width>>2 + left_btn.x;
    var maxRight:Number = right_btn.x - (right_btn.width>>2);

    //An den Randbereichen langsamer werden
    var dx:Number;
    if (_dir < 0)
    {
    dx = (band_mc.x + band_mc.width) - maxRight;
    if (dx < 50) _speed = 100 * dx / band_mc.width;
    }
    else if (_dir > 0)
    {
    dx = maxLeft - band_mc.x;
    if (dx < 50) _speed = 100 * dx / band_mc.width;
    }
    else
    {
    _speed = 10;
    }

    //band_mc in Richung _dir mit _speed bewegen
    band_mc.x += (_dir * _speed);

    //Auf maximale Werte zurücksetzen
    if (band_mc.x > maxLeft)
    band_mc.x = maxLeft;

    if (band_mc.x + band_mc.width < maxRight)
    band_mc.x = maxRight - band_mc.width;

    }

  3. Stefan sagt:

    Hey, vielen Dank! Das ging ja fix! Werde ich gleich mal ausprobieren :-)

  4. Birger sagt:

    Das ist ja echt ne coole Sache. Das werde ich bei Gelegenheit gleich auf meiner Seite testen. Dann kann ich endlich auch Produkte platzsparend anzeigen.
    Viele Dank
    birger

Kommentar hinterlassen

*