如何使页面滚动页面滚动

-1

我有一个mailchimp订阅时事通讯表格。我希望窗体随着页面滚动一起向下滚动。如何使页面滚动页面滚动

现在它只是fadeIn,fadeOut当页面滚动但我希望它也向下移动时，用户滚动页面向下。

这是我的html。

<div class="container"> 
    <div class="row"> 
     <div class="pull-right"> 
      <!-- Begin MailChimp Signup Form --> 
      <link href="//cdn-images.mailchimp.com/embedcode/slim-10_7.css" rel="stylesheet" type="text/css"> 
      <form id="subscribe-form" name="mc-embedded-subscribe-form" class="validate"> 
       <p>Sign up for our newsletter</p> 
       <div id="signup_scroll"> 
        <div class="mc-field-group"> 
         <label for="mce-EMAIL">Email Address <span class="asterisk">*</span> 
         </label> 
         <input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL" required> 
        </div> 
        <div class="clear"><input type="submit" value="Submit" name="subscribe" id="subscribe" class="button"></div> 
       </div> 
      </form> 
     </div> 
    </div> 
</div>

var amountScrolled = 300; 
$(window).scroll(function() { 
    if ($(window).scrollTop() > amountScrolled) { 
     $('#subscribe-form').fadeIn('slow'); 
    } else { 
     $('#subscribe-form').fadeOut('slow'); 
    } 
}); 

$('#subscribe-form').click(function() { 
    $('html, body').animate({ 
     scrollTop: 0 
    }, 700); 
    return false; 
});

来源

2016-11-10 Nauman Tanwir

检查了这一点，并从这里开始。 http://stackoverflow.com/questions/12522807/scroll-event-listener-javascript – ScottyDoesKnow

@ScottyDoesKnow你为什么低调投票我的问题？它不是我问过一个公然的问题。 –

好友，我没有downvote你的问题。有人做了。但是我可以看到为什么 – ScottyDoesKnow

我解决它。

HTML

<div class="row newsletter" id="scrollingDiv"> 
     <!-- Begin MailChimp Signup Form --> 

     <link href="//cdn-images.mailchimp.com/embedcode/slim-10_7.css" rel="stylesheet" type="text/css"> 
     <form id="subscribe-form" name="mc-embedded-subscribe-form" class="validate"> 
      <a id="close" onclick="closeDialog()"><i class="fa fa-times" aria-hidden="true"></i></a> 
      <p>Join Our Newsletter!</p> 

      <div id="signup_scroll"> 
       <div class="field-group"> 
        <label for="EMAIL">Email Address <span class="asterisk">*</span> 
        </label> 
        <input type="email" value="" name="EMAIL" class="required email" id="EMAIL" required> 
       </div> 
       <div class="clear"> 
        <input type="submit" id="subscribe" class="button"> 
       </div> 
      </div> 
     </form> 
    </div>

var $scrollingDiv = $("#scrollingDiv"); 

    $(window).scroll(function(){ 
     $scrollingDiv 
      .stop() 
      .animate({"marginTop": ($(window).scrollTop()-30) + "px"}, "slow"); 
    });

来源

2016-11-15 14:49:52

如何使页面滚动页面滚动

回答

相关问题