zoukankan      html  css  js  c++  java
  • jquery-能拖拽宽度的table

    控件官方地址:http://www.bacubacu.com/colresizable/?utm_source=jquer.in&utm_medium=website&utm_campaign=content-curation#samples

    使用【colResizable】第三方插件

    使用方法:

    <head>
      <script src="js/jquery.js"></script>
      <script src="js/colResizable.min.js"></script>
    </head>
    <body>     
      <table width="100%" >
        <tr> <th> header </th> <th> header </th> </tr>
        <tr> <td> cell </td> <td> cell </td> </tr>                            
        <tr> <td> cell </td> <td> cell </td> </tr>                            
      </table>    
    </body>
    
    <script>
    $(function(){
      $("table").colResizable();
    });
    </script>

    属性或方法:

    【模式】resizeMode:[type: string] [default: 'fit'] [version: 1.6] [values: 'fit', 'flex', 'overflow']

    【禁止】disable:[type: boolean] [default: false] [version: 1.0]

    【禁止的列】disabledColumns:[type: array of int] [default: [ ] ] [version: 1.6]

    【激活的拖拽】liveDrag:[type: boolean] [default: false] [version: 1.0]

    【是否支持缓存】postbackSafe:[type: boolean] [default: false] [version: 1.3]

    (如果是低版本的IE需要加上 sessionStorage.js 才能生效,如:IE7 and IE8)

    【局部刷新(ajax)】partialRefresh:[type: boolean] [default: false] [version: 1.5]

    【列高与第一行相同】headerOnly:[type: boolean] [default: false] [version: 1.2]

    【设置抓钩的html】innerGripHtml:[type: string] [default: empty string] [version: 1.0]

    【托转的样式】draggingClass:[type: string] [default: internal css class] [version: 1.0]

    【定义最小宽度】minWidth:[type: number] [default: 15] [version: 1.1]

    【活动手势】hoverCursor:[type: string] [default: "e-resize"] [version: 1.3]

    【拖拽的手势】dragCursor:[type: string] [default: "e-resize"] [version: 1.3]

    【冲刷(只有动态刷新时生效)】flush:[type: boolean] [default: false] [version: 1.3]

    【左margin】marginLeft:[type: string / null] [default: null] [version: 1.3]

    【右margin】marginRight:[type: string / null] [default: null] [version: 1.3]

    【修正】fixed:[DEPRECATED: use resizeMode instead] [type: boolean] [default: true] [version: 1.5 only]

     【==事件==】

    【拖动时触发】onResize:[type: callback function] [default: null] [version: 1.0]

    【拖动后触发】onDrag:[type: callback function] [default: null] [version: 1.1]

  • 相关阅读:
    JAVA类型之间的转换
    Mysql语句
    Tomcat 优化
    JVM原理及调优
    static
    指针与引用
    sizeof
    遇到问题:c++ 直接cout输出char类型变量地址乱码
    编程过程中全面考虑问题的能力
    表、栈和队列
  • 原文地址:https://www.cnblogs.com/King-JJ/p/6542195.html
Copyright © 2011-2022 走看看