【问题标题】:css support view-slideshow right to leftcss 支持从右到左查看幻灯片
【发布时间】:2012-04-30 11:11:30
【问题描述】:

我想在我的幻灯片中支持从右到左的图像转换。 我在 style.css 中的 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

【问题讨论】:

    标签: css drupal themes


    【解决方案1】:

    在 style-rtl.css 中添加这段代码]

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

    【讨论】:

      【解决方案2】:

      更改浮动,将“left”替换为“right”,反之亦然

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

      【讨论】:

      • 我在 style-rtl.css 中添加了这段代码,但不正确。没有改变
      • 你的 style-rtl.css 必须在主 css 之后运行。是在 main.css 之后吗?
      • 提供该页面的链接。看不到代码我说不出来怎么办
      • 在这种情况下,我只能说逻辑 - 找到图像容器块并给他“float:right”,然后找到导航容器块并使其成为“float:left”。就是这样
      猜你喜欢
      • 2012-05-28
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-07-26
      • 2017-12-30
      • 1970-01-01
      相关资源
      最近更新 更多