我想一個div在頁面底部滾動，當用戶滾動

我不能使用自舉爲了這個，我可以使用jQuery我想一個div在頁面底部滾動，當用戶滾動

我有基本的頁面，其中有一個按鈕和一些段落的容器當用戶滾動時，我想將其移動到頁面底部

此外，這應該只發生在移動視圖中。

例如：https://creditcards.chase.com/a1/marriottpremier/8TK?CELL=679Z&nck=120931994&ck=1213078&lk=1000160171

他們用引導

<div> 
<h2>Near<h2> 
<div> 
<button>Learn more<button> 
<p>conditions<p> 
<div>

來源

2016-03-08 Insane Fragger

而不是簡單地提出一個「要求」，請發佈你已經嘗試過，以便我們可以幫助你。 –

我想你想使用'粘'div，請參閱http://stackoverflow.com/questions/2907367/have-a-div-cling-to-top-of-screen-if-scrolled-down-past-它的一些想法 – r8n5n

可能的重複[如何使一個div粘到屏幕的頂部，一旦它被滾動到？]（http://stackoverflow.com/questions/1216114/how-can-i-make-一個div-stick-to-the-the-screen-once-its-been-scroll-to） –

我已經使用jQuery和媒體查詢這個工作。

CSS 
@media only screen and (max-width: 380px) { 


    .fixed { 
     bottom: 0; 
     position: fixed; 
     left: 0; 
     width: 100%; 
     max-width: 374px; 
     margin: 0 auto; 
     background-color: blue; 
     height: 70px; 

     } 
    } 


JQuery 

<script> 
jQuery(document).ready(function() { 

// define variables 
var navOffset, scrollPos = 0; 

// add utility wrapper elements for positioning 
jQuery("nav").wrap('<div class="button1"></div>'); 
jQuery("nav").wrapInner('<div class="inner"></div>'); 
jQuery(".nav-inner").wrapInner('<div class="inner-most"></div>'); 

// function to run on page load and window resize 
function stickyUtility() { 

// only update navOffset if it is not currently using fixed position 
if (!jQuery("nav").hasClass("fixed")) { 
navOffset = jQuery("nav").offset().top; 
} 

// apply matching height to nav wrapper div to avoid awkward content jumps 
jQuery(".nav-placeholder").height(jQuery("nav").outerHeight()); 

} // end stickyUtility function 

// run on page load 
stickyUtility(); 

// run on window resize 
jQuery(window).resize(function() { 
stickyUtility(); 
}); 

// run on scroll event 
jQuery(window).scroll(function() { 

scrollPos = jQuery(window).scrollTop(); 

if (scrollPos >= navOffset) { 
jQuery("nav").addClass("fixed"); 
} else { 
jQuery("nav").removeClass("fixed"); 
} 

}); 

}); 
</script>

來源

2016-03-09 20:03:36

我想一個div在頁面底部滾動，當用戶滾動

回答

相關問題