Мерцающая навигационная панель-липкий бутстрап 3 ⇐ CSS

[Anonymous]

На моем тестовом веб-сайте есть закрепленная панель навигации. Прикрепленная панель навигации ведет себя хаотично и мерцает при небольшой прокрутке страницы вниз.
Это похоже на то, как если бы панель навигации постоянно пыталась изменить свое положение.

Код: Выделить всё

navbar {
border-width: 1px 0;
-webkit-border-radius: 0;
-webkit-background-clip: padding-box;
-moz-border-radius: 0;
-moz-background-clip: padding;
border-radius: 0;
background-clip: padding-box;
}

.navbar.stick {
position: fixed;
top: 0;
left: 0;
opacity: .85;
}

.navbar-collapse {
-webkit-border-radius: 0;
-webkit-background-clip: padding-box;
-moz-border-radius: 0;
-moz-background-clip: padding;
border-radius: 0;
background-clip: padding-box;
font-family: "Open sans", Helvetica, Arial, sans-serif;
font-weight: 300;
text-transform: uppercase;
}

.navbar-collapse .navbar-nav {
float: none;
margin: 0 auto;
text-align: center;
}

.navbar-collapse .navbar-nav>li {
float: none;
display: inline-block;
}

.navbar-collapse .navbar-nav>li>a {
padding: 20px 30px;
}

.dropdown ul.dropdown-menu {
top: 85%;
text-align: left;
}

.dropdown ul.dropdown-menu>li>a {
padding: 5px 30px;
}

.navbar-default {
background-color: #ffffff;
border-color: #cccccc;
}

.navbar-default .navbar-nav>li>a {
color: #454545;
}

.navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav>li>a:focus {
color: #000000;
background-color: #ffffff;
}

.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus {
color: #000000;
background-color: #ffffff;
}

.navbar-default .dropdown ul.dropdown-menu>li>a {
color: #454545;
}

.navbar-default .dropdown ul.dropdown-menu>li>a:hover {
background-color: #eeeeee;
color: #000000;
}

.navbar-default .navbar-toggle {
border-color: #666666;
}

.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
background-color: #ffffff;
}

.navbar-default .navbar-toggle .icon-bar {
background-color: #333333;
}

.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
border-color: #cccccc;
}

.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:hover,
.navbar-default .navbar-nav>.open>a:focus {
background-color: #ffffff;
color: #000000;
}

#nav-sidebar {
width: 100%;
z-index: 1;
}

Код: Выделить всё

[*]






 Toggle navigation    

[list]
[url=#]Home[/url]
[*][url=#]Sec[/url]
[*][url=#]Contacts[/url]
[/list]

Код: Выделить всё

        
jQuery(document).ready(function($) {

var my_nav = $('.navbar-sticky');
// grab the initial top offset of the navigation
var sticky_navigation_offset_top = my_nav.offset().top;

// our function that decides weather the navigation bar should have "fixed" css position or not.
var sticky_navigation = function(){
var scroll_top = $(window).scrollTop(); // our current vertical position from the top

// if we've scrolled more than the navigation, change its position to fixed to stick to top, otherwise change it back to relative
if (scroll_top > sticky_navigation_offset_top) {
my_nav.addClass( 'stick' );
} else {
my_nav.removeClass( 'stick' );
}
};

var initio_parallax_animation = function() {
$('.parallax').each( function(i, obj) {
var speed = $(this).attr('data-parallax-speed');
if( speed ) {
var background_pos = '-' + (window.pageYOffset / speed) + "px";
$(this).css( 'background-position', 'center ' + background_pos );
}
});
}

// run our function on load
sticky_navigation();

// and run it again every time you scroll
$(window).scroll(function() {
sticky_navigation();
initio_parallax_animation();
});

});

Кроме того, navbar-fixed-top не является решением.
Может кто-нибудь помочь, как сделать его липким?
Заранее спасибо за помощь.

Подробнее здесь: https://stackoverflow.com/questions/793 ... ootstrap-3