Lay Theme Forum

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

    Image Hover Add-on: apply CSS box-shadow Property?

    Addons
    2
    4
    33
    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.
    • G
      Georges last edited by

      Hello Lay Theme crew,

      Thanks for the Image Hover Add-on: I've been waiting for something like this, it's great.

      If I wanted to add a drop shadow to the hover image (e.g. with CSS box-shadow property), how would you suggest that I apply it with custom CSS?

      Big thanks!

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

        Dear @Georges

        Is this what you are after?

        In this quick example i have added a box-shadow to the hover image:

        Using the inspect tool i have looked through the code of my website and found the Hover image that we are looking for -

        Screen Shot 2020-08-12 at 8.54.17 PM.png

        Here is a Link to more information on using the Developer inspection tool if you need it :)

        https://www.khanacademy.org/computing/computer-programming/html-css/web-development-tools/a/using-the-browser-developer-tools

        Then once i have found what i am looking for i can create CSS that targets it:

        Screen Shot 2020-08-12 at 8.57.42 PM.png

        This is a Red box but i did it for visual impact to help

        I hope this sets you in the right direction :)

        All the best
        Sincerely

        Richard

        1 Reply Last reply Reply Quote 0
        • G
          Georges last edited by

          Hello Richard,

          Very big thanks for looking into my request here, apologies for my slow reply. This is what I'd been looking for, my attempts at viewing source and trying to work out how to affect the image hover hadn't quite gotten to where you did. I'll give it a try!

          Thanks again!

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

            Dear @Georges

            Great :)
            Good luck and thank you for using Lay Theme!

            Best wishes and a wonderful day
            Richard

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

            Try this to fix issues 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

            T
            G
            L
            M
            L
            S

            Recent Topics

            • S

              Image hover -> Image on image

            • C

              centred Carousel fixed width and proportions

            • text underline

            • open all links in a thumbnail grid in a new tab

            laytheme.com