[TYPO3] click-enlarge icon over image
Franz Koch
typo3 at fx-graefix.de
Tue Mar 28 13:07:59 CEST 2006
Hi Bas?
> I searched the whole internet and posted a few quetions but with no answer.
>
> Is it possible to put an icon over an image, if there's an enlarged
> version of that picture?
Jepp, that is possible and not very difficult - I use it on alsmost
every typo3-project. What I do is to append on clickEnlarged images a
little container with icon in it and define a negative 'margin-top'
inside my CSS file. Works great, besides that the icon itself is not
clickable.
Here is my code:
--CONSTANTS-------------------
template.clickEnlarge = |<span class="clickenlarge"><img
src="path/to/icon.gif" /></span>
--TS--------------------------
tt_content.image.20 {
1 {
stdWrap.innerWrap = {$template.clickEnlarge}
stdWrap.innerWrap {
if.isTrue.field = image_zoom
ifEmpty.field = image_link
}
}
--CSS--------------------------
.clickenlarge {
display: block;
text-align: right;
padding: 0px 4px;
margin-top: -2em;
height: 2em;
}
.clickenlarge img {
border: 0px !important;
}
-------------------------------
works with 'csc' as well as the good old 'content default'
And that's it :)
Here is a live example (german):
<http://www.elements-net.de/leistungsbereiche/business_it/angebote/acer_scaleo_ta.html#ce64>
(reminder to myself: update website and create a nicer icon)
--
Kind regards,
Franz Koch
More information about the TYPO3-english
mailing list