I have a 3 column layout with an image block in each column.
I added an image and a selected a secondary hover image
I selected “Constrain Size” and gave a max height and width.
The problem is that it only seems to work on the last block.
No problem when it is a single block but if I add a second block…the hover image only shows for the last block.
Is this another bug? or am I being dense?
Yes there’s a bug. Could you make a template for your image blocks by just copying the block’s view.php file and modifying the javascript at the bottom to look like this:
<script type="text/javascript">
(function() {
var images = document.getElementsByClassName('ccm-image-block-hover bID-<?php echo $bID; ?>');
for (var i = 0; i < images.length; i++) {
var image = images[i],
hoverSrc = image.getAttribute('data-hover-src'),
defaultSrc = image.getAttribute('data-default-src');
image.onmouseover = function () {
image.setAttribute('src', hoverSrc);
};
image.onmouseout = function () {
image.setAttribute('src', defaultSrc);
};
}
}());
</script>