How can I make a div scroll with page and stop at footer?

Discussion in 'HTML & Website Design' started by Matt Crux, Mar 24, 2017.

  1. #1
    Hi,

    I'm having a problem trying to figure out how to make a div scroll with the page and stop at a certain point so that it doesn't go over the footer. Here's a quick video explaining what I'm trying to accomplish. Thanks for any help you can offer me in getting this problem solved!


    [video]
     
    Matt Crux, Mar 24, 2017 IP
  2. Matt Crux

    Matt Crux Greenhorn

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    11
    #2
    Hey I figured out this so far from a demo I found.... My problem is that the yellow sidebar attaches to the footer like a magnet when it gets too close to it instead of being a smooth transition that stops when it hits it. Any ideas as to why this could be happening? Thanks

    http://phoenixlove.net/fun/
     
    Matt Crux, Mar 24, 2017 IP
  3. daniel27lt

    daniel27lt Active Member

    Messages:
    109
    Likes Received:
    6
    Best Answers:
    1
    Trophy Points:
    98
    Digital Goods:
    4
    #3
    What you're needing is what is called a "Sticky Floater". I also noticed you're using Wordpress, so this makes the job a whole lot easier. I would recommend installing the plugin found here:

    https://wordpress.org/plugins/q2w3-fixed-widget/

    This will create a widget for you. So what you will be needing to do is create this as a side, using the sidebar.php files within your theme. Then create a widget. Then when you install this plugin I recommended, you'll be able to set the sidebar you have created within this plugin, which should be now set up as a widget.

    I know it's not as easy as I make it out to be. If you don't know PHP I would suggest hiring a freelancer to do this for you. Which I wouldn't pay any more than $30-40 for this project. So use Freelance.com and post this job up and get your project a budget of $30.

    I hope this has helped. But keep in mind, it's called a "Sticky Floater", so search for this term will bring more related queries for you.
     
    daniel27lt, Mar 29, 2017 IP