Category Archives: HTML/JQuery

Your web site should be built around your "vision" and your "business requirements"

Sticky nav and ad above it scrolling setup

If you have a sticky navigation for you website and like to add an ad above it where sticky navigation will show under the ad and when you start scrolling it will move up until navigation is at the top and stick after that.

This is what you need to do.

Make sure you have jquery on your site.


$(document).ready(function() {
//Find the height of the ad
var adh = $('#ad_ID').height();
$(window).scroll(function () {
if ($(window).scrollTop() > adh) {
$('#nav_ID').addClass('nav-fixed-class');
}
if ($(window).scrollTop() < adh) { $('#nav_ID').removeClass('nav-fixed-class'); } }); });