1

我使用以下 CSS 设置了一个不错的小滑块:

/*SLIDER
===================================
*/

#full-slider-wrapper {
    overflow: hidden;
}

#full-slider {
    position: relative;
    width: auto;
    min-height: 1200px;
    margin: 0 auto;
}

#full-slider .slide-panel {
    position: absolute;
    top: 0;
    left: 0;
    width: auto;
    visibility: hidden;
}

#full-slider .slide-panel.active {
    visibility: visible;
} 


#full-slider-nav-left
{
  position: fixed; top: 550px; width: auto; margin: auto 0 auto auto;
  left: 0; width: 0; height: 0; cursor: pointer; border: 20px solid transparent; 

}

#full-slider-nav-right {
  position: fixed; top: 550px; width: auto; margin: auto auto auto 0;
  right:0; width: 0; height: 0; cursor: pointer; border: 20px solid transparent;
}


#full-slider-nav-left {
    border-right-color: #BBB;
}

#full-slider-nav-left:hover {
    border-right-color: #999;
}

#full-slider-nav-right {
    border-left-color: #BBB;
}

#full-slider-nav-right:hover {
    border-left-color: #999;
}

如您所见,我在容器的两侧设置了导航箭头。当我上下滚动页面时,它们保持不变。我正在使用响应Skeleton framework式浏览器,当我将浏览器折叠到移动尺寸时,箭头工作正常。箭头在 android 平台上也可以正常工作。但是,当我尝试在 iPhone 上浏览网站时,箭头会随着滚动而跳来跳去,然后消失。

根据我的阅读,iPhone 过去曾遇到过问题position:fixed,但据说 iOS 5 解决了这个问题。

不幸的是,我没有现场版本的网站来演示这个问题。

任何帮助将不胜感激。

4

0 回答 0