--- title: "Bilderswitch / Slide" url: "https://www.typo3.net/d/105900-bilderswitch-slide" source: "typo3.net" tags: ["Extensions","Entwicklung","Frage"] created: "2011-06-18" last_reply: "2011-06-20" replies: 11 solved: false page: 1 pages: 1 lang: "de" --- # Bilderswitch / Slide Extensions › Entwicklung · 11 Antworten · gestartet 2011-06-18 ## Eröffnungsbeitrag **typo3_hp** · 2011-06-18 · [Beitrag #1](https://www.typo3.net/d/105900-bilderswitch-slide/1) Hallo! Ich habe in meiner Extension auch eine Bilderdarstellung integriert. Im Prinzip wird ein Projekt angezeigt, links ein Text und rechts ein Bild. Es können jedoch auch ein paar Bilder abgespeichert werden, diese werden dann im Feld picture wie folgt gespeichert: foto1.jpg,foto2.jpg,foto3.jpg Ivh benötige nun eine kleine Funktion/Extension die ich in meine einbauen kann und die jeweils das erste Bild anzeigt. Durch einen Klick auf eine Navigationsleiste (oder Pfeile) oben soll auf das nächste Bild innerhalb dieses Datensatzes gewechselt werden. Habt Ihr mir eine Idee? Danke und Grüße ## Antworten ### [#2](https://www.typo3.net/d/105900-bilderswitch-slide/2) · freshman17 · 2011-06-18 Du liest das Feld *picture* aus, splittest den String nach Komma und liest das Ganze in ein Array. Bei einem Klick iterierst du durch das Array (evtl. mit AJAX). Falls die Ladezeiten es zulassen kann man auch alle Bilder an den Client ausliefern, eins davor mit CSS anzeigen und bei einem Event mit JavaScript iterierst. Sicher gibt es noch andere Möglichkeiten.. Gruß ### [#3](https://www.typo3.net/d/105900-bilderswitch-slide/3) · aemka · 2011-06-18 Genau, CSS und JavaScript / jQuery nimmst du am besten dafür. Gerade mit jQuery kann man so was mit sehr wenig Zeilen Code hinbekommen. ### [#4](https://www.typo3.net/d/105900-bilderswitch-slide/4) · typo3_hp · 2011-06-18 Hallo! Dankeschön! Habt ihr mir ein Beispielcode? Danke und Grüße ### [#5](https://www.typo3.net/d/105900-bilderswitch-slide/5) · freshman17 · 2011-06-18 so läuft das hier nicht ;) zeig deinen Code bzw. frag wo du nicht weiterkommst dann wird dir auch geholfen. ### [#6](https://www.typo3.net/d/105900-bilderswitch-slide/6) · typo3_hp · 2011-06-19 Hallo! Würde ich ja gerne - mir fehlt aber der Ansatz. Ich möchte ja keine fertige Lösung sondern nur ein Beispielcode Grüße ### [#7](https://www.typo3.net/d/105900-bilderswitch-slide/7) · freshman17 · 2011-06-19 Ungetestet in TYPO3 und Coding Guidelines außer Acht gelassen aber so ungefähr sieht dann deine Ext-Klasse aus: ```php class tx_myext_pi1 extends tslib_pibase { public function main ($content, $conf) { foreach ($this->getImages() as $image) $content .= "\n"; return $this->pi_wrapInBaseClass($content); } private function getImages() { $res = $GLOBALS['TYPO3_DB']->exec_SELECTquery('picture', 'table', 'uid=20'); return preg_split('/,/', preg_replace('/,$/', '', mysql_fetch_assoc($res))); } } ``` HTML: ```html
``` CSS: ```css .tx-myext-pi1 img { position: absolute; display: none; } .tx-myext-pi1 img:first-child { display: inline; } ``` JavaScript wobei hier jQuery zum Einsatz kommt ```css $(document).ready(function() { $('.tx-myext-pi1 img').click(function(){ $(this).fadeOut('slow'); if($(this).next().length) { $(this).next().fadeIn('slow'); } else { $(this).parent().children(':first-child').fadeIn('slow') } }) }); ``` ### [#8](https://www.typo3.net/d/105900-bilderswitch-slide/8) · typo3_hp · 2011-06-19 Hallo Freshman, vielen Dank! Habe nun etwas herumversucht bin aber nicht wirklich weiter gekommen! Das Problem ist das die ganze Sache innerhalb einer anderen Funktion passieren muss, da bekomme ich lauter Fehler weil der include (extends tslib_pibase) bereits oben in der anderen Funktion passiert ist und mit den Variablen funktioniert das irgendwie auch nicht so (unexpected T_PRIVATE). Ich habe hier einmal das Script hochgeladen. Es geht bei dem case projectdetails um die Zeile (Zeile 149) die mit *$content .= '

' . '
' .$this->cObj->IMAGE(array('file' =>* beginnt. Wie baue ich diese Funktion mit ein? Vielen Dank! ### [#9](https://www.typo3.net/d/105900-bilderswitch-slide/9) · typo3_hp · 2011-06-20 Hallo Freshman, habe noch ein paar weitere Sachen versucht, leider auch ohne Erfolg. Wenn ich die Funktionen außerhalb der anderen Funktion definiere und angebe bekomme ich schon einmal keinen Fehler. Jedoch muss die Funktion ja meiner Meinung nach in die andere in die oben genannten Zeile/Position rein, da sie ja innerhalb der anderen Funktion aufgerufen wird. Desweiteren fehlt ja der Bezug um welche uid (Datensatz) es geht, wenn die Funktion außerhalb definiert ist. Hier mal mein aktueller Stand (Dein Script ist am Ende und auf mein Datenmodell angepasst) Danke und Grüße ### [#10](https://www.typo3.net/d/105900-bilderswitch-slide/10) · freshman17 · 2011-06-20 Du sollst doch nicht meine Klasse an das Ende deiner Datei anfügen! Das Beispiel sollte dir nur ein Denkanstoß sein d.h. es wurde nur das Wichtigste dargestellt. Schau, deine Klasse **tx_hwtexcreferences_pi1** heißt bei mir **tx_myext_pi1**, beide haben die Methode main... In dieser Methode "spielt bei die Musik". Dort sollst du das Feld *picture* auslesen und diesen HTML-Code generieren: ```html
``` Den Rest machst du nur mit CSS und JavaScript! ### [#11](https://www.typo3.net/d/105900-bilderswitch-slide/11) · typo3_hp · 2011-06-20 Hallo Freshman, sorry wenn ich nerve, ist die erste Extension die ich anpasse. Bis auf diese Slidesache habe ich alle Modifikationen irgendwie hinbekommen. Habe es nun so versucht (Die Funktion innerhalb meiner so wie unten eingebaut, ist das schon einmal richtig? Hier bemängelt er noch die getimagefunction: Call to undefined method tx_hwtexcreferences_pi1::getImages() Nur beim einbau der Private Function getimage() habe ich Probleme, er lässt sie nicht einfügen innerhalb der anderen Funktion, irgendwie muss ich sie ja aber aufrufen!? ```php // Alter $content für Bilder: $content .= '' . '
' .$this->cObj->IMAGE(array('file' => 'uploads/cc_extension/'.$objects_temp['image'])); //Neuer Code foreach ($this->getImages() as $image) $content .= "\n"; return $this->pi_wrapInBaseClass($content); ``` Danke und Grüße ### [#12](https://www.typo3.net/d/105900-bilderswitch-slide/12) · freshman17 · 2011-06-20 @typo3_hp: hast pm --- Quelle: „Bilderswitch / Slide“, typo3.net, https://www.typo3.net/d/105900-bilderswitch-slide Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.