1. Copy the following code into notepad and make the necessary changes. <img src="/images/image.jpg" height="100" width="100" onmouseover="this.src='/images/enlargedimage.jpg';
this.height=300;this.width=300" onmouseout="this.src='/images/image.jpg';
this.height=100;this.width=78" /> Parameters - Image: src normal, src enlarged, src normal - height/width: height/width normal, height/width enlarged, height/width normal - Eventhandler: to enlarge, to return, possibly values: onmouseover, ondblclick, onclick, onmousedown, onmouseup, onmouseout. 2. Create a custom footer module and remove everything from and paste the following code below into the custom footer module. <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> <xsl:output method="html" /> <xsl:template match="/"> </xsl:template> </xsl:stylesheet> 3. Paste the modified from notepad into the custom footer module between the <template> tags. <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> <xsl:output method="html" /> <xsl:template match="/"> <img src="/images/image.jpg" height="100" width="100" onmouseover="this.src='/images/enlargedimage.jpg';
this.height=300;this.width=300" onmouseout="this.src='/images/image.jpg';
this.height=100;this.width=78" /> </xsl:template> </xsl:stylesheet> |