scrollgalerie

CREAGA

Erfahrenes Mitglied
Grüezi !

Habe mich von "Datic's" Page der scrollbaren Bildergallerie bedient (danke an dieser Stelle),
doch ich möchte dass die Leiste erst scrollt, wenn der Cursor über einem der gelben Pfeile
steht.... oder besser gesagt, ich will einfach den scrollbaren Bereich eingrenzen.

Wie bring ich das zustande? kennt vielleicht jemand ein tut, oder kann mir jemand sagen
wie und wo ich den code ändern soll.

PHP:
_global.slide = this;

var speed = 0;
var maxspeed = 16;
var damper = 8;
var gap = 30;
var overpic = false;
var finished = 0;

var leiste = new Array(2);

leiste[0] = container.attachMovie("bilderleiste", "leiste0", 1);
leiste[1] = container.attachMovie("bilderleiste", "leiste1", 2);

function nextOne() {
	finished ++;
	if (finished >= 2) go();
}

function go() {
	leiste[1]._x = leiste[0]._x + leiste[0]._width + gap;

	this.onEnterFrame = function() {
		if (!overpic) {
			speed +=  (-(_xmouse - mask._width / 2) / 15 - speed) / 5;
			if (speed < -maxspeed) speed = -maxspeed;
			if (speed > maxspeed) speed = maxspeed;
		} else {
			speed /= 1.4;
		}
		for (var i=0; i<leiste.length; i++) {
			leiste[i]._x += speed;
		}
		for (var i=0; i<leiste.length; i++) {
			if ((leiste[i]._x > mask._width) && speed > 0) moveLeft(i);
			if ((leiste[i]._x < -leiste[i]._width - gap) && speed < 0) moveRight(i);
		}
	}
}

function moveLeft(x) {
	if (x == leiste.length - 1) {
		leiste[x]._x = leiste[0]._x - leiste[x]._width - gap;
	} else {
		leiste[x]._x = leiste[x + 1]._x - leiste[x]._width - gap;
	}
}

function moveRight(x) {
	if (x == 0) {
		leiste[x]._x = leiste[leiste.length - 1]._x + leiste[leiste.length - 1]._width + gap;
	} else {
		leiste[x]._x = leiste[x - 1]._x + leiste[x - 1]._width + gap;
	}
}

function bigView(pname) {
	_parent.bigview.setImage(pname);
}

gRusS...
 

Anhänge

  • galerie.jpg
    galerie.jpg
    18 KB · Aufrufe: 37
Zuletzt bearbeitet:
Hi,

entferne diese Zeile:
Code:
speed +=  (-(_xmouse - mask._width / 2) / 15 - speed) / 5;
, setze dafür Ereignishandler auf die Pfeile, z.B.:
Code:
pfeil_rechts.onPress = function() {
    dest = -5;
}

pfeil_rechts.onRelease = pfeil_rechts.onDragOut = function() {
    dest = 0;
}

pfeil_links.onPress = function() {
    dest = 5;
}

pfeil_links.onRelease = pfeil_links.onDragOut = function() {
    dest = 0;
}
Nun musst Du die Variable "dest" (die Zielgeschwindigkeit) nur noch auf der Zeitleiste definieren (z.B. var dest = 0; ) und die eben entfernte Zeile durch folgende ersetzen:
Code:
speed += (dest - speed) / 5;

Gruß
.
 
Meldmich wieder...

Ich hab die Grossansicht grösser skaliert, damit ich grössere bilder reinladen kann,
nun skaliert mir FLASH in der scrolleiste die Bilder zu gross... Nun die Frage:
wo im Script ist vermerkt um welchen Faktor die Bilder in der Scrolleiste skaliert
werden?

Hier nochmal der code der Scrolleiste:
PHP:
_global.slide = this;

var speed = 0;
var maxspeed = 16;
var damper = 8;
var gap = 30;
var overpic = false;
var finished = 0;
var dest = 0

var leiste = new Array(2);

leiste[0] = container.attachMovie("bilderleiste", "leiste0", 1);
leiste[1] = container.attachMovie("bilderleiste", "leiste1", 2);

function nextOne() {
	finished ++;
	if (finished >= 2) go();
}

// Ereignishandler Pfeile

pfeil_rechts.onRollOver = function() {
    dest = -15;
}

pfeil_rechts.onRollOut = pfeil_rechts.onDragOut = function() {
    dest = 0;
}

pfeil_links.onRollOver = function() {
    dest = 15;
}

pfeil_links.onRollOut = pfeil_links.onDragOut = function() {
    dest = 0;
}

function go() {
	leiste[1]._x = leiste[0]._x + leiste[0]._width + gap;

	this.onEnterFrame = function() {
		if (!overpic) {
			speed += (dest - speed) / 5;
			if (speed < -maxspeed) speed = -maxspeed;
			if (speed > maxspeed) speed = maxspeed;
		} else {
			speed /= 1.4;
		}
		for (var i=0; i<leiste.length; i++) {
			leiste[i]._x += speed;
		}
		for (var i=0; i<leiste.length; i++) {
			if ((leiste[i]._x > mask._width) && speed > 0) moveLeft(i);
			if ((leiste[i]._x < -leiste[i]._width - gap) && speed < 0) moveRight(i);
		}
	}
}

