Question

我想在幻灯片中支持从右到左的图像转换。我的CSS查看了style.css中的幻灯片代码：

$.block-slideshow .view-content {
position:relative;
background:red;
padding: 2px 5px 5px 7px;
}
.block-slideshow .views_slideshow_thumbnailhover_main img {
float: left;
}
.block-slideshow .views-slideshow-controls-bottom {
 position:absolute; 
 top:5px;
 right:5px; 
 list-style:none; 
 padding:0;
 margin:0; 
 width:310px;
z-index:100;
}
.block-slideshow .views_slideshow_thumbnailhover_div_breakout_teaser {
 padding:5px 10px 0 45px;
 margin:0;  
 background:#6A99AD url(../images/slideshow-nav-bullet.png) no-repeat scroll 0 0;
 height:41px;
 border-bottom: 1px dashed #fff;
}
.block-slideshow .views_slideshow_thumbnailhover_div_breakout_teaser:hover {
 cursor:pointer;
}
.block-slideshow .views-slideshow-controls-bottom .activeSlide {
 background:#024D76 url(../images/slideshow-nav-bullet.png) no-repeat scroll 0 0;
list-style: disc;
}
.block-slideshow .view-slideshow .views-field-title {
 color:#FFF;
font-size:120%;
font-weight:bold;
}
.block-slideshow .view-slideshow .views-field-body {
  color:#FFF;
  font-size:100%;
}
.block-slideshow .view-slideshow .views-field-body p {
 margin:0!important;
 }

请访问此链接 http://i.stack.imgur.com/sMdc1.jpg

请指导我我想在视图幻灯片中支持从右到左的过渡。风格-RTL：

请访问此链接

http://i.stack.imgur.com/s23XY.jpg

Answer 1

在style-rtl.css]

中添加此代码

$.block-slideshow .views-slideshow-controls-bottom {
 position:absolute; 
 top:5px;
 right:605px; 
}

Answer 2

更改浮动，将“左”替换为“右”，反之亦然

.block-slideshow .views_slideshow_thumbnailhover_main img {
float: right;
}

css支持从右到左的视图幻灯片

2 个答案: