1

我试图阻止具有固定位置的右侧元素滚动超出页脚我成功但现在我面临新问题，尽管元素停止在页脚它在停止/滚动时会跳转。我尝试应用 css 转换但仍然不成功，下面是我的部分代码，

<div class="rightside_content">
<a id="" href="">
    <img src="https://dabuttonfactory.com/button.png?t=Your+text+here&f=Calibri-Bold&ts=24&tc=fff&tshs=1&tshc=000&hp=20&vp=8&c=5&bgt=gradient&bgc=3d85c6&ebgc=073763">
</a>
<a id="" href="">
    <img src="https://dabuttonfactory.com/button.png?t=Your+text+here&f=Calibri-Bold&ts=24&tc=fff&tshs=1&tshc=000&hp=20&vp=8&c=5&bgt=gradient&bgc=3d85c6&ebgc=073763">
</a>


<footer class="main_footer">
</footer>

<style>
@media only screen and (min-width: 768px) {
    .rightside_content {
        position: fixed;
        right: 5%;
        width: 22%;
        margin-top: 0;
         /* -webkit-transition: all 0.15s ease; */
        /* -moz-transition: position 15s; */
        /* -ms-transition: position 15s; */
        /* -o-transition: position 15s; */
        /* transition: all 0.15s ease; */
        /* animation: smoothScroll 1s forwards; */
    }
}
</style>

<script>
$(window).scroll(() => {
    var footerToTop = $('.main_footer').offset().top;
    var scrollTop = $(document).scrollTop() + $(window).height();
    var difference = scrollTop - footerToTop;
    var bottomValue = scrollTop > footerToTop ? difference : "inherit";
    $('.rightside_content').css("bottom",bottomValue);
});
</script>

这个问题只能从jquery处理吗？

4

0 回答 0