• 2015.5.29日总结


    1.今天主要看了下滚动条的实现

    具体代码如下:

    <script>
                j$(function(){
    
                    j$(window).resize(function() {
                        j$('.scroller1').width(j$('#centerContent').width()-2);
                        j$('.scroller2').width(j$('#centerContent').width()-2);
                    });
    
                    j$('.scroller1').width(j$('#centerContent').width()-2);
                    j$('.scroller2').width(j$('#centerContent').width()-2);
    
                    j$(".scroller1").scroll(function(){
                        j$(".scroller2").scrollLeft(j$(".scroller1").scrollLeft());
                    });
                    j$(".scroller2").scroll(function(){
                        j$(".scroller1").scrollLeft(j$(".scroller2").scrollLeft());
                    });
                });
        </script>
    

      

    <apex:outputPanel layout="block" rendered="{!isExtraColumn}" styleClass="scroller1">                            
                                <div class="scroller1content"></div>                            
                            </apex:outputPanel>
                            <div class="{!IF(isExtraColumn, 'scroller2', '')} lightGreyBg">
                                <table class="regTable p10 {!IF(isExtraColumn, 'scroller2content', '')}" cellspacing="0">
                                    <apex:repeat value="{!productSKURows}" var="productSKURow">
    

      

    .scroller1, .scroller2 {
               300px;
              overflow-x: scroll;
              overflow-y:hidden;
            }
    
            .scroller1 {height: 20px; }
    
            .scroller2{
                height:400px;
                overflow-y:scroll;
            }
    
            .scroller1content {
              1500px;
              height: 20px;
            }
    
            .scroller2content {
              1500px;
              overflow: auto;
            }
    

      效果如图所示:

    其中方法j$(window).resize()是指当浏览器窗口大小发生变化时将会执行此方法,j$(".scroller2").scrollLeft()方法获取滚动条的水平位置。

     
  • 相关阅读:
    systemctld 启动理解
    公私钥(证书)理解
    布隆过滤器
    python linux下dbg
    iOS基础尺寸图
    metadataObjectTypes 详解
    pkg_config_path 环境变量设置 教程
    Cloning failed using an ssh key for authentication, enter your GitHub credentials to access private 解决方案
    docker php安装GD扩展
    mysql 隔离级别
  • 原文地址:https://www.cnblogs.com/Aaronqcd/p/4537862.html
Copyright © 2020-2023  润新知