Only users with a registered purchase of Avada can post to the community forum. Please register your purchase here.
Only users with a registered purchase of Avada can post to the community forum. Please register your purchase here.

Forum Replies Created

Viewing 15 posts - 1 through 15 (of 616 total)
  • Author
    Posts
  • marklchaves
    Participant
    Post count: 618

    Hi,

    You just want a carousel slider showing images with a hover overlay? Something like this?

    https://codepen.io/marklchaves/pen/zYvbLwv

    marklchaves
    Participant
    Post count: 618

    Hi Pete,

    Thanks for providing the link to your page.

    See my proposed solution: https://codepen.io/marklchaves/pen/rNORqXE

    marklchaves
    Participant
    Post count: 618
    in reply to: Main menu text #746778

    Hi,

    You can try adjusting the top padding. It’s a bit of a hack, so play around with it to see if it works for you.

    
    .menu-text {
        padding-top: 30px;
    }
    

    How to add CSS to WordPress.

    marklchaves
    Participant
    Post count: 618

    Use can use CSS.

    E.g.

    
    .my-scroll-list-container {
      overflow-y: scroll;
    }
    

    Assign the .myscroll-list-container class to the element you want to have the scroll. This might be a bit tricky in Avada because of all the div wrappers Avada uses. Yell, if you have any questions or share the link to your page.

    Good luck!

    marklchaves
    Participant
    Post count: 618

    Try using a search and replace plugin.

    Or, if you are fluent in SQL, use phpMyAdmin and run your update queries manually.

    Good luck!

    marklchaves
    Participant
    Post count: 618

    Hello Rupert,

    Have you tried this CSS yet?

    
    .fusion-toggle-heading {
        font-size: 2em; /* Use !important if needed. */
    }
    

    How to add CSS to WordPress.

    marklchaves
    Participant
    Post count: 618

    Hello @jetxpert-envato,

    Sorry if I wasn’t clear. I’m suggesting a JavaScript solution since CSS will only get you two settings: smooth and auto.

    The CSS that you quote above is for styling my toTop button. scroll-behavior is what you want to adjust if you opt for the CSS-only solution.

    For a JavaScript solution see my CodePen. In the CodePen write up, it tells you which function to look for and what argument to pass for controlling the scroll speed.

    I hope that helps! 🙂

    marklchaves
    Participant
    Post count: 618

    Have you tried this?

    
    .title-heading-center-fusion-responsive-typography-calculated {
      line-height: .8 !important;
    }
    
    marklchaves
    Participant
    Post count: 618

    Both of these examples worked for me. Use either/or, not both.

    
    @media screen and (max-width: 500px) {
      .fusion-header {
        /* Set the alpha to something very small. */
        background: rgba(0,0,0,0.01) !important;
      }
    }
    
    @media screen and (max-width: 500px) {
      .fusion-header {
        /* Use a transparent image with nothing in it. */
        background: url(http://avada.local/wp-content/uploads/2020/05/clear-mobile-bg-image.png) !important;
      }
    }
    
    marklchaves
    Participant
    Post count: 618

    You can use negative margins on the elements you want to overlap onto another element. Here’s an example.

    marklchaves
    Participant
    Post count: 618

    Hi,

    Have you tried changing the Offset of Animation to “Bottom of element enters viewport”.

    Search on “Extras tab” here for more info.

    marklchaves
    Participant
    Post count: 618
    in reply to: Remove Margin #740680

    Hi, the top/bottom 15px margins are for the div you are showing us.

    Did you try using !important since those margins are being set inline?

    marklchaves
    Participant
    Post count: 618

    Hi @sinn,

    The code you copied will only work if you have a my-class assigned to all the content elements on your site. This is not exactly easy to do. Furthermore, the em units in the example are “less” sensitive to change.

    I explain the differences of the units on CodePen.

    Good luck!

    marklchaves
    Participant
    Post count: 618

    Hi @Jetxpert-Envato,

    CSS has the scroll-behavior property. It can take auto and smooth. That’s pretty much it. Here’s an example from MDN.

    
    scroll-container {
      display: block;
      width: 350px;
      height: 200px;
      overflow-y: scroll;
      scroll-behavior: smooth;
    }
    

    There are plenty of jQuery solutions out there using the animate API.

    I put together a vanilla JavaScript option if you are interested.

    If you want to implement this in Avada, I would recommend disabling Avada’s toTop. Then, you can add your custom code using my example. I would proably make it a plugin so it’s easier to manage, etc.

    Enjoy!

    marklchaves
    Participant
    Post count: 618

    Not sure what’s going on with the code in those sliders.

    For some reason, the CSS is setting your separators to display: none;.

    If you add this CSS, they will show up.

    
    /* Force the separators to display. */
    .fusion-border-below-title .title-sep-container {
        display: block !important;
        height: 8px;
    }
    

    On one slide the separators are on the sides. On the other slides, they are on the top and bottom. Not sure why.

    Adding CSS to WordPress.

Viewing 15 posts - 1 through 15 (of 616 total)