滚动的展示表格

想实现类似jquery的sliderUp的功能

先说滚动的思路

function slideUp(element, time) {
    // 获取元素总高度
    let totalHeight = element.offsetHeight;
    // 定义一个变量保存元素当前高度
    let currentHeight = totalHeight;
    // 计算每次减去的值
    let decrement = totalHeight/ (time/10);
    // 开始循环定时器
    let timer = setInterval(function() {
        // 减去当前高度的一部分
        currentHeight = currentHeight - decrement;
        // 把当前高度赋值给height属性
        element.style.setProperty('height',`${currentHeight}px`)
        // 如果当前高度小于等于0,就关闭定时器
        if (currentHeight <= 0) {
            // 关闭定时器
            clearInterval(timer);
            // 把元素删掉
            element.parentNode.removeChild(element)
        }
    }, 10)
}

参考自一个大神,出处忘了,有发现出处的同学记得联系我注明出处

用table布局

一开始表格的布局想用table,但是出现各种问题,问题如下:
在将tr作为上升的元素时,由于内部文字的存在,无法上升完全
将tr内的td作为上升元素时,也是同样的问题,而且由于table的自适应问题,导致元素上升时,表格内其他部分也在不断上升以自适应
总之不能用table

用div布局表格

你可能感兴趣的:(滚动的展示表格)