发新帖

[web前端] div 随浏览器滚动条 滚动

零下一度 2019-3-15 989
$(function(){
    $('.table_nav_fixed_table').css('width','100%'); 
})
$(window).resize(function(){
    tab_nav_jk();
});
$(window).scroll(function() { 
    tab_nav_jk();
})
function tab_nav_jk(){
    var scrollTopHeight = $(this).scrollTop();
    var scrollLeftWidth = $(this).scrollLeft();
    var top = $('#table_nav_box').offset().top;
    var width = $('#table_nav_box').width(); 
    var thHeight = $('#table_nav_box').find('th').eq(0).height();   
    if (scrollTopHeight > top) {    
        $('#float_box_fixed').css({'position':'fixed','_position':'fixed','z-index':'999','_clear':'both','margin-left':'-'+scrollLeftWidth+'px','top':'0px','_top':'0px','width':width+'px','display':'block','height':thHeight+'px'});
        $('.table_nav_fixed_table').css('width',width+'px');
        $('.table_nav_fixed_table').css({'display':'block','height':thHeight+'px'}); 
        $('.table_nav_fixed_table tr ,.table_nav_fixed_table th').css({'height':thHeight+'px'}); 
        var w = $('.table_nav_fixed_table th').attr('w'); 
        if(w == '' || w == undefined){
            var thWithArr = [];
            $('#table_nav_box').eq(0).find('th,td').each(function(i){
                thWithArr[i] = $(this).width(); 
            })
            var nav_padding = $('#table_nav_box').attr('nav-padding');
            $('.table_nav_fixed_table tr').eq(0).find('th').each(function(i){
                $(this).attr('w','2'); 
                if(nav_padding == '' || nav_padding == undefined){
                    $(this).css({'width':(thWithArr[i])+'px','padding-left':'5px','padding-right':'5px'});
                    if(i <= (thWithArr.length-1)&&i>=(thWithArr.length-2)){ 
                        $(this).css({'width':(thWithArr[i]+1)+'px','padding-left':'5px','padding-right':'5px',});
                    }
                }
                else{
                    $(this).css({'width':(thWithArr[i])+'px','padding':'0px'});
                    if(i <= (thWithArr.length-1)&&i>=(thWithArr.length-4)){ 
                        $(this).css({'width':(thWithArr[i]+1)+'px','padding':'0px'});
                    } 
                }
                if(i==(thWithArr.length-1)){
                    $(this).css({'border-right':'0px'});
                } 
            });
        } 
    } else {  
        $('#float_box_fixed').css('display','none'); 
        $('.table_nav_fixed_table').css('display','none');
    }
}
<div id="float_box_fixed" class="div" style="display:none"> 
    <table cellpadding="3" cellspacing="1" class="table_nav_fixed_table" style="display:none">
         <tr>
            <th>NO</th>
         </tr>
    </table>
</div>
<table cellpadding="3" cellspacing="1">
  <tr id="table_nav_box">
   <th>NO</th>
  <tr>
</table>


最新回复 (0)
返回
零下一度
主题数
931
帖子数
0
注册排名
1