无限旋转木马适用于Chrome但不适用于Firefox

时间:2014-02-25 09:36:55

标签: jquery css firefox infinite-carousel

我正在使用无限旋转木马,它在chrome上运行得很好,但是在Firefox上没有显示图像 这是链接http://www.mawk3y.net/alsoos/saudisaif 我试图改变

  • 从左到右的浮动,第二个图像屏幕显示但箭头根本不起作用

    .infiniteCarousel {
    width: 924px;
    position: relative;
    }
    
    .infiniteCarousel .wrapper {
    width: 850px; 
    overflow: auto;
    min-height: 10em;
    position: absolute;
    top: 0;
    margin-right: 39px;
    }
    
    .infiniteCarousel ul img {
    height:127px;
    width:279px;
    }
    
    .infiniteCarousel .wrapper ul {
    width: 9999px;
    list-style-image:none;
    list-style-position:outside;
    list-style-type:none;
    margin:0;
    padding:0;
    position: absolute;
    top: 0;
    }
    
    .infiniteCarousel ul li {
    display:block;
    float:left;
    padding: 0 3px 0 3px;
    height: 160px;
    width: 279px;
    text-align:center;
    color:#5e3939;
    font-family: 'Conv_GE SS Text Medium';
     }
    
    .infiniteCarousel ul li a img {
    display:block;
    }
    
    .infiniteCarousel .arrow {
    display: block;
    height: 36px;
    width: 37px;
    background: url(../images/arrow.png) no-repeat 0 0;
    text-indent: -999px;
    position: absolute;
    top: 37px;
      cursor: pointer;
    }
    
    .infiniteCarousel .forward {
    background-position: 0 0;
    right: 0;
    top: 45px;
    }
    
    .infiniteCarousel .back {
    background-position: 0 -72px;
    left: 0;
    top: 45px;
    }
    
    .infiniteCarousel .forward:hover {
    background-position: 0 -36px;
    }
    
    .infiniteCarousel .back:hover {
    background-position: 0 -108px;
    }
    
  • 1 个答案:

    答案 0 :(得分:0)

    页面的方向是rtl 所以旋转木马没有在Firefox上工作,但仍然不知道为什么在chrome上工作所以我不得不为包含div添加样式

    carousel{
    direction:ltr;
    }