Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • November 4, 2013 at 10:35 pm #184501
    dsgnerfw

    Hi guys, I need some help regarding changing the hover colors.

    1.) For learn more button on the layer slider , I want to change it to a:hover { background-color:white; }

    Do I need to use the custom css in the layer slider options ? If I use a:hover etc in the layer slider > for example on an object why doesn’t it work?

    2.) Learn more about tanya and watch her videos here , change here text color hover to white.

    3.) See event calendar black button > change background hover color to white

    4.) Social media icons below > how do I make the big icons hoverable ? I want their colors to change to red or blue.

    Thanks !

    November 4, 2013 at 10:36 pm #184502
    dsgnerfw
    This reply has been marked as private.
    November 5, 2013 at 1:33 am #184563
    Ismael

    Hey!

    1.) Edit the button layer then go to Attributes panel. Give it a unique id like “learn-more-button. Use it on your Quick CSS field.

    #learn-more-button:hover {
color: blue;
background: white;
}

    2.) Please give it a css selector id or class.

    3.) You can use this for the black events button:

    .avia-button.avia-icon_select-yes.avia-color-custom.avia-size-small.avia-position-center {
background-color: red;
border-color: red;
color: blue;
}

    4.) Use this:

    .main_color.iconbox_top .iconbox_icon:hover {
background-color: blue;
}

    Best regards,
    Ismael

    November 5, 2013 at 2:45 am #184588
    dsgnerfw

    Hi Ismael ,

    I added a “learnmore” attributes id and used this >

    #learnmore:hover {

    background-color: #FFFFFF;
    text-decoration:none;

    }

    <<< It works but the background color is a small line below ?

    3.) It doesn’t work.

    4.) Thanks it works well.

    November 5, 2013 at 8:55 pm #184943
    Yigit

    Hi!

    1) Please change Ismael’s code with following one

    #learnmore:hover { background-color: #FFFFFF; text-decoration:none; border-color: white; }

    3)

    .avia-builder-el-14 .avia-button:hover { background-color: white!important; }

    Best regards,
    Yigit

    November 6, 2013 at 2:59 am #185030
    dsgnerfw

    Hi , the learn more button still doesn’t work.

    November 7, 2013 at 3:19 am #185447
    Ismael

    Hi!

    There are lots of Learn More button on the slider. Did you add an attribute to each of them? Please use the class attribute if you’re planning to add the same style on every learn more button.

    Best regards,
    Ismael

    November 7, 2013 at 6:21 am #185492
    dsgnerfw

    Hi , I added an attribute to each of them

    slide > learnmore

    slide 2 > lmoretwo

    slide 3 > lmorethree

    slider 4 > lmorefour

    So should I use class on all of them ?

    November 7, 2013 at 6:42 am #185494
    Josue

    Hi!

    Yes, or you could use nth-child, but i think that may be a little bit more tricky.

    Cheers!
    Josue

    November 7, 2013 at 7:31 am #185502
    dsgnerfw

    That boggles my mind =( Do you guys know any enfold sites that use hover background color change on buttons ?

    Tried h4.learnmore:hover and it doesn’t work

    > I used an h4 tag on the text

    November 7, 2013 at 10:33 pm #185835
    Yigit

    Hey!

    Seems like you have removed the content from your page. If you have created elsewhere, can you post the link to that page? And if you do not mind, please create a temporary admin login and post it here privately so we can take a look at it personally

    Cheers!
    Yigit

    November 8, 2013 at 12:44 am #185910
    dsgnerfw
    This reply has been marked as private.
    November 8, 2013 at 12:51 am #185913
    Yigit

    Hi!

    Changes are done. Please review your website

    Cheers!
    Yigit

    November 8, 2013 at 1:52 am #185939
    dsgnerfw

    Thank you , it works now =)

    Amazing

  • Author
    Posts
Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘All about changing hover colors’ is closed to new replies.