Lay Theme Forum

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

    CSS Text Transition w/ Audio on hover state

    General Discussion
    2
    2
    111
    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.
    • D
      dsinclair last edited by

      I'm looking to hopefully add a fun and simple front end interaction to some text that I would put at the header to my portfolio site.

      "Also-Also" would be the text. I've coded this before on my own website but since switching to lay-theme, I'm not sure where to implement.

      On hover, I want the text to have a CSS transition where it becomes skewed / italicized. In tandem, I also want to add a little Javascript to play an audio snippet on hover as well.

      It seems pretty simple, as I have done it through Sublime text and publishing. However, I just don't know how to make this happen easily through Lay-Theme.

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

        Dear @dsinclair
        best is to have a look here:
        http://laytheme.com/documentation.html#custom-css-styling

        And then do a starter tutorial at Codeacademy.

        Best!

        Marius

        www.mariusjopen.world

        1 Reply Last reply Reply Quote 0
        • First post
          Last post
        Post a link to where the problem is
        I don't answer or check forum DMs, please just post on the forum.
        Forgot your key, lost your files, need a previous Lay Theme or Addon version? Go to www.laykeymanager.com

        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

        C
        K
        Q
        L

        Recent Topics

        • L

          HTML

        • M

          Burger menu in desktop and tablet view

        • M

          WPForms Lite not working with new theme update (5.5.5)

        • K

          remove licence from old site

        laytheme.com