Lay Theme Forum

    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Popular
    • Users
    • Search

    Thumbnails mouseover transition

    General Discussion
    4
    6
    358
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • K
      kan2a last edited by kan2a

      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 !

      1 Reply Last reply Reply Quote 0
      • mariusjopen
        mariusjopen Global Moderator last edited by

        Dear @cantoua
        I will check with Armin.

        Just a moment.

        Best!

        Marius

        www.mariusjopen.world

        1 Reply Last reply Reply Quote 0
        • K
          kan2a last edited by

          Hi Marius,

          Have you got the time to check this ?
          Thank you very much !
          Aurélien

          1 Reply Last reply Reply Quote 0
          • S
            svenro last edited by

            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;
            }"

            1 Reply Last reply Reply Quote 0
            • mariusjopen
              mariusjopen Global Moderator last edited by

              Dear @svenro
              great! Well done!

              Dear @cantoua let us know if that worked for you as well.

              Best!

              Marius

              www.mariusjopen.world

              1 Reply Last reply Reply Quote 0
              • T
                tali last edited by

                @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.

                1 Reply Last reply Reply Quote 0
                • First post
                  Last post

                Before you post

                Use the Search Feature. Maybe there is already a solution to your issue.

                1. Update Lay Theme and all Lay Theme Addons
                2. Disable all Plugins
                3. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code ", click "Save Changes"
                4. Now see if your problem solved itself
                5. Go here, see if your problem is listed here:
                Troubleshooting

                When you post:
                1. Post a link to where the problem is
                2. If the problem is difficult to explain, post screenshots / link to a video to explain it

                Thanks!

                Online Users

                A
                D
                S
                M
                K
                F
                F
                O

                Recent Topics

                • K

                  Unable to update lay theme / to login wp admin

                • S

                  Theme crashed - because of Polylang?

                • A

                  New button feature not available

                • A

                  carousel addon not working after update

                laytheme.com