jquery - 使用默认主题在Nivo Slider上居中图像？

对于使用Nivo Slider的任何人，是否有任何直接方法（或没有）将图像居中放置在滑块上？我知道Nivo Slider旨在显示完美“适合”盒子的图像（与我使用方式不同），但是出于技术原因，我宁愿尝试将图像居中，而不是使所有图像完美适合Nivo盒子的宽度和高度。目前，我的Nivo幻灯片如下所示：

http://dl.dropbox.com/u/12453703/nivo.png

抱歉，我没有提供任何尝试此操作的代码示例。我的CSS知识不是很丰富，并且大多数解决该问题的尝试要么是在网上查看解决方案（并尝试应用所述解决方案），要么是在我的样式表中尝试了随机的一行以试图解决该问题。问题。

如果您想知道我正在使用哪些CSS文件，那么我使用的是默认主题，可以在此处下载：
http://cloud.github.com/downloads/gilbitron/Nivo-Slider/nivo-slider2.7.1.zip

谢谢，我很感激。

最佳答案

图片的位置正在载入javascript文件。编辑“ jquery.nivo.slider.js”（请确保使用此文件而不是标题中的“ jquery.nivo.slider.pack.js”。）

转到第85行：

//Set first background
        slider.css('background','url("'+ vars.currentImage.attr('src') +'") no-repeat');

找到上面的行。更改为：

//Set first background
        slider.css('background','url("'+ vars.currentImage.attr('src') +'") no-repeat center');

现在，您可以看到您的第一个图像在中央。只要播放该文件，您就可以使整个图像居中。

编辑：
查找此函数：//为切片动画添加切片。 253行。
编辑其中的其他部分。 262线

background: 'url("'+ vars.currentImage.attr('src') +'") no-repeat -'+ ((sliceWidth + (i * sliceWidth)) - sliceWidth) +'px 0%'

通过将0％更改为50％，可以使图像垂直居中。越来越近...

编辑

再次编辑上面的行，并替换为下面的行。

background: 'url("'+ vars.currentImage.attr('src') +'") no-repeat 50%'

这肯定会工作..

编辑

忘记上面的所有编辑。只需将您的jquery.nivo.slider.js文件替换为this one。

关于jquery - 使用默认主题在Nivo Slider上居中图像？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/9124324/