Klebrige Seitenleiste überlappt die Fußzeile?

Question

Ich habe benutzerdefinierte klebrige Seitenleiste für ADS erstellt, es funktioniert, aber es gibt ein Problem. Wenn ich es nach unten scrolle, überschneidet es sich mit der Fußzeile. Bitte überprüfe. - http://screencast.com/t/oEjcrbocB05C

var stickySidebar = $('.sticky'); 
 

 
if (stickySidebar.length > 0) { 
 
    var stickyHeight = stickySidebar.height(), 
 
     sidebarTop = stickySidebar.offset().top; 
 
} 
 

 
// on scroll move the sidebar 
 
$(window).scroll(function() { 
 
    if (stickySidebar.length > 0) { 
 
    var scrollTop = $(window).scrollTop(); 
 
      
 
    if (sidebarTop < scrollTop) { 
 
     stickySidebar.css('top', scrollTop - sidebarTop); 
 

 
     // stop the sticky sidebar at the footer to avoid overlapping 
 
     var sidebarBottom = stickySidebar.offset().top + stickyHeight, 
 
      stickyStop = $('.main-content').offset().top + $('.main-content').height(); 
 
     if (stickyStop < sidebarBottom) { 
 
     var stopPosition = $('.main-content').height() - stickyHeight; 
 
     stickySidebar.css('top', stopPosition); 
 
     } 
 
    } 
 
    else { 
 
     stickySidebar.css('top', '0'); 
 
    } 
 
    } 
 
}); 
 

 
$(window).resize(function() { 
 
    if (stickySidebar.length > 0) { 
 
    stickyHeight = stickySidebar.height(); 
 
    } 
 
});

.sticky { 
 
    position: relative; 
 
    top: 0; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

prüfen für Website-URL ist - http://www.test2.guru99.com/java-tutorial.html

Bitte helfen Sie mir!

Answer 1

Ändern Sie bitte Ihre folgende CSS

#rt-footer-surround { 
    background-color: #3f3f3f; 
    color: #f8f8f8; 
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.1); 
} 

Hierzu hinzufügen position:relative und z-index:1

#rt-footer-surround { 
    background-color: #3f3f3f; 
    color: #f8f8f8; 
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.1); 
    position: relative; 
    z-index: 1; 
}