 
<script type="text/javascript"> 
(function($){ 
var ele_fix = $("#div_right"); //浮動(dòng)窗口 
var _main = $(".main"); //浮動(dòng)區(qū)域 
var ele_offset_top = ele_fix.offset().top; //浮動(dòng)區(qū)域高度 
$(window).scroll(function(){ 
var scro_top = $(this).scrollTop(); //當(dāng)前高度 
var fix_foot_pos = parseInt(ele_fix.height())+parseInt(scro_top)-10; //浮動(dòng)框最底部到最頂部高度 
var mainpos = parseInt(_main.offset().top)+parseInt(_main.height()); 
if(scro_top <= ele_offset_top&&fix_foot_pos<mainpos){ 
ele_fix.css({position: "static", top: -10}); 
}else if(scro_top>ele_offset_top&&fix_foot_pos<mainpos){ 
ele_fix.css({position: "fixed", top: -10}); 
}else if(scro_top>ele_offset_top&&fix_foot_pos>mainpos){ 
var posi = mainpos-fix_foot_pos-10; 
ele_fix.css({position: "fixed", top: posi}); 
} 
}); 


/* 

//方案二 
$(window).bind("scroll",function() { 
var temp = '1165'; 
//判斷往下滾 
if ($(document).scrollTop() > temp) { //如果大于這個(gè)高度，就置頂 
flag = false; 
$('#div_right').css({'position':'fixed', 'top':'-10px', 'margin-top':'0px'}); 
} 

if ($(document).scrollTop() <= temp) { //如果小于這個(gè)高度，則恢復(fù)原來狀態(tài) 
flag = true; 
$('#div_right').css('position',''); 
} 
}); 


*/ 

})(jQuery); 
</script> 

您可能感興趣的文章:

相關(guān)文章

基于JavaScript實(shí)現(xiàn)在線網(wǎng)頁煙花效果
這篇文章主要為大家詳細(xì)介紹了如何利用JavaScript實(shí)現(xiàn)簡單的在線網(wǎng)頁煙花效果，文中的示例代碼講解詳細(xì)，感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下
2023-02-02
Javascript中Microtask和Macrotask鮮為人知的知識點(diǎn)
這篇文章主要為大家介紹了Javascript中Microtask和Macrotask鮮為人知的知識點(diǎn)講解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步早日升職加薪
2022-04-04
JavaScript實(shí)現(xiàn)alert彈框效果
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)alert彈框效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-11-11
JS幻燈片可循環(huán)播放可平滑旋轉(zhuǎn)帶滾動(dòng)導(dǎo)航(自寫)
本文為大家介紹下實(shí)現(xiàn)JS幻燈片可循環(huán)播放帶滾動(dòng)導(dǎo)航可平滑旋轉(zhuǎn)的全過程，效果還不錯(cuò)，由需要的朋友可以參考下，希望對大家有所幫助
2013-08-08
GoJs中導(dǎo)出圖片或者SVG實(shí)現(xiàn)示例詳解
這篇文章主要為大家介紹了GoJs中導(dǎo)出圖片或者SVG實(shí)現(xiàn)示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2023-05-05
理解javascript正則表達(dá)式
這篇文章主要為大家詳細(xì)介紹了javascript正則表達(dá)式，由淺入深的幫助大家學(xué)習(xí)正則表達(dá)式，感興趣的小伙伴們可以參考一下
2016-03-03
詳解微信小程序開發(fā)聊天室—實(shí)時(shí)聊天，支持圖片預(yù)覽
這篇文章主要介紹了微信小程序?qū)崟r(shí)聊天支持圖片預(yù)覽，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-05-05
Javascript中常用類型的格式化方法小結(jié)
這篇文章主要給大家介紹了Javascript中常用類型的格式化方法，其中包括格式化浮點(diǎn)數(shù)、格式化有符號整數(shù)(int32)、格式化無符號整數(shù)(uint32)、格式化布爾值以及格式化字符串等，文中給出了詳細(xì)的示例代碼，有需要的朋友們可以參考借鑒，下面來一起看看吧。
2016-12-12
js前端如何寫一個(gè)精確的倒計(jì)時(shí)代碼
關(guān)于寫倒計(jì)時(shí)大家可能都都比較熟悉，使用 setTimeout 或 setInterval 就可以搞定。幾秒鐘或者幾分鐘的倒計(jì)時(shí)這樣寫沒有問題，但是如果是長時(shí)間的倒計(jì)時(shí)，這樣寫就會(huì)不準(zhǔn)確
2019-10-10
javascript實(shí)現(xiàn)點(diǎn)擊后變換按鈕顯示文字的方法
這篇文章主要介紹了javascript實(shí)現(xiàn)點(diǎn)擊后變換按鈕顯示文字的方法,可實(shí)現(xiàn)顯示一些按鈕如果點(diǎn)擊了,按鈕文本變?yōu)椤包c(diǎn)了”,其他按鈕文本變?yōu)椤皼]點(diǎn)”的效果,非常具有實(shí)用價(jià)值,需要的朋友可以參考下
2015-05-05