下一张幻灯片 next-slide
选择“下一张幻灯片”按钮会将用户移动到轮播集中的下一张幻灯片。
触控设备上不显示此按钮。 您可以使用CSS调整此按钮的大小、外观和位置。
主查看器区域的 CSS属性
使用以下CSS类选择器控制按钮的外观:
.s7carouselviewer .s7panrightbutton
CSS属性
说明
前
从查看器边框顶部的位置。
右
位于查看器边框右侧。
已离开
查看器左侧的位置。
后
位于查看器边框底部。
宽度
按钮的宽度。
高度
按钮的高度。
背景图像
针对给定按钮状态显示的图像。
背景位置
如果使用CSS sprite,则定位在图稿sprite中。
另请参阅 CSS sprite。
游标
游标类型。
NOTE
此按钮支持
state
属性选择器,可用于将不同的外观应用于不同的按钮状态。按钮工具提示可以本地化。 有关详细信息,请参阅用户界面元素的本地化。
例如,假设您要设置上一个幻灯片按钮,即60 x 60像素。 您希望按钮位于距离右查看器边框十个像素的位置并垂直居中。 并且,您希望它针对四种不同的按钮状态分别显示不同的图像。
.s7carouselviewer .s7panrightbutton{
bottom: 50%;
right: 10px;
background-size:60px;
cursor: pointer;
}
.s7carouselviewer.s7mouseinput .s7panrightbutton {
width:60px;
height:60px;
margin-bottom: -20px;
}
.s7carouselviewer.s7mouseinput .s7panrightbutton[state] {
background-image: url(../../viewers/s7viewers/html5/images/v2/CarouselDotsRightButton_dark_sprite.png);
}
.s7carouselviewer.s7mouseinput .s7panrightbutton[state='up'] { background-position: -0px -60px; }
.s7carouselviewer.s7mouseinput .s7panrightbutton[state='over'] { background-position: -0px -0px; }
.s7carouselviewer.s7mouseinput .s7panrightbutton[state='down'] { background-position: -0px -0px; }
.s7carouselviewer.s7mouseinput .s7panrightbutton[state='disabled'] { background-position: -0px -60px; }
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8