Question

我正在使用Nivo滑块...

我已设法使用css隐藏滑块底部的数字。

我现在要做的是取代“上一个”＆amp; “下一个”用我在photoshop中制作的箭头...... 我一直在这里和谷歌搜索，但我无法找到解决方案。

如果有人能帮到你，我真的很感激。

和Sandeep

Answer 1

我会使用CSS图像替换。所以：

.nivo-directionNav .nivo-prevNav {
  background:transparent url(path/to/image) 0 0 no-repeat;
  height:20px; /*height of img*/
  width:10px; /*width of img*/
  text-indent:-10000px; /*moving the default text*/
  overflow:hidden; /*hiding the default text*/
}

然后重复.nivo-nextNav。您还可以使用定位将箭头放在幻灯片中的所需位置。

Answer 2

您可以使用自己的图片和设置创建新主题，请参阅此处：http://support.dev7studios.com/articles/nivo-slider-jquery-plugin/creating-custom-themes

或者通过将按钮的png图像更改为现有主题。

Answer 3

在您的档案中加入此行

<link href="<?php echo get_template_directory_uri(); ?>/default/default.css" rel="stylesheet" type="text/css" />

并在默认文件夹中存储的default.css文件中的.theme-default .nivo-directionNav a中包含background:url(arrows.png) no-repeat;。请注意，箭头图像必须存储在与放置defalut.css的文件夹相同的文件夹中。希望这会有所帮助。

如何更换Nivo滑块“prev”＆amp;带有图像的“下一个”（箭头）

3 个答案: