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.