Я работаю на веб-странице с навигационной панелью. Этот navbar имеет два div, один для логотипа и другой для меню. Оба divs первоначально находятся в одной и той же позиции Y, но когда я пытаюсь вывести меню div, он меняет начальную позицию Y вниз.ScrollMagic pin изменяется начальная позиция Y закрепленного элемента
Почему? Заранее спасибо!
Я изолировал проблему в codepen: http://codepen.io/aitormendez/pen/NbvpXj
Удаление JS из codepen, меню DIV становится в исходном положении Y.
HTML:
<body>
<header class="banner">
<nav class="navbar">
<div class="navbar-brand-container">
<a class="navbar-brand" href="#"><div class="logo-int">Logo</div></a>
</div><div class="menu-1">
<p>Menu 1</p>
</div>
</nav>
</header>
</body>
JS:
var controller = new ScrollMagic.Controller();
// Pin menu-1
var pinM1Scene = new ScrollMagic.Scene({
triggerElement: '.menu-1',
triggerHook: 0
})
.setPin('.menu-1')
.addTo(controller);