LayerSlider provides a built-in option to set up hover effect for your layers. You can find these options under the Transition tab of the Layers section.
Unfortunately the CSS you have tried to use will not work in this case.
Currently there is no option in the plugin to swap two image layers on hover.
But as an alternate solution you could try to position the two image layers 'behind' each other and apply a hover transition on the upper one, that sets its opacity to zero when you hover over it, revelaing the 2nd image under it.
Hello, please note that I am making this request public since the official support isn't answering.
So I am trying to add a hover effect to an image embedded into my slider, so that the image will change on mouse over.
I've been trying to achieve this by CSS, but it seems not to work:
#imageID:hover {
content:url('xyz') no-repeat;
}
Thanks for your suggestions.
Hey squadrasiti,
LayerSlider provides a built-in option to set up hover effect for your layers. You can find these options under the Transition tab of the Layers section.
Unfortunately the CSS you have tried to use will not work in this case.
The hover transition effect option does not apparently allow to swap an image with another image.
That was what I was asking support for.
Currently there is no option in the plugin to swap two image layers on hover.
But as an alternate solution you could try to position the two image layers 'behind' each other and apply a hover transition on the upper one, that sets its opacity to zero when you hover over it, revelaing the 2nd image under it.
Great, thanks.