HIlfe bei jQuery Apple Gallery

[DiDiJo]

Hi Leute,

ich taste mich langsam an jQuery heran und ein gewisses Basiswissen konnte ich mir denke ich mal auch schon aneignen.

Nun habe ich in den weiten den I-Nets diese wunderschöne Apple-Gallery gefunden + Tutorial.

http://demo.tutorialzine.com/2009/11/beautiful-apple-gallery-slideshow/demo.html

Ich hab mich also direkt drangemacht und wollte das nun für eine meiner Projekte nutzen. Nun ist mir beim durchgehen den Tutorials aufgefallen, dass ich bei den Bildern umbedingt die Größe mitgeben muss, damit das Script die Breite des "Sliders" berechnen kann. Meiner Meinung nach total Blöd, da ja ein Bild auch mal nicht die volle Breit haben kann (so wie es im Tutorial vorgesehen war).

Ich habe jetzt die Slideshow-Struktur so umgebaut:

$ausgabe[] = ' <h1>'.$data_objects->objekttitel.'</h1>';
        
$ausgabe[] = '<div id="gallery_immo_detail">';
$ausgabe[] = '	<div id="slides">';

foreach($BIG_PICS as $bp) {
$ausgabe[] = '		<div class="slide"><div class="apple_pic_holder" style="width:965px; height:400px"><img src="'.$bp.'" alt="side" /></div></div>';
}

$ausgabe[] = '	</div>';
$ausgabe[] = '	<div id="menu">';
$ausgabe[] = '		<ul>';
$ausgabe[] = '			<li class="fbar"></li>';

foreach($SMALL_PICS as $sp) {
$ausgabe[] = '			<li class="menuItem"><div class="apple_thumb_holder"><a href="#"><img src="'.$sp.'" alt="thumb" /></a></div></li>';
}	
    
$ausgabe[] = '		</ul>';
$ausgabe[] = '	</div>';
$ausgabe[] = '</div>';

Im Grundegenommen habe ich um die Bilder noch ein weiteres DIV gesetzt mit festen Höhen und Breitenangaben.

Nun habe ich mir gedacht, dass das Skript direkt wieder laufen sollte aber ich bekam den Fehler, dass ich meinen Bildern kein Breiten-Attrikbut mitgegeben habe, was ja auch korrekt ist, da ich ja eigentlich nur meine "Pic-Holder"-DIV verschieben möchte.
Also habei ch am eigentlichen Skript folgende Änderung vorgenommen:

$('#gallery_immo_detail #slides .slide ').each(function(i){
		
		/* Traverse through all the slides and store their accumulative widths in totWidth */
		
		positions[i]= totWidth;
		//totWidth += $(this).width();
		totWidth += 965;
		
		/* The positions array contains each slide's commulutative offset from the left part of the container */
		
		/*
		if(!$(this).width())
		{
			alert("Please, fill in width & height for all your images!");
			return false;
		}
		*/
		
		
	});

Jetzt wird zwar die Breite richtig berechnet ... aber dafür funktioniert das restliche Skript nicht mehr ... Kann mir jemand von euch vlt. mal unter die Arme greifgen ?

mfg DiDi

 

[Quaese]

Hi,

das Script ermittelt die Gesamtbreite aus den Einzelbreiten der Elemente mit der Klasse .slide. Wenn du das Script in seinem Ausgangszustand belässt und der Klasse .slide um die gewünschte Breite ergänzt, sollte es funktionieren.

.slide{
  float:left;
  width: 965px;
}

Ciao
Quaese

 

[DiDiJo]

ja das hab ich auch verstanden ... aber egal ob ich die CSS anweisung in eine externe CSS oder direkt inline in das LI Element schreibe ... ich hab immer die Meldung bekommen, dass ich bitte die Größen Angaben übergeben muss

 

[Quaese]

Hmm, kann ich hier nicht nachvollziehen. Wenn ich die Grössenangabe wie beschrieben angebe, funktioniert es bei mir problemlos - siehe hier.

Ciao
Quaese

 

[DiDiJo]

hmmm ... ich werd nochmal über mein skript rüberfliegen