Okay
  Public Ticket #3965842
Underline Link Text on Rollover
Closed

Comments

  •  11
    Eric started the conversation

    Hey guys...

    While I really like the underline rollover effect when using a responsive text item, however we need this reversed so that the underline only happens on rollover. Is there possibly an easy way to simply reverse this and if not is there a simple way to achieve this with an extra class, animated line function via css?

    Thanks in advance!

    4386219898.png







  •  9,242
    Tahir replied

    Hey Again,

    Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):

    
    @keyframes nectar_ltr_line_animation_start  {
        0% {
            background-size: 100% 2px
        }
    
        100% {
            background-size: 0 2px
        }
    }
    
    @keyframes nectar_ltr_line_animation{
        0% {
            background-size: 0 2px
        }
    
        100% {
            background-size: 100% 2px
        }
    }
    

    Thanks


    ThemeNectar Support Team 

  •  11
    Eric replied

    As always, THANK YOU Tahir. 


    Works perfect...however on page load the underline / hover state is already showing. Is there a quick line that we can add to this so the lines appear only on hover?

  •  2,083
    Judith replied

    Hi Eric

    Thanks for writing back.

    To assist you better, we'd love to have a closer look at your setup and to do this, we'll need admin login credentials 

    (dashboard URL, username, password) to your site. This will enable us to conduct a more in-depth investigation of the issue based on your specific configurations. Would you mind sharing this with us? 

    If you prefer, you can safely share the access through an access plugin such as Controlled Admin Access.

    Before you provide this information, we strongly recommend taking a backup of your site.

    If you have any concerns or questions about this process, please don't hesitate to let me know.

    Best regards,

  •  11
    Eric replied

    Thanks. There was a conflict between controlled Admin access and another one of my plugins so other than granted access via WP credentials so I don't have an easy way of doing this. 

    I am however thinking the lines being present on page load could be rolled back easily with an on load script, but just can't get it quite right. Let me know if there might be something easy here, otherwise I can set you back up with site credentials.

    Thanks!

  •  2,083
    Judith replied

    Hi Eric,

    Thanks for writing back.

    Unfortunately, we currently don't have a way to roll back page load.

    This would require some extensive customization which I'm afraid we are not able to offer due to support scope limitations.

    However, we are partnered with a trusted provider of expert-level Salient customization. If you are interested in initiating a project, we recommend referring to our guide at the following link: https://themenectar.com/salient/customization/

    In the meantime, please don't hesitate to reach out with further questions. We're happy to help.

  •  11
    Eric replied

    Perhaps I'm complicating this. The custom css Tahir provided designated the hover state to be underlined instead of the line disappearing. When the page loads it is by default on it's hover (or underlined state) so all I'm looking for is the links to NOT be on its rollover state when the page loads. Perhaps this is something more complex than I'm thinking...but the client is really picky and we'd be so grateful if there was an easy solution. 

    Thank you guys!

  •  2,083
    Judith replied

    Hi Eric

    Thanks for writing back.

    To assist you better, we'd love to have a closer look at your setup and to do this, we'll need admin login credentials 

    (dashboard URL, username, password) to your site. This will enable us to conduct a more in-depth investigation of the issue based on your specific configurations. Would you mind sharing this with us? 

    If you prefer, you can safely share the access through an access plugin such as Controlled Admin Access.

    Before you provide this information, we strongly recommend taking a backup of your site.

    If you have any concerns or questions about this process, please don't hesitate to let me know.

    Best regards,

  •   Eric replied privately
  •  9,242
    Tahir replied

    Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):

    html .nectar-link-underline-effect a {
        background-size: 0% 2px;
    }
    

    Thanks


    ThemeNectar Support Team 

  •  11
    Eric replied

    Works perfect! THANK YOU GUYS!