Druckbare Version
Hallo!
Ich möchte gerne eine Fun Seite aufsetzen in der man bei einem MouseOver eine kleine Vorschau bekommt.
ähnlich wie bei myvideo.at
siehe blauen Pfeil;
http://s10.directupload.net/images/1...p/89ssda6e.jpg
Brauche ich da ein Script Template, oder wie gehe ich am besten vor?
ich muss sagen das ich noch Conteo Anfänger bin, und gerade die ersten Schritte LERNE. Aber dennoch Begeistert vom Funktionsumfang ;)
Liebe Grüße
Stefan
Aye, Stefan.
all die Videoseiten machen solche Sachen in aller Regel mit speziellen Funktionen - myvideo.at hat dazu (wie andere auch) eine API veröffentlicht, die Dir als Anregung dienen könnte.
'Out of the box' und mit dreieinhalb Zeilen zusammenkopiertem JavaScript wird eine solche Funktion m.E. nicht möglich sein. Grundsätzlich sehe ich da eher selbstgeschriebenes JS anstatt Contao-Funktionen. Machbar sollte das sein - beispielsweise indem Du den Catalog als Backend nutzt und dann die entsprechenden Funktionen in die Ausgabe-Templates integrierst. Oder indem Du die API eines Videodienstes integrierst.
Carolina.
Als erster Schritt:
im Tiny Editor-> Bild einfügen -> Registerkarte erweitert -> Bild austauschen
Wenn Du es automatisieren willst, brauchst eigene Skripte.
hth,
Christian G.
Ich habe mir hierzu ein moo_hoverimage.tpl geschrieben was ich ins Seitenlayout einbinde.
Soll ein Bild ausgetauscht werde gebe ich im Inhaltselement (oder wo auch immer) die Klasse "hoverImg" an.
Das Javascript versucht dann ein Bild aus dem selben Ordner zu laden mit dem zusatz "Over".
Bsp:
tl_files/bilder/normalesBild.jpg --> tl_files/bilder/normalesBildOver.jpg
moo_hoverimage.tpl:
PHP-Code:<script type="text/javascript">
<!--//--><![CDATA[//><!--
window.addEvent('domready',function(){
$$("div.hoverImg img, img.hoverImg").each(function(el){
el.store('default',el.get('src'));
el.addEvents({
'mouseenter':function(e){
var over = el.retrieve('default').substr(0,el.retrieve('default').lastIndexOf('.'))
+ 'Over'
+ el.retrieve('default').substr(el.retrieve('default').lastIndexOf('.'));
el.set('src',over);
},
'mouseleave':function(e){
el.set('src',el.retrieve('default'));
}
});
});
});
//--><!]]>
</script>
Hallo Psi,
besten Dank für das Script. Funktioniert einwandfrei. Allerdings lässt sich das Bild dann nicht verlinken, oder?
Gruß
Alex
Okay. Funktioniert doch. Danke!
Hallo alle zusammen,
ich bin grad auf diesen schon etwas älteren Post hier gestoßen und würde gerne das o.g. Script verwenden. Normalerweise mache ich aber nur die Datenpflege unserer Website und weiß daher nicht, wo ich ein derartiges Script einfüge! Hoffentlich kann mir das jemand kurz erklären. ;)
Mit freundlichen Grüßen
Jan Dürcop
Datei "moo_hoverimage.html5" in /templates anlegen und im Seitenlayout anhaken.
Hallo Psi,
danke für die schnelle Antwort. Dann war ich ja schon auf dem richtigen Weg, aber genau hier bin ich nicht weitergekommen. Wenn ich unter /templates auf "Neues Template" gehe, dann kann ich nur aus einer Liste "Originaltemplates" aussuchen und diese anpassen, aber irgendwie keine neuen Templates erstellen. Ich weiß nicht, wie ich da jetzt meine eigenen Templates reinbekomme. Ich bin absoluter Laie in dem gesamten Layout-Bereich und arbeite sonst nur im Inhalt-Bereich. :o
Mfg
Jan Dürcop
FTP und hochladen und so ;)
geht auch ohne ftp, x-beliebiges template wählen, code reinkopieren, abspeichern und anschliessend umbenennen.
Das funktioniert leider nicht in Kombination mit Caching.Zitat:
Zitat von Psi
Contao lädt das erste Bild aus dem assets-Ordner, das zweite verbleibt im Ursprungsordner, der Pfad wird nicht gefunden. Ideen wie man das lösen könnte?
Hallo,
hat eventuell jemand eine Lösung für das Caching-Problem mit diesem Script?
Momentan sucht das Script im assets-Ordner nach dem Over-Bild, welches dort nicht vorhanden ist.
Des Weiteren erhält die Datei (1. Bild) auch einen neuen Namen. Somit müsste das 2. Bild (Over) diesen auch erhalten.
Gruß