Skip to content
  • Recent
  • Tags
  • Popular
  • Users
  • Search
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse

Lay Theme Forum

  1. Home
  2. Addons
  3. Image Hover Add-on: apply CSS box-shadow Property?

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

Scheduled Pinned Locked Moved Addons
4 Posts 2 Posters 135 Views
  • 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 Offline
    G Offline
    Georges
    wrote on last edited by
    #1

    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
    0
    • RichardR Offline
      RichardR Offline
      Richard
      Global Moderator
      wrote on last edited by
      #2

      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
      0
      • G Offline
        G Offline
        Georges
        wrote on last edited by
        #3

        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
        0
        • RichardR Offline
          RichardR Offline
          Richard
          Global Moderator
          wrote on last edited by
          #4

          Dear @Georges

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

          Best wishes and a wonderful day
          Richard

          1 Reply Last reply
          0
          Reply
          • Reply as topic
          Log in to reply
          • Oldest to Newest
          • Newest to Oldest
          • Most Votes


          I also code custom websites or custom Lay features.
          šŸ’æ Email me here: šŸ’æ
          info@laytheme.com

          Before you post:
          1. When using a WordPress Cache plugin, disable it or clear your cache.
          2. Update Lay Theme and all Lay Theme Addons
          3. Disable all Plugins
          4. 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:
          1. Post a link to where the problem is
          2. Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
          3. If the problem is difficult to explain, post screenshots / link to a video to explain it
          Online Users
          arminunruhA
          arminunruh
          A
          alasdair17
          Forgot your key, lost your files, need a previous Lay Theme or Addon version? Go to www.laykeymanager.com
          laytheme.com
          • Login

          • Don't have an account? Register

          • Login or register to search.
          • First post
            Last post
          0
          • Recent
          • Tags
          • Popular
          • Users
          • Search