[TYPO3] Rollover/Hover for ordinary Images?

[Martin Kokes]

klaus bossert napsal(a):
> Martin Kokes wrote:
>>
>> Making a own TemplaVoila flexible content element with appropriate 
>> fields (i.e. image, link, text field for title/alttext and checkbox 
>> for generating same image in b/w with TS) doesn't help?
> 
> Ouh, thats an intresting idea. This would mean that I'd have to store 
> the necessary JavaScript for the hover-functionality in a FCE-template 
> which would be automatically included when used on a page?

Yes, if you include your CSS/JS in the header of a FCE template, it will 
be included on every page you use your new FCE.

> I must admit that I didnt use FCEs so far. Is the FCE-part of the 
> FTB-tutorial still correct, or are there any "better/newer" tutorials 
> around?

You can use tutorial or wiki. Make yourself a FCE with a field something 
like this:

<field_cover type="array">
<tx_templavoila type="array">
<title></title>
<sample_data type="array">
<numIndex index="0"></numIndex>
</sample_data>
<eType>imagefixed</eType>
<TypoScript>
<![CDATA[
	10 = IMAGE
	10.file = GIFBUILDER
	10.file {
		XY = 66,90
		format = jpg
		10 = IMAGE
		10.file.import = uploads/tx_templavoila/
		10.file.import.current = 1
		10.file.import.listNum = 0
		10.file.maxW = 66
		10.file.maxH = 90
		20 = EFFECT
		20.value = sharpen=3
	}
	10.fileName = actual-cover-66px

	20 = IMAGE
	20.file = GIFBUILDER
	20.file {
		XY = 90,123
		format = jpg
		10 = IMAGE
		10.file.import = uploads/tx_templavoila/
		10.file.import.current = 1
		10.file.import.listNum = 0
		10.file.maxW = 90
		10.file.maxH = 123
		20 = EFFECT
		20.value = sharpen=3
	}
	20.fileName = actual-cover-90px
]]>
</TypoScript>
</tx_templavoila>
<TCEforms type="array">
<config type="array">
<type>group</type>					<internal_type>file</internal_type>
<allowed>gif,png,jpg,jpeg</allowed>
<max_size>1000</max_size>
<uploadfolder>uploads/tx_templavoila</uploadfolder>
<show_thumbs>1</show_thumbs>
<size>1</size>
<maxitems>1</maxitems>
<minitems>0</minitems>
</config>
<label></label>
</TCEforms>
</field_cover>

An wrap it in some JS/CSS.

MK