使用client-testimonials-carousel插件,箭头不移动

时间:2017-01-05 13:48:50

标签: javascript jquery html css

我正在使用这个插件,它完美无缺:

https://codyhouse.co/demo/client-testimonials-carousel/index.html

然而,我不太确定如何让箭头保持不变并且永远不动。现在他们根据div的高度居中,我只想让他们留在原来的位置。如果有人能告诉我他们改变了什么,那么我也可以学到它会很棒!

2 个答案:

答案 0 :(得分:1)

你必须改变这个css:

.flex-direction-nav li a::before, .flex-direction-nav li a::after {
    background-color: white;
    content: "";
    height: 13px;
    left: 50%;
    position: absolute;
    top: 50%; 
    width: 2px;
}

top: 50%;更改为您想要的任何内容。例如top: 200px

top: 50%将获得父元素的高度并向下移动自己的元素50%。可以通过添加固定声明来禁用它。

如果您无法从插件中编辑css,请包含您自己的css文件并将其粘贴到其中:

.flex-direction-nav li a::before, .flex-direction-nav li a::after {
    top: 200px;
}

答案 1 :(得分:0)

考虑坚持使用移动的箭头。建议这一点的原因是您选择的固定顶部位置不太可能像中心版本那样令人满意。说你选择

top: 100px;

对于生成220px高块的推荐,看起来很棒,因为100px点大致是中心点。但是当推荐块高130px并且箭头靠近块的底部时,它看起来会很难看。

您的样本推荐书只有3或4行。尝试使用单行推荐和7行版本,看看你对固定位置的感受。

到目前为止,这是一个漂亮的网站 - 很好的工作。