使用Flexslider如何使控制箭头响应？

Question

调整幻灯片大小时，图像会与浏览器一起调整大小，但是控件上一页/下一页我用图像替换了文本，它们保持静态。由于我使用text-ident来隐藏文本，因此我必须为要显示的箭头图像设置固定的宽度和高度。现在，我如何在幻灯片图像的同时调整它的大小？

Answer 1

通过较小屏幕的媒体查询定位您的箭头图像。例如。要定位小于480px的屏幕，您可以执行以下操作：

@media only screen and (max-width: 480px) {
    .flex-direction-nav .flex-next,
    .flex-direction-nav .flex-prev {
        -webkit-background-size:50%;
        -moz-background-size:50%;
        background-size:50%;
        background-position: 50% 50%;
    }
}

通过使用background-size属性，您可以调整箭头图像的大小。我把它缩小了50％。您可以使用这些值来满足自己的品味和满足感。