精华内容
下载资源
问答
  • 因为表格太长,因此需要给个做横向的滚动条,好让表格横向数据列太多能滚动查看不至于全挤在一起、不知道怎么做。使用style="overflow-x: auto; overflow-y: auto; width:200px;的情况是 在不刷新页面的情况下,...
  • 横向表格

    千次阅读 2014-08-29 12:57:54
    * @brief 横向表格功能,相比使用scrollview可以优化内存 * @author huangyibiao */ @interface HYBHorizontalTableView : UIView @property (nonatomic, retain) UITableView *tableView; @property (nonatomic...
    //
    //  HYBHorizontalTableView.h
    //  PersonalShoppingMall
    //
    //  Created by ljy-335 on 14-8-28.
    //  Copyright (c) 2014年 uni2uni. All rights reserved.
    //
    
    #import <UIKit/UIKit.h>
    
    @class HYBHorizontalTableView;
    
    /*!
     * @brief 表格数据源代理
     */
    @protocol HYBHorizontalTableViewDataSource <NSObject>
    
    @required
    /*!
     * @brief 指定行高
     * @param tableView 当前表格对象
     * @param index 指定行号
     * @return 返回指定的行号的行宽
     */
    - (CGFloat)horizontalTableView:(HYBHorizontalTableView *)tableView widthForIndex:(NSInteger)index;
    
    /*!
     * @brief 指定行数
     * @param tableView 当前表格对象
     * @return 返回行数
     */
    - (NSInteger)numberOfIndexForTableView:(HYBHorizontalTableView *)tableView;
    
    /*!
     * @brief 设置行显示的内容
     * @param tableView 当前表格对象
     * @param contentView 是在-horizontalTableView:targetRect:forIndex:这里设置的UI视图,这一步需要
     *                    更新控件显示的内容,比如,设置的是imageView,则这里可以修改imageView.image属性
     * @param index 指定行号
     */
    - (void)horizontalTableView:(HYBHorizontalTableView *)tableView
                 setContentView:(UIView *)contentView
                       ForIndex:(NSInteger)index;
    
    /*!
     * @brief 指定行内容的rect
     * @param tableView 当前表格对象
     * @param targetRect index行下cell要显示的视图的rect
     * @param index 指定行号
     * @return index行下的视图UI布局
     */
    - (UIView *)horizontalTableView:(HYBHorizontalTableView *)tableView
                         targetRect:(CGRect)targetRect
                           forIndex:(NSInteger)index;
    
    @end
    
    /*!
     * @brief 表格响应代理
     */
    @protocol HYBHorizontalTableViewDelegate <NSObject>
    
    @optional
    /*!
     * @brief 点击行代理方法
     * @param tableView 当前点击的表格对象
     * @param index 点击的行号
     */
    - (void)horizontalTableView:(HYBHorizontalTableView *)tableView selectIndex:(NSInteger)index;
    /*!
     * @brief 滚动到行的代理方法
     * @param tableView 当前表格对象
     * @param index 滚动到的指定的行号
     */
    - (void)horizontalTableView:(HYBHorizontalTableView *)tableView scrollToIndex:(NSInteger)index;
    
    @end
    
    
    /*!
     * @brief  横向表格功能,相比使用scrollview可以优化内存
     * @author huangyibiao
     */
    @interface HYBHorizontalTableView : UIView
    
    @property (nonatomic, retain) UITableView                          *tableView;
    @property (nonatomic, assign) id<HYBHorizontalTableViewDataSource> dataSource;
    @property (nonatomic, assign) id<HYBHorizontalTableViewDelegate>   delegate;
    @property (nonatomic, assign) NSInteger                            currentIndex;
    @property (nonatomic, assign) BOOL                                 pagingEnabled;
    
    /*!
     * @brief 调用此方法来刷新数据
     */
    - (void)reloadData;
    
    /*!
     * @brief 滚动到指定的行
     * @param index 行号
     * @param animation 是否显示动画
     */
    - (void)horizontalTableViewScrollToIndex:(NSInteger)index animation:(BOOL)animation;
    
    /*!
     * @brief 获取index对应的视图
     * @param index 行号
     * @return 返回index行对应的视图
     */
    - (UIView *)viewInHorizontalTableViewWithIndex:(NSInteger)index;
    
    @end
    
    
    
    
    
    
    


    //
    //  HYBHorizontalTableView.m
    //  PersonalShoppingMall
    //
    //  Created by ljy-335 on 14-8-28.
    //  Copyright (c) 2014年 uni2uni. All rights reserved.
    //
    
    #import "HYBHorizontalTableView.h"
    #import <QuartzCore/QuartzCore.h>
    
    #define kTableViewTag                  219911
    #define kTableViewContentViewTag       123111
    
    @interface HYBHorizontalTableView () <UITableViewDataSource, UITableViewDelegate> {
        CGSize _size;
    }
    
    @end
    
    @implementation HYBHorizontalTableView
    
    - (id)initWithFrame:(CGRect)frame {
        self = [super initWithFrame:frame];
        if (self) {
            _size = frame.size;
            self.currentIndex = -1;
            [self configureLayout];
        }
        return self;
    }
    
    - (void)configureLayout {
        UITableView *tableView = [[UITableView alloc]
                                  initWithFrame:CGRectMake(0, 0, _size.width, _size.height)];
        tableView.tag = kTableViewTag;
        tableView.delegate = self;
        tableView.dataSource = self;
        tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
        tableView.backgroundColor = [UIColor clearColor];
        tableView.transform = CGAffineTransformMakeRotation(-M_PI/2);
        self.tableView.frame = CGRectMake(0, 0, _size.width, _size.height);
        tableView.showsVerticalScrollIndicator = NO;
        tableView.showsVerticalScrollIndicator = NO;
        [self addSubview:tableView];
        return;
    }
    
    
    #pragma mark - Public Methods
    - (void)reloadData {
        _size = self.frame.size;
        self.tableView.frame = CGRectMake(0, 0, _size.width, _size.height);
        
        [self.tableView reloadData];
        return;
    }
    
    - (void)setPagingEnabled:(BOOL)pagingEnabled {
        if (_pagingEnabled != pagingEnabled) {
            _pagingEnabled = pagingEnabled;
            self.tableView.pagingEnabled = _pagingEnabled;
        }
        return;
    }
    
    - (UIView *)viewInHorizontalTableViewWithIndex:(NSInteger)index {
        NSIndexPath *indexPath = [NSIndexPath indexPathForRow:index inSection:0];
        UITableViewCell *cell = [self.tableView.dataSource
                                 tableView:self.tableView cellForRowAtIndexPath:indexPath];
        UIView *contentView = [cell viewWithTag:kTableViewContentViewTag];
        
        if (contentView) {
            return contentView;
        }
        return nil;
    }
    
    - (UITableView *)tableView {
        return (UITableView *)[self viewWithTag:kTableViewTag];
    }
    
    - (void)horizontalTableViewScrollToIndex:(NSInteger)index animation:(BOOL)animation {
        NSIndexPath *indexPath = [NSIndexPath indexPathForRow:index inSection:0];
        [self.tableView scrollToRowAtIndexPath:indexPath
                              atScrollPosition:UITableViewScrollPositionNone
                                      animated:animation];
        return;
    }
    
    #pragma mark - UITableViewDataSource
    - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
        if ([self.dataSource respondsToSelector:@selector(horizontalTableView:widthForIndex:)]) {
            return [self.dataSource horizontalTableView:self widthForIndex:indexPath.row];
        }
        return 0.f;
    }
    
    - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
        if ([self.dataSource respondsToSelector:@selector(numberOfIndexForTableView:)]) {
            return [self.dataSource numberOfIndexForTableView:self];
        }
        return 0;
    }
    
    - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
        static NSString *cellIdentifier = @"HYBHorizontalTableViewCellIdentifier";
        UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellIdentifier];
        
        if (!cell) {
            cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault
                                          reuseIdentifier:cellIdentifier];
            CGFloat width = [self.dataSource horizontalTableView:self widthForIndex:indexPath.row];
            cell.frame = CGRectMake(0, 0, width, _size.height);
            cell.contentView.frame = cell.bounds;
            cell.selectionStyle = UITableViewCellSelectionStyleNone;
            
            UIView *contentView = [self.dataSource horizontalTableView:self
                                                            targetRect:cell.contentView.frame
                                                              forIndex:indexPath.row];
            if (!contentView) {
                contentView = [[UIView alloc] initWithFrame:cell.contentView.bounds];
            }
            contentView.transform = CGAffineTransformMakeRotation(M_PI / 2);
            contentView.frame = CGRectMake(0, 0, cell.contentView.frame.size.height,
                                           cell.contentView.frame.size.width);
            contentView.tag = kTableViewContentViewTag;
            [cell.contentView addSubview:contentView];
        }
        
        CGFloat width = [self.dataSource horizontalTableView:self widthForIndex:indexPath.row];
        cell.frame = CGRectMake(0, 0, width, _size.height);
        cell.contentView.frame = cell.bounds;
        UIView *contentView = [cell.contentView viewWithTag:kTableViewContentViewTag];
        contentView.frame = CGRectMake(0, 0, cell.contentView.frame.size.height,
                                       cell.contentView.frame.size.width);
        [self.dataSource horizontalTableView:self setContentView:contentView ForIndex:indexPath.row];
        return cell;
        
    }
    
    #pragma mark - UITableViewDelegate
    - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
        if ([self.delegate respondsToSelector:@selector(horizontalTableView:selectIndex:)]) {
            [self.delegate horizontalTableView:self selectIndex:indexPath.row];
        }
        return;
    }
    
    #pragma mark - UIScrollViewDelegate
    - (void)scrollViewDidScroll:(UIScrollView *)scrollView {
        if (scrollView.pagingEnabled) {
            CGFloat pageWidth = scrollView.frame.size.width;
            int currentPage = floor((scrollView.contentOffset.y - pageWidth / 2) / pageWidth) + 1;
            if (self.currentIndex != currentPage) {
                if ([self.delegate respondsToSelector:@selector(horizontalTableView:scrollToIndex:)]) {
                    [self.delegate horizontalTableView:self scrollToIndex:currentPage];
                }
                self.currentIndex = currentPage;
            }
        }
        return;
    }
    
    
    @end
    


    展开全文
  • <!DOCTYPE html> <html> <head> <meta charset="utf-8">...列表格转行表格</title> <meta name="renderer" content="webkit"> <meta http-equiv="...
    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="utf-8">
      <title>列表格转行表格</title>
      <meta name="renderer" content="webkit">
      <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
      <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
      <link rel="stylesheet" type="text/css" href="js/plugins/layui/css/layui.css" />
      <!-- 注意:如果你直接复制所有代码到本地,上述css路径需要改成你本地的 -->
      <style>
          #tableId  th{
              display: block;
          }
          #tableId thead{
              float: left;
          }
          #tableId  tbody td,#tableId  tbody{
              display: block;
              overflow: hidden;
              white-space: nowrap;
            text-overflow: ellipsis;
          }
          #tableId  tbody{
              font-size: 0;
          }
          #tableId  tbody tr{
              display: inline-block;
              width: 14.285714%;
          }
      </style>
    </head>
    <body>
       
       
       <div style="padding: 15px;">
               <table class="layui-table" id="tableId">
                       <thead>
                           <tr>
                               <th>header1</th>
                               <th>header2</th>
                               <th>header3</th>
                               <th>header4</th>
                           </tr>
                       </thead>
                       <tbody>
                           <tr>
                               <td>1ersf</td>
                               <td>2</td>
                               <td>3</td>
                               <td>4</td>
                           </tr>
                           <tr>
                               <td>8</td>
                               <td>7</td>
                               <td>6</td>
                               <td>5</td>
                           </tr>
                           <tr>
                               <td>8</td>
                               <td>7</td>
                               <td>6</td>
                               <td>5</td>
                           </tr>
                           <tr>
                               <td>8</td>
                               <td>7</td>
                               <td>6</td>
                               <td>5</td>
                           </tr>
                           <tr>
                               <td>8</td>
                               <td>7</td>
                               <td>6</td>
                               <td>5</td>
                           </tr>
                           <tr>
                               <td>8fdsfsfsfsdfs发生的范德萨</td>
                               <td>7</td>
                               <td>6</td>
                               <td>5</td>
                           </tr>
                           <tr>
                               <td>8</td>
                               <td>7</td>
                               <td>6</td>
                               <td>5</td>
                           </tr>
                       </tbody>
               </table>
       </div>
    </body>
    </html>

     

    转载于:https://www.cnblogs.com/littleboyck/p/11433639.html

    展开全文
  •  if (vercellArr[k].Length > 2) //文字超过了2,就要折半处理,没有循环处理  {  tblInits.Rows[rTextIndex].Cells[k].Text = vercellArr[k].Substring(0, vercellArr[k].Length / 2).Trim();  tblInits...

            #region 打印
            //DataTable dtcols = new DataTable();
            GridView gridview = new GridView();
            int intRowHeight = 25;
            private int headLevel = 1;  //列头级别
            private int[] headWidthArray; //列头总宽
            /// <summary>
            /// 打印gridview
            /// </summary>
            /// <param name="gv">gridview</param>
            /// <param name="headlevel">表头级别</param>
            /// <param name="headWidthArr">表头各级宽度对应的数组</param>
            public void PrintingGridView(GridView gv,int headlevel,int[] headWidthArr)
            {
                //InitializeComponent();
                //this.dtcols=dtcols;
                this.gridview = gv;
                headLevel = headlevel+1;
                headWidthArray = headWidthArr;
                LoadReport();
            }       

     private void LoadReport()

            {
                XtraReport xr = new XtraReport();
                int pageHeight = 1169;
                int pageWidth = 827;
                xr.PaperKind = PaperKind.A4;//827,1169
                xr.Font = new Font("宋体", 10.5f);
                xr.TextAlignment = TextAlignment.MiddleCenter;
     
                //内容
                DetailBand Detail = new DetailBand();
                Detail.Height = 1000;
                Detail.Name = "Detail";
                //横表自动生成Table
                if (1 == 1)
                {
                    XRTable tblInits = new XRTable();
                    tblInits.HeightF = 0;
                    tblInits.WidthF = 750;
                    tblInits.Borders = BorderSide.All;
                    xr.Margins.Right = 35;
                    xr.Margins.Left = 35;
                    xr.Margins.Top = 100;
                    xr.Margins.Bottom = 100;
                    string oldcell = "",
                           newcell = "";
                    string[] vercellArr = new string[headLevel];  //纵向表头合并的列数组,相当于表头列有对应的开关
                    int[] vercellSame = new int[headLevel];//同一列相同行数 
                    int headTotalWidth = 0;
                    for (int v = 0; v < headLevel; v++)
                    {
                        vercellSame[v] = 1;//初始化数组
                        headTotalWidth += headWidthArray[v];
                    }
                    int cellno = -1;
                    for (int s = 0; s < this.gridview.RowCount; s++)
                    {
                        XRTableRow tbrNewArrs = new XRTableRow();
                        tbrNewArrs.HeightF = 35;
                        tblInits.HeightF += 35;
                        tbrNewArrs.WidthF = 750;
                        cellno = -1; //列索引开关
                        for (int k = 0; k < this.gridview.Columns.Count; k++)
                        {
                            XRTableCell trcNewArrs = new XRTableCell();
                            trcNewArrs.WidthF = (750) / (this.gridview.Columns.Count - headLevel);
                            trcNewArrs.Text = this.gridview.GetRowCellValue(s, this.gridview.Columns[k].FieldName).ToString();
                            newcell = trcNewArrs.Text;
                            if (this.gridview.GetRowCellValue(s, this.gridview.Columns[0].FieldName).ToString() == "日期")
                            {
                                trcNewArrs.Text = trcNewArrs.Text.Replace("00:00:00", "").TrimEnd();
                                trcNewArrs.Font = new Font("宋体", 9f);
                            }
                            #region 行列合并列头
                            if (k < headLevel)
                            {
                                trcNewArrs.WidthF = headWidthArray[k];
                            }
                            if (0 < k && k < headLevel)  //横向合并列头,从第2列开始
                            {
                                if (oldcell == newcell)
                                {
                                    oldcell = trcNewArrs.Text;
                                    tbrNewArrs.Cells[cellno].WidthF += headWidthArray[k];
                                    continue;
                                }
                            }
                            if (k < headLevel && s > 0)  //纵向合并列头,从第2行开始
                            {
                                if (newcell == vercellArr[k])  //与上一行是否相等
                                {
                                    trcNewArrs.Text = "";
                                    trcNewArrs.Borders = BorderSide.Left | BorderSide.Right;
                                    vercellSame[k]++;
                                }
                                else
                                {
                                    if (vercellSame[k] != 1) //说明有相同的行
                                    {
                                        int rStartIndex = s - vercellSame[k]; //例如 -后面代表行索引,现在求C的合并:A-0,B-1,C-2,C-3,C-4,D-5,那么vercellSame[k]就代表了C的数量3,现在的行索引是D的索引5
                                        int rTextIndex = rStartIndex + vercellSame[k] / 2;
                                        if (vercellSame[k] % 2 == 0)
                                        {
                                            rTextIndex = rTextIndex - 1;//取上方单元格,bottom
                                        }
                                        tblInits.Rows[rStartIndex].Cells[k].Text = "";
                                        if (vercellArr[k].Length > 2)  //文字超过了2个,就要折半处理,没有循环处理
                                        {
                                            tblInits.Rows[rTextIndex].Cells[k].Text = vercellArr[k].Substring(0, vercellArr[k].Length / 2).Trim();
                                            tblInits.Rows[rTextIndex + 1].Cells[k].Text = vercellArr[k].Substring(vercellArr[k].Length / 2, vercellArr[k].Length - vercellArr[k].Length / 2).Trim();
                                        }
                                        else
                                        {
                                            tblInits.Rows[rTextIndex].Cells[k].Text = vercellArr[k];
                                        }
                                        tblInits.Rows[rStartIndex].Cells[k].Borders = BorderSide.Left | BorderSide.Right;
                                        tblInits.Rows[s - 1].Cells[k].Borders = BorderSide.Left | BorderSide.Right | BorderSide.Bottom;
                                        vercellSame[k] = 1;//重置开关
                                    }
                                }
                            }
                            #endregion


                            oldcell = trcNewArrs.Text;
                            tbrNewArrs.Cells.Add(trcNewArrs);
                            cellno++;
                        }
                        tblInits.Rows.Add(tbrNewArrs);  //行遍历 
                        for (int head = 0; head < headLevel; head++)
                        {
                            vercellArr[head] = this.gridview.GetRowCellValue(s, this.gridview.Columns[head].FieldName).ToString();
                        }
                    }
                    Detail.Controls.Add(tblInits);
                    PageHeaderBand pageHeader = new PageHeaderBand();
                    XRLine lineHeader = new XRLine();
                    lineHeader.HeightF = 1;
                    lineHeader.WidthF = tblInits.WidthF;
                    lineHeader.LocationF = new PointF(0, 0);
                    pageHeader.HeightF = 1;
                    pageHeader.Controls.Add(lineHeader);


                    //换页时候最后一行第1列的纵向单元格border处理行索引为 (pageheight- xr.Margins.Top-xr.Margins.bottom)/rowheight-1=26=(1169-100-100)/35-1
                    tblInits.Rows[26].Cells[0].Borders = BorderSide.Left | BorderSide.Right | BorderSide.Bottom;
                    xr.Bands.Add(pageHeader);
                }
                xr.ShowPreviewMarginLines = false;
                xr.Bands.AddRange(new DevExpress.XtraReports.UI.Band[] { Detail }); //, ReportHeader, ReportFooter 
                xr.ShowPreview();
            }
            #endregion
    展开全文
  • 要给表格加一个横向的滚动条,不知道怎么。。。。。。。。。。。。。。。。。。。。。。
  • iview table 横向拖动表格内容滚动

    千次阅读 2020-10-12 11:40:24
    表格纵向滚动比较长的时候,横向滚动是很不方便的,要是横向可以拖动滚动就完美了,解决办法就是给表格添加拖动指令,代码如下: const directive = { inserted (my_el) { let el = my_el.querySelector('div....

    当表格纵向滚动比较长的时候,横向滚动是很不方便的,要是横向可以拖动滚动就完美了,解决办法就是给表格添加拖动指令,代码如下:

    const directive = {
      inserted (my_el) {
        let el = my_el.querySelector('div.ivu-table-body');
        el.style.cursor = 'grab';
        el.onmousedown = function () {
          let gapX = event.clientX;
          let startX = el.scrollLeft;
          document.onmousemove = function (e) {
            let x = e.clientX - gapX;
            el.scrollLeft = startX - x;
            return false;
          };
          document.onmouseup = function (e) {
            document.onmousemove = null;
            document.onmouseup = null;
          };
        };
      },
    }
    export default directive
    
    

    使用方法:在这里插入图片描述

    展开全文
  • layui数据表格横向滚动条

    千次阅读 2019-12-24 12:18:15
    $('.layui-none', $(this.elem).next()).width($('.layui-table-header table', $(this.elem).next()).width() + 'px'); 当数据表格无数据时也有横向滚动条
  • vue element-ui动态横向统计表格

    千次阅读 2019-07-15 21:58:50
    表格结构 <el-table :data="AllData" style="width: 100%"> <el-table-column prop="title" label="统计"> </el-table-column> <el-table-column ...
  • vue有纵向和横向表头表格

    千次阅读 热门讨论 2019-11-04 15:44:31
    github源码地址:... 使用方法 、下载该组件 npm install more-tree-table 二、多表头表格 <more-tree-table :colData="colHead" :rowData="rowHead" :tableValue="t...
  • 表格内容过多,拖动横向滚动条又需要拉到页面最下面,再回头查看数据,操作起来很不方便,所以做一个滚轮控制横向滚动 data(){ return{ domObj:null } }, mounted() { //id为scoll已经被el-table使用 this.$...
  • 用的ace admin框架,layui 静态表格,没有出现横向滚动条:
  • 左右拖拽table表格实现横向滚动

    千次阅读 2020-08-18 18:44:07
    需求:有时候table表格内容比较多时,通过滚动条横向滚动不是太方便查看溢出内容,如果可以通过鼠标左右拖拽查看内容就方便多了。故有此demo <!DOCTYPE HTML> <html> <head> <title>表格...
  • 问题页面 解决方案 页面加上此css:.layui-table-body{overflow-x: hidden;} 完美解决!^ - ^ 以上
  • Extjs 表格横向自动扩展

    千次阅读 2011-09-21 18:44:51
    extjs中的grid组件横向自动扩展,只要在grid的配置项中添加配置viewConfig var grid = new Ext.grid.EditorGridPanel( { title : "需审核记录列表", autoHeight : true, cm
  • 微信小程序制作横向增长表格

    千次阅读 2018-07-24 10:43:22
    &lt;view class='table'&gt; &lt;view class='tr'&gt; &lt;view class='td' wx:for='{{array}}'&gt;{{item.day}}&lt;/view&gt; &lt;/view&...view cl...
  • Excel表格横向太长怎么完全打印?

    千次阅读 2020-05-12 10:44:45
    1.打开excel表格,点击“页面布局-纸张大小”,选择...2.点击“页面布局-纸张方向”,选择“横向”,适当调整表格各列宽度,对齐方式。 3.点击“页面布局”,调整“缩放比例”,使得页面在A4虚线框范围内即可。 ...
  • 横向合并 <table border="1" cellpadding="5" align="center"> <caption>表格标题</caption> <tr align="center"> <th>a</th> <th>b</th> <...
  • 表格tbody添加横向滚动条

    千次阅读 2019-06-12 14:52:51
    地址:https://www.cnblogs.com/susan-home/p/8761574.html 注:侵权联系删除
  • 有时候表格内容会很多,需要横向滚动查看右边的内容,又不想到底部拖动滚动条,如果能直接在内容中拖动就好了,这时候就可以用 Vue 的自定义指令来实现了。 为了以后扩展指令方便,创建 directives.js 文件,在 js...
  • 现在的项目是一个table,百度案例要么是用插件,要么是两个table,但是这样改动会太大,要么是用新的div复制table的前四列,这样表格的点击事件将会失效,自己写了一个但是在ie8下面兼容性不好,拖动横向滚动条的...
  • 有时候表格内容会很多,需要横向滚动查看右边的内容,又不想到底部拖动滚动条,如果能直接在内容中拖动就好了,这时候就可以用 Vue 的自定义指令来实现了。 为了以后扩展指令方便,创建 directives.js 文件,在 js...
  • 可以纵向横向滑动的表格实现

    千次阅读 2017-03-16 18:28:30
    背景 ...这个效果是今天公司项目里面遇上的,也是第一次遇见这种需求,所以记录下来,效果如上图。需求主要是可以实现上下的滑动,...由上面的GIF图和基本需求描述我们第一个想到的东西就是万能的tableview,没错
  • 表格的列比较多时 横向列太拥挤 这时候需要自定义宽度 设置横向滚动条 1.html代码 ck 序号 账号 姓名 CPID CP名
  • 利用单元格可以能够有效的组织数据,如果能够灵活熟练的利用,则对于组织清晰明了的数据有着重要意义,下面是表格布局的代码实例,它实现了横向和纵向的单元格合并效果。 代码如下: 01 02 03 04 05 06 07...
  • 纵向: 横向:
  • 横向滚动条的表格

    千次阅读 2011-07-06 13:44:07
    --------------------------------------可单击变换表格内容---------------------------------------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ..."> ..."> <head> ;...
  • 工作时候,遇到一个需求,表格的前两列固定不动,其他的跟随滚动条滚动,并没有在意,想起来很简单,刚开始想法是前两列absolute定位,后面的relative定位并给left值为前面的总宽度,就这样了,发现是有问题的,...
  • 那么如何在表格列数较多的情况下添加横向滚动条?其实很简单,只需要给table外面包层div,设置width、height 和最重要的 overflow:scroll。完整代码如下: <divstyle="width:1000px;heigh...
  • <div class="ndyqfd_table"> <div class="ndyqfd_table_box"> <ul class="ndyqfd_ul"> <li class="ndyqfd_state">得分率</li> <li class="ndyqfd_st...
  • 但是发现横向滑动时很卡,纵向滑动也不那么丝滑,后来网上翻了翻,想了想实现思路,自己动手库。思路来源于: Android实现了复杂表格表格内容区域可以与上下滑动、左右滚动,并且标题会跟着滚动 - JingleYe...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 38,321
精华内容 15,328
关键字:

如何做一个横向的表格