我正在尝试固定地图,因为同一类别的多个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);