Hi,
Wie ist es möglich aus der Übergabe von einem Bild zwei Bilder zu erzeugen, wobei nur eines angezeigt werden soll, dieses aber mit einem Javascript-Mouseover das andere Bild an einer bestimmten Stelle anzeigen soll?
Das ganze soll in Templavoila funzen, d.h. das Bild wird über das Form des Flexiblen Content Elements übergeben.
Ich habe dazu folgendes probiert (Auschnitt aus der TemplaVoilà Datenstruktur des FCE's):
lib.image2 = IMG_RESOURCE
lib.image2.file = GIFBUILDER
lib.image2.file {
format = jpg
quality = 90
XY = 424,300
10 = IMAGE
10.file.import = uploads/tx_templavoila/
10.file.import.current = 1
10.file.import.listNum = 0
10.file.maxW = 424
10.file.minW = 424
10.file.maxH = 300
10.file.minH = 300
}
10 = IMAGE
10.file = GIFBUILDER
10.file {
format = jpg
quality = 90
XY = 88,60
10 = IMAGE
10.file.import = uploads/tx_templavoila/
10.file.import.current = 1
10.file.import.listNum = 0
10.file.maxW = 88
10.file.minW = 88
10.file.maxH = 60
10.file.minH = 60
}
10.imageLinkWrap = 1
10.imageLinkWrap.enable = 1
10.imageLinkWrap.typolink.parameter = javascript:;
10.imageLinkWrap.typolink.ATagParams < lib.image2
10.imageLinkWrap.typolink.ATagParams.stdWrap.wrap = onmouseover="MM_swapImage('mainimage','','|',1)" onmouseout="MM_swapImgRestore()"
Es wird aber nur 'IMG_RESOURCE' statt des Namens des generierten lib.image2 ausgegeben:
<a href="javascript:;" target="_top" onmouseover="MM_swapImage('mainimage','','IMG_RESOURCE',1)" onmouseout="MM_swapImgRestore()"><img src="typo3temp/GB/ed3ed3a660.jpg" width="88" height="60" border="0" alt="" title="" />
</a>
Hat da einer ne Idee?
Ich habe es auch schon mal ohne typolink, direkt mit 10.params < lib.image2 und anschliessendem 10.params.stdWrap.wrap, ist aber das selbe in grün.
bau das doch in nem COA zusammen
temp.img = COA
temp.img {
10 < temp.img2
10.wrap= <img src="|"
20 < temp.img2
20.wrap= onmouseover="changeimg('|'..
}
als idee sollte das reichen
georg
Hi just2be,
vielen Dank für diesen "Hint", das hat geklappt :p
Hier für alle anderen die vielleicht auch mal so was machen wollen:
temp.image2 = IMG_RESOURCE
temp.image2.file = GIFBUILDER
temp.image2.file {
format = jpg
quality = 90
XY = 424,300
10 = IMAGE
10.file.import = uploads/tx_templavoila/
10.file.import.current = 1
10.file.import.listNum = 0
10.file.maxW = 424
10.file.minW = 424
10.file.maxH = 300
10.file.minH = 300
}
temp.imageThumb2 = IMG_RESOURCE
temp.imageThumb2.file = GIFBUILDER
temp.imageThumb2.file {
format = jpg
quality = 90
XY = 88,60
10 = IMAGE
10.file.import = uploads/tx_templavoila/
10.file.import.current = 1
10.file.import.listNum = 0
10.file.maxW = 88
10.file.minW = 88
10.file.maxH = 60
10.file.minH = 60
}
temp.imageTag2 = COA
temp.imageTag2 {
10 = TEXT
10.value = <img src="
15 = TEXT
15 < temp.imageThumb2
20 = TEXT
20.value = " onmouseover="MM_swapImage('mainimage','','
25 = TEXT
25 < temp.image2
30 = TEXT
30.value = ',1)" onmouseout="MM_swapImgRestore()" alt="" />
}
10 = TEXT
10 < temp.imageTag2
Wenn man das ganze in einer TemplaVoilà Datenstruktur nutzen will, muss man den ganzen Block innerhalb <TypoScript> mit <![CDATA[ ..... ]]> umschliessen.
bei
10 = TEXT
10 < temp.imageTag2
ist 1. zeile sinnlos, du überschreibst es sowieso dann
lg georg
ps: mein nick ohne 'e' 😉
Würde es dann auch so gehen?
temp.imageTag2 = COA
temp.imageTag2 {
10 < temp.imageThumb2
10.value = <img src="|"
20 < temp.image2
20.value = onmouseover="MM_swapImage('mainimage','','|',1)" onmouseout="MM_swapImgRestore()" alt="" />
}
10 < temp.imageTag2
sollte schon ja
mit der zuweisung weist du ja auch das cObj, in dem Fall "TEXT" zu.
georg
Ich meinte den gesamten Block
statt:
temp.imageTag2 = COA
temp.imageTag2 {
10 = TEXT
10.value = <img src="
15 = TEXT
15 < temp.imageThumb2
20 = TEXT
20.value = " onmouseover="MM_swapImage('mainimage','','
25 = TEXT
25 < temp.image2
30 = TEXT
30.value = ',1)" onmouseout="MM_swapImgRestore()" alt="" />
}
10 < temp.imageTag2
So:
temp.imageTag2 = COA
temp.imageTag2 {
10 < temp.imageThumb2
10.value = <img src="|"
20 < temp.image2
20.value = onmouseover="MM_swapImage('mainimage','','|',1)" onmouseout="MM_swapImgRestore()" alt="" />
}
10 < temp.imageTag2
nö das ist blödsinn!
entweder du machst eine Zuweisung oder du spezifizierst es selbst.
also
10 = TEXT
10.value = bla
15 < temp.foo
georg
Hi just2b,
du hattest es so in deinem ersten Post beschrieben 😉
Hätte mich auch gewundert, wenn das so gegangen wäre.
Auf jeden Fall hat es mich aber auf die richtige "Fährte" gebracht.
Nochmals vielen Dank!
aja sorry, da hab ich mich wohl etwas verschrieben, hab das oben ausgebessert so wie ich das gedacht hätte
georg
Hier noch mal die "Finale" Version:
temp.image = IMG_RESOURCE
temp.image.file = GIFBUILDER
temp.image.file {
format = jpg
quality = 90
XY = 424,300
10 = IMAGE
10.file.import = uploads/tx_templavoila/
10.file.import.current = 1
10.file.import.listNum = 0
10.file.maxW = 424
10.file.minW = 424
10.file.maxH = 300
10.file.minH = 300
}
temp.imageThumb = IMG_RESOURCE
temp.imageThumb.file = GIFBUILDER
temp.imageThumb.file {
format = jpg
quality = 90
XY = 88,60
10 = IMAGE
10.file.import = uploads/tx_templavoila/
10.file.import.current = 1
10.file.import.listNum = 0
10.file.maxW = 88
10.file.minW = 88
10.file.maxH = 60
10.file.minH = 60
}
temp.imageTag = COA
temp.imageTag {
10 < temp.imageThumb
10.wrap = <img src="|"
20 < temp.image
20.wrap = onmouseover="MM_swapImage('mainimage','','|',1)" onmouseout="MM_swapImgRestore()" alt="" />
}
10 < temp.imageTag
"mainimage" ist übrigens die ID des Bildes, welches bei RollOver ausgetauscht werden soll. Die Javascript-Funktionen sind vom Adobe Dreamweaver.