社区文档构建进行中,欢迎编辑。社区答疑群(非官方):717421103

全站通知:

超级轮播/样例

阅读

    

2022-08-15更新

    

最新编辑:丩卩夂忄

阅读:

  

更新日期:2022-08-15

  

最新编辑:丩卩夂忄

来自WIKI实验室WIKI_BWIKI_哔哩哔哩
跳到导航 跳到搜索
页面贡献者 :
丩卩夂忄
本页样例,纯属炫技,请不要学习这样的写法!

2

<div class="SuperCarousel noPause eg2" style="width:200px;height:200px;--s:0s" data-gap="20" data-unit="ms">
	<div class="body">{{#arraymap:↑,↗,→,↘,↓,↙,←,↖|,|@|<div class="item">@</div>|}}</div>
</div>
<bstyle>.SuperCarousel.eg2>.body>.item{font-size:5em}</bstyle>

1

图片来自Pixiv,Pixiv ID=85162550
<div class="SuperCarousel eg1" style="width:100%;aspect-ratio:1920/963;--s:0s" data-gap="40" data-unit="ms">
	<div class="body">{{#loop:i|0|16|<div class="item">[[文件:超级轮播_样例1_{{padleft:{{#var:i}}|2}}.jpg|link=]]</div>}}</div>
</div>
<bstyle>.SuperCarousel.eg1 img{width:100%;height:auto}</bstyle>
超级轮播 样例1 00.jpg
超级轮播 样例1 01.jpg
超级轮播 样例1 02.jpg
超级轮播 样例1 03.jpg
超级轮播 样例1 04.jpg
超级轮播 样例1 05.jpg
超级轮播 样例1 06.jpg
超级轮播 样例1 07.jpg
超级轮播 样例1 08.jpg
超级轮播 样例1 09.jpg
超级轮播 样例1 10.jpg
超级轮播 样例1 11.jpg
超级轮播 样例1 12.jpg
超级轮播 样例1 13.jpg
超级轮播 样例1 14.jpg
超级轮播 样例1 15.jpg