I would like to display an image in my header (or elsewhere) which changes on menu item (or text block)
rollover .
I presently have a snippet that I use to change the header image by page ID, but it only works on a menu click not rollover and I haven’t figured out how to call it on rollover.
The snippet as I am using [[ReplaceImage]] works well - but the image names have to be hard coded which defeats the MODx purpose of not hard coding;
[[ReplaceImage]]
<?php
$curPageNum = $modx->documentIdentifier;
switch($curPageNum){
case 1:
$output='div#branding { background: url([(base_url)]assets/templates/cixdegrees/images/Lizard.jpg)no-repeat center;}';
break;
case 2:
$output='div#branding { background: url([(base_url)]assets/templates/cixdegrees/images/lighthouse.jpg)no-repeat center;}';
break;
|etc
|etc
default:
$output='div#branding { background: url([(base_url)]assets/templates/cixdegrees/images/grandteton.jpg)no-repeat center;}';
}
return '<style type="text/css">'."\n".$output."\n</style>";
?>
?>
The snippet needs to be changed to find a way to use the $curPageNum in the snippet (as some kind of variable) so the image names don’t have to be hard coded in the snippet.
I would name the images by page ID (1.jpg for example) and call them with the snippet. Not sure how to do this.
I’m guessing the snippet would look something like this;
[[ImageReplace]];
<?php
$curPageNum = $modx->documentIdentifier;
$output='div#branding { background: url([(base_url)]assets/templates/cixdegrees/images/SOME VARIABLE HERE.jpg)no-repeat center;}';
return '<style type="text/css">'."\n".$output."\n</style>";
?>
I tried this piece of code whith different variables and couldn’t get it to work.
And the question remains how to call ImageReplace to work in Wayfinder on rollover only not click.
Thanks for any help,
Hal D