Topic: add mdbWavesEffect to <img>
With the current code, I dont show the effect of waves.
<img class="engranen" src="./assets/img/engranen.png" mdbWavesEffect style="position:relative; z-index: 1;">
I would like the wave effect to apply when I click on my image, but I rely on other examples and I think it's a leftover code and I mainly do not get that when I click, it shows the waves ONLY in my image. I dont want use mask
<!--Mask with wave-->
<div class="view overlay">
<img src="https://mdbootstrap.com/img/Photos/Horizontal/Nature/6-col/img%20(54).jpg" class="img-fluid" alt="Sample image with waves effect.">
<a href="#">
<div class="mask waves-effect waves-light rgba-white-slight" mdbWavesEffect></div>
</a>
</div>
Dear yeisonvelez11,
You could also try to use the below code, and check if it fits your needs. Mask is the best way to achieve your desired behavior.
<div class="view rgba-white-slight" mdbWavesEffect style="width: 200px; height: 136px">
<img src="https://mdbootstrap.com/img/Others/documentation/img%20(75)-mini.jpg" alt="thumbnail" class="img-thumbnail waves-strong"
style="width: 200px">
<div style="height: 2000px"></div>
</div>
Best Regards,
Damian
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Free
- Premium support: No
- Technology: MDB Angular
- MDB Version: 7.4.2
- Device: Web
- Browser: Chrome
- OS: windows 10
- Provided sample code: No
- Provided link: No