function moveLeft(x) {
	if (x == leiste.length - 1) {
		leiste[x]._x = leiste[0]._x - leiste[x]._width - gap;
	} else {
		leiste[x]._x = leiste[x + 1]._x - leiste[x]._width - gap;
	}
}

function moveRight(x) {
	if (x == 0) {
		leiste[x]._x = leiste[leiste.length - 1]._x + leiste[leiste.length - 1]._width + gap;
	} else {
		leiste[x]._x = leiste[x - 1]._x + leiste[x - 1]._width + gap;
	}
}

function bigView(pname) {
	_parent.bigview.setImage(pname);
}

und ein Screenshot:


gRuuSs
 

Anhänge

  • galerie.jpg
    galerie.jpg
    27,1 KB · Aufrufe: 31
... und schon das nächste Problem:

Probiere gerade diese Scroll-Galerie ( oben) so hinzubiegen, dass die Bilder vom Server geladen werden und nicht in die .swf eingebunden.
Bin von einer anderen Galerie-Vorlage ausgegangen( Anhang), wo das so gemacht wird, und versuchte diese dann mit obiger zu kombinieren...
...leider hab ich hierzu zu wenig As-kenntnis.:(

nun die Frage: "welcher teil des untersten Scripts muss ich durch welchen des oberen
ersetzen (Bild-Namen hab ich noch nicht angepasst)"

verweis auf Tutorial auch erwünscht .

also hier mal der code meiner Bilderleiste:

PHP:
var bilder = 5;
var zoom = 35;

for (var i=1; i<=bilder; i++) {
	var p = this.attachMovie("Ill_bild" + i, "Ill_bild" + i, i);
	p._xscale = p._yscale = zoom;
	if (i > 1) {
		p._x = this["Ill_bild" + (i - 1)]._x + this["Ill_bild" + (i - 1)]._width + slide.gap;
	}
	p.onPress = function() {
		//trace("Angeklickt: " + this._name);
		slide.bigView(this._name);
	}
	p.onRollOver = function() {
		slide.overpic = true;
	}
	p.onRollOut = p.onReleaseOutside = function() {
		slide.overpic = false;
	}
}

slide.nextOne();

...und da dieser der Vorlage (ist auf einem _mc namens "controller" platziert) :

PHP:
onClipEvent (load) {
	max_anzahl = 4;
	pos = 80;			
	startpos = 180;		
}
onClipEvent (enterFrame) {
	this.time = int(getTimer()/100);					
	if (this.time>delay and anzahl < max_anzahl) {		
		delay += 0.2;									
		anzahl++;
		duplicateMovieClip(_root.but, "but" add ++i, i);
		_root["but" add i]._x = startpos+pos*i;			
		_root["but" add i].thumbnail.file = "pic" add anzahl add ".jpg";	
	}
}

GrUsSs
 

Anhänge

  • thumb_gal.zip
    132,9 KB · Aufrufe: 35
Hi,

in dem Fall würde ich von einer Modifikation absehen und völlig neu anfangen. Diese Bilderleiste ist explizit für interne Grafiken gedacht und ein Umbau (schon gar ein "Ersetzen" durch ein völlig anderes Script) käme dem Versuch gleich, eine Digitaluhr durch Anbau einiger Teile in einen Kühlschrank umzubauen (achtung, überspitzt ;)): Ohne die Digitaluhr wärs einfacher. ;)

Auf meiner Seite findest Du noch einige weitere (z.T. ähnliche) Rollgalerien, die zumeist mit externen Bildern arbeiten. Ich gehe davon aus, dass dort etwas für Dich dabei ist.

Gruß
.
 
so.... hab deinen Rat befolgt und eine deiner xml-Galerie verwendet...

... klappt auch ganz super bis hierhin, jedoch möcht ich noch etwas zusätzliches machen
--: und zwar sollte sich der TEXT (sieh Bild) passend zur RUBRIK ändern.

Hab zuerst gedacht: null problemo! .... doch dann eines besseren belehrt.. die Rubriken werden nämlich durch ein Array in irgeneinem Bezug zur .xml aufgebaut ... das stösst dann schon ziemlich an meine AC-Wissensgrenze( für gewöhnlich hatte ich immer einzelne Buttons :-( ), da ich keinen Schimmer habe wie ich auf die einzelnen Rubriken als Button Zugriff bekomme.

Also Frage : Wie soll ich das am besten lösen?


gRuSS
 

Anhänge

  • 24690attachment.jpg
    24690attachment.jpg
    42,2 KB · Aufrufe: 18
Hi,

verwendest Du die "Slide Gallery v4"? Diese Vorlage bietet schon Textunterstützung für die Rubriken - Du müsstest nur dafür sorgen, dass der Text nicht direkt auf den "Buttons" angezeigt wird, sondern beim Klick in einem zentralen Textfeld. Gib mir kurz Feedback und ich mache Dir ein Beispiel fertig.

Gruß
.
 
Zurück