是否可以找到一些 jQuery 庫(kù)。用于圖像陣列的連續(xù)旋轉(zhuǎn)？就我而言，我有大約 30 個(gè)圖像（合作伙伴徽標(biāo)），我想將它們?cè)O(shè)置在一些 jquery lib 或純 CSS 代碼中，其中圖像將連續(xù)旋轉(zhuǎn)。圖像和信息將通過(guò)ajax查詢導(dǎo)入。愿景示例：它可能看起來(lái)像這樣，或者在同一高度線上。感謝任何有關(guān)進(jìn)一步調(diào)查的幫助和建議。
1 回答
元芳怎么了
TA貢獻(xiàn)1798條經(jīng)驗(yàn) 獲得超7個(gè)贊
有大量用于此目的的插件。這是一個(gè)slick的例子（https://github.com/kenwheeler/slick/）。大多數(shù)轉(zhuǎn)盤/滑塊都可以選擇連續(xù)旋轉(zhuǎn)。只需谷歌搜索滑塊并在初始化之前用ajax填充它即可。
請(qǐng)注意，SO 不是推薦平臺(tái)。
$(document).ready(function() {
$('.slider').slick({
dots: false,
slidesToShow: 7,
slidesToScroll: 1,
autoplay: true,
autoplaySpeed: 1000,
responsive: [
{
breakpoint: 1024,
settings: {
slidesToShow: 6,
slidesToScroll: 6,
}
},
{
breakpoint: 600,
settings: {
slidesToShow: 5,
slidesToScroll: 5
}
},
{
breakpoint: 480,
settings: {
slidesToShow: 4,
slidesToScroll: 4
}
}
]
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css" />
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick-theme.css" />
<script src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
<div class="slider">
<div><img src="https://picsum.photos/id/10/100/100"></div>
<div><img src="https://picsum.photos/id/20/100/100"></div>
<div><img src="https://picsum.photos/id/30/100/100"></div>
<div><img src="https://picsum.photos/id/40/100/100"></div>
<div><img src="https://picsum.photos/id/50/100/100"></div>
<div><img src="https://picsum.photos/id/60/100/100"></div>
<div><img src="https://picsum.photos/id/70/100/100"></div>
<div><img src="https://picsum.photos/id/80/100/100"></div>
<div><img src="https://picsum.photos/id/90/100/100"></div>
<div><img src="https://picsum.photos/id/100/100/100"></div>
<div><img src="https://picsum.photos/id/110/100/100"></div>
</div>
- 1 回答
- 0 關(guān)注
- 167 瀏覽
添加回答
舉報(bào)
0/150
提交
取消