Question

编辑： 链接的“重复项”不能解决我的问题；我不是在转换div，而是在转换具有div中输入字段的同一行上对齐的图像。

编辑2： 找到解决方案：使用'left：0; right：0'in interest div。

https://jsfiddle.net/pskdtzL1/201/（请参见“正确的结果”设置）

我试图将图像滑入和滑出屏幕，所有图像都以自己的

为中心。上面的代码实现了滑动，但是未能使所有缩放级别的传入图像居中。带像素的绝对定位仅适用于一次缩放。

注意：在完整代码中，“图像”由调用onclick，onmouseover和onmouseout JScript函数包装。我将滑动转换设置为0结束以保留输入字段的功能。

如何将所有缩放级别的图像（和输入）滑动到

中心？感谢您的帮助。

HTML

<div class="row">
    <div class="left">
    Stuff
    </div>

    <div class="main">
    <!-- several <img> and a <button>-->
    </div>
</div>

CSS

* {box-sizing: border-box;}   
.row {display: flex; flex-wrap: wrap;} 
.left {flex: 20%;
       background-color: #f1f1f1;
       padding: 20px;}
.main {flex: 80%;
       background-color: white;
       padding: 20px;
       overflow: hidden;
       position: relative;}
.lleft {position:absolute; left: -300px;} 

/* Animation CSS (added to elements via JavaScript) */

0 个答案:

没有答案

如何将图像转换为div中心？

0 个答案: