gpt4 book ai didi

jquery - 使用缩放和 float div 调整大小

转载 作者:行者123 更新时间:2023-11-28 11:20:09 25 4
gpt4 key购买 nike

我有一个包装 div,其中包含一个带有 jCarousel 的 div 和靠近 div 的两个箭头,用于更改图片。

问题是,当我调整浏览器大小时或放大或缩小时,箭头移动并越过 jcarousel div。

为什么会这样?这是一个例子:http://fiddle.jshell.net/Wbt83/

最佳答案

我无法模拟您遇到的问题,但这是响应式设计的正确流程:

元素的 CSS:

.wrapper{
position: relative;
width: 100%; // Your custom width here
height: 300px; // Custom height
}

.wrapper .jcarousell{
[...] // jCarousell specif css
}

.wrapper .arrow{
position: absolute;
top: 40%; // Custom top spacing for arrows
height: 20px; // Arrow height
width: 20px; // Arrow width
}

.wrapper .arrow-left{
left: 0;
}

.wrapper .arrow-right{
right: 0;
}

元素的伪 HTML:

<div class="wrapper">
<ul class="jcarousell">
<li>[...]</li>
<li>[...]</li>
<li>[...]</li>
</ul>

<img class="arrow arrow-left" src="leftArrow.png"/>
<img class="arrow arrow-right" src="rightArrow.png"/>
</div>

关于jquery - 使用缩放和 float div 调整大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21580125/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com