如何使頁面滾動頁面滾動

-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

如何使頁面滾動頁面滾動

回答

相關問題