ScrollMagic引脚贯穿同一类的div

时间:2019-03-07 16:53:55

标签: scrollmagic pinning

我正在尝试固定地图,因为同一类别的多个div经过,然后在获得积分时取消固定。到目前为止,我还没有找到一种可以在需要的时候完全释放引脚的方法。请问有人有见识吗?

html:

<div class="hotel" id="screen-ellis">
   <div id="map"></div>
   (some content here)
</div>
<div class="hotel"></div> //various amounts of content in each hotel
<div class="hotel"></div> 
<div class="hotel"></div> 
<div class="hotel"></div> 
<div class="hotel"></div> 
<div class="hotel"></div> 
<div class="hotel"></div>
<div class="credits"></div> //unpin the map here

jquery:

 var section = $('.hotel').height();
 var heightAllHotels = 0;

 $('.hotel').each(function() {
     heightAllHotels += $(this).outerHeight();
 }); //get height of all the hotels together

 var scene = new ScrollMagic.Scene({ //pin map
    triggerElement: "#screen-ellis", //the first hotel
    duration: heightAllHotels, //ends too soon
    triggerHook: 'onLeave'
 }).setPin("#map", {pushFollowers: false})
 .addTo(controller);    

0 个答案:

没有答案