Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • January 31, 2014 at 5:28 pm #217538
    lapajnea

    Hello,

    we have your Enfold theme installed and wanted to add a floating call-to-action button, but we are experiencing some troubles.

    What we did is, we added a button in the quick css section and this is our code:

    #beta .avia-button-center {
    position: fixed;
    top: 150px;
    left: 85%;
    z-index: 9000;
    }
    #beta {
    margin-bottom: -50px;
    }

    The problem is, the button disappears behind images, jumps a few pixels while scrolling (in Chrome) or text bolds (in FireFox).
    You can check it out at http://zebra.bi/

    Any idea how to make a more stable version of a floating button?
    Any help will be greatly appreciated.

    Thank you, and awesome job on the Enfold theme, we love it!

    February 1, 2014 at 11:05 am #217752
    lapajnea

    Just a brief explanation:
    On the frontpage, I have used a color section (ID = beta) and put the button inside. Then I have repositioned the button and hidden the color section with the above CSS.

    The only real problem is that on page load, the full slider image covers the button. When I scroll down it shows up again. If you can just help us solve this problem, we would be really grateful and it would be perfect!

    Thank you!

    February 2, 2014 at 2:14 am #218332
    Ismael

    Hey!

    Please add this:

    #beta {
z-index: 99999;
}

    Regards,
    Ismael

    February 2, 2014 at 8:44 pm #218503
    lapajnea

    Thank you Ismail, this solved it :)

    You are the best!

    Regards, A.

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Floating button’ is closed to new replies.