Thumbnails mouseover transition
-
Hello !
I'm trying to adjust the speed of the transition between the project thumbnail image and the project thumbnail image mouseover.
I tried to modify the css using transition properties (like transition duration), but it don't works.
I probably didn't find the good selector on CSS...I tried on .mo_thumb entries for exemple but without success...
Thank you ! -
Dear @cantoua
I will check with Armin.Just a moment.
Best!
Marius
-
hey Aurélien,
it worked for me by replaying the lines 499 to about 516 of frontend.style.css with:
".no-touchdevice .thumb.has-mouseover-img .ph img:first-child {
opacity: 1 !important;}.no-touchdevice .thumb.has-mouseover-img:hover .ph img:first-child {
opacity: 1 !important;}.no-touchdevice .thumb.has-mouseover-img:hover .ph img.mo_thumb {
opacity: 1 !important;}.touchdevice .thumb.has-mouseover-img.hover .ph img:first-child {
opacity: 0 !important; }.touchdevice .thumb.has-mouseover-img.hover .ph img.mo_thumb {
opacity: 1 !important;}.mo_thumb {
z-index: 1;
-o-object-fit: cover;
object-fit: cover;
opacity: 0 !important; }.mo_thumb:hover img {
transition: opacity 300ms ease;
-webkit-transition: opacity 300ms ease;
-o-transition: opacity 300ms ease;
}" -
Dear @svenro
great! Well done!Dear @cantoua let us know if that worked for you as well.
Best!
Marius
-
@mariusjopen hi! I want to add this to my portfolio but know no css. Would you be able to help me? I'm happy to pay for your work of course.
For 1on1 paid Lay Theme Coaching, contact: audrey@cyberslayers.work.
We also code custom websites or custom Lay features.
💿 Email us here: 💿
info@laytheme.com
Our Web Development company: 100k.studio
Want to tip me? https://www.paypal.com/paypalme/arminunruh
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it