Streaming live at 10am (PST)

Need help getting link block to stay at bottom of section

I added some code to get the sections on a single page site to adjust to the window height, and it works fine. I am trying to make previous / next buttons to stay at the bottom of these individual sections given that the height is now variable. Any ideas are much appreciated, thanks.

Have you tried absolute positioning? You have to set your section or the container (whatever you want it to be relative to) to be Position: Relative. Then set your object you want to be at the bottom to be Position Absolute. There are some presets there to help you.

Let me know if this helps!

That worked great, thanks! Now I just need to figure out how to use jquery to highlight the navigation links when the section is scrolled over. Any ideas?

@theredonem got it figured out here:

I asked him to give us a quick tutorial on how to do this. @theredonem can you post it in the Tricks and Tips category? People will looooove you! :wink:

Hi, what code did you use for this? Would love to add this feature to my site.

Thanks,
Jonathan

<style type="text/css">
div.full-page {
    width:100%;
}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<script>
$(document).ready(function(){
    vpw = $(window).width();
    vph = $(window).height();

    $('.full-page').height(vph);
});
</script>

Sorry, little bit of newbie over here. Can you guide me as to what I need to change in the code and any other modifications I may need to make?

You should look at Tips & Tricks stuff more often :wink:

I just came up with another idea which I will post on the thread above too. We can not only set the height on document loading, but also on window resize. Just like this:

$(function(){
    $(document).ready(function() {
        vph = $(window).height();
        $('.full-page').css('height',vph);
    });
    
    $(window).resize(function(){
        vpw = $(window).width();
        vph = $(window).height();
        
        $('.full-page').css('height',vph);
    });
});