如何使div的长度反向增长

发布于
2017-08-23

比如现在要写一个动画效果，实现div的长度由100~200，一般我们都是用css3或者jquery里的animate方法，但是他们都是固定向右边伸长，有没有办法让他向左边伸长，我开始用的是在它增长长度的同时改变它的margin值，已达到向左增长的视觉效果，但是这样的动画台生硬，像transition里面的一些变化效果都体现不出来。
有没有什么办法来处理这个问题呢？

javascript css html

阅读 8.1k

7 个回答

得票最新

Zany

1.2k1514

发布于
2017-08-23

✓ 已被采纳

这个要用布局来解决，如果右边没位置，就会向左边伸长

陌路凡歌

7.9k21119

发布于
2017-08-23

更新于
2017-08-23

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        .box{
            position: absolute;
            right: 0;
            top: 0;
            width: 100px;
            height: 100px;
            transition: all 1s;
            background: red;
        }
        .box:hover{
            width: 200px;
        }
    </style>
</head>
<body>
    <div class="box"></div>
</body>

</html>