Jquery 进入视口时在底部固定按钮

好的。 我想在进入视口时修复底部的一个按钮。 我试着把它修好。 我想知道你对这个问题有什么建议。

---

我尝试了或，但fix元素始终位于顶部。

好的，根据您给我们的信息，我认为您希望并且能够做到这一点。我是从零开始的，所以不要期望一个精确的实现

首先，这里有一个JSFIDLE供您使用：

除了小提琴上的所有额外代码（用于样式和功能），您主要关心jQuery

首先，您将为此设置变量，变量是navContainer和无序列表。您还需要设置一个变量，即“显示“菜单”链接后的浏览器窗口滚动（以像素为单位）：

// browser window scroll (in pixels) after which the "menu" link is shown
var offset = 300;

var navigationContainer = $('#cd-nav'),
    mainNavigation = navigationContainer.find('#cd-main-nav ul');

//hide or show the "menu" link
checkMenu();
$(window).scroll(function(){
    checkMenu();
});

checkMenu功能是魔术发生的地方：

function checkMenu() {
    if( $(window).scrollTop() > offset && !navigationContainer.hasClass('is-fixed')) {
        navigationContainer.addClass('is-fixed').find('.cd-nav-trigger').one('webkitAnimationEnd oanimationend msAnimationEnd animationend', function(){
            mainNavigation.addClass('has-transitions');
        });
    } else if ($(window).scrollTop() <= offset) {
        //check if the menu is open when scrolling up
        if( mainNavigation.hasClass('is-visible')  && !$('html').hasClass('no-csstransitions') ) {
            //close the menu with animation
            mainNavigation.addClass('is-hidden').one('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend', function(){
                //wait for the menu to be closed and do the rest
                mainNavigation.removeClass('is-visible is-hidden has-transitions');
                navigationContainer.removeClass('is-fixed');
                $('.cd-nav-trigger').removeClass('menu-is-open');
            });
        //check if the menu is open when scrolling up - fallback if transitions are not supported
        } else if( mainNavigation.hasClass('is-visible')  && $('html').hasClass('no-csstransitions') ) {
                mainNavigation.removeClass('is-visible has-transitions');
                navigationContainer.removeClass('is-fixed');
                $('.cd-nav-trigger').removeClass('menu-is-open');
        //scrolling up with menu closed
        } else {
            navigationContainer.removeClass('is-fixed');
            mainNavigation.removeClass('has-transitions');
        }
    } 
}

功能检查菜单（）{
if（$（window）.scrollTop（）>offset&&！navigationContainer.hasClass（'is-fixed'））{
navigationContainer.addClass（'is-fixed'）。find（'.cd-nav trigger'）。one（'webkitAnimationEnd-oanimationend-msAnimationEnd-animationend'，function（）{
mainNavigation.addClass（'has-transitions'）；
});
}否则如果（$（window）.scrollTop（）我可以用解决它。
看到了吗

您以前尝试过什么代码，结果如何？您是否有任何特定错误？我们需要更多信息。如果没有上下文，您可以尝试
。粘性按钮{位置：固定；底部：0；左侧：50%；}
$(function () {
  $('p.inviewOne').one('inview', function (event, visible) {
      if (visible) {
          $(this).text('Single bound found - I won\'t change again.').addClass('fixed');
      }
  });

  $('p.inview').bind('inview', function (event, visible) {
    if (visible) {
      $(this).text('Yay! You can see me!');
    } else {
      $(this).text('Hidden again. Muhahah!');
    }
  });
});