twentytwenty js | <img> 的定位
twentytwenty js | positioning of an <img>
我在一个网站上工作,有一个 "before-after" 动画的案例,我用 twentytwenty js 做了。
它在任何地方都可以正常工作,除了一页,后图(右侧)似乎不适合 "container"。图像应该有浅色边框,但它只显示在顶部。使用 "border: 1px solid lightgrey" 具有相同的结果。
Link到问题页面:
快速解决!将 right: 0;
添加到 twentytwenty.css
文件中的 .twentytwenty-container img
并在 style.css
文件中从 .bild-1
[=] 中的宽度和高度中取 2px
32=]
您的最终输出将如下所示
在你的twentytwenty.css
.twentytwenty-container img
max-width: 100%;
position: absolute;
top: 0;
right: 0px;
display: block;
在你style.css
.bild-1
width: 388px;
height: 348px;
display: inline-block;
float: right;
我在一个网站上工作,有一个 "before-after" 动画的案例,我用 twentytwenty js 做了。
它在任何地方都可以正常工作,除了一页,后图(右侧)似乎不适合 "container"。图像应该有浅色边框,但它只显示在顶部。使用 "border: 1px solid lightgrey" 具有相同的结果。
Link到问题页面:
快速解决!将 right: 0;
添加到 twentytwenty.css
文件中的 .twentytwenty-container img
并在 style.css
文件中从 .bild-1
[=] 中的宽度和高度中取 2px
32=]
您的最终输出将如下所示
在你的twentytwenty.css
.twentytwenty-container img
max-width: 100%;
position: absolute;
top: 0;
right: 0px;
display: block;
在你style.css
.bild-1
width: 388px;
height: 348px;
display: inline-block;
float: right;