Nivo滑块显示数字而不是背景图像

Nivo slider displaying numbers instead of background image

本文关键字：背景 图像 数字 显示 Nivo      更新时间：2023-09-26

我正在介绍一个非常奇怪的情况。我在一个站点上添加了一个nivo滑块，但是当我打开controlnav时，幻灯片导航器由数字组成。问题是我想用子弹来代替那些数字。我试过添加文本缩进:-9999px，但这不起作用。我以前用过很多次Nivo，这是第一次发生。脚本是新的，据我所知，没有脚本或css问题，可能会导致它

网址在这里:http://minimaltheme01.brideappeal.com/

知道为什么会这样吗?谢谢!

默认情况下nivo滑动条显示数字。要让它们重新样式化并显示项目符号而不是数字，您可以使用主题，或者您可以选择编写自己的css来样式化它们。

查看文档以了解如何包含主题。

你需要稍微修改一下html

查看这两个js的(粗略)例子，有和没有主题。

http://jsfiddle.net/cyZH2/-不包含

http://jsfiddle.net/8Tafp/- with

在default-theme css文件中，它包含以下样式，将链接显示为项目符号。

.theme-default .nivoSlider a {
    border:0;
    display:block;
}
.theme-default .nivo-controlNav {
    text-align: center;
    padding: 20px 0;
}
.theme-default .nivo-controlNav a {
    display:inline-block;
    width:22px;
    height:22px;
    background:url(bullets.png) no-repeat;
    text-indent:-9999px;
    border:0;
    margin: 0 2px;
}
.theme-default .nivo-controlNav a.active {
    background-position:0 -22px;
}
相关文章：