Bxslider 从寻呼机中删除点并将它们替换为数字，例如 4 中的 1 和 next-prev 链接

Question

嗨，朋友们，我几乎完成了我需要的所有定制，这意味着我已经获得了滑块和当前幻灯片的总数，但我需要将它们准确地放置在项目符号（寻呼机中的点）所在的中心现在运行。我还需要下一个和上一个链接，请参考下图。在那里你可以看到我的 Fiddle.

正如您在 fiddle 中看到的那样，我已经得到了我想要的形式的数字，例如 4 个中的 1 个，但我需要这些数字来替换点，请参见图片和 Fiddle以下。更多信息请留言。]

 [1]: http://jsfiddle.net/h4wochdk/

Answer 1

你需要很好地自定义整个 bx-pager 问题似乎只是这样，我玩过你的 fiddle，这就是我想出的 Working Demo。您可以通过覆盖以下样式来更改 next/prev 图像图标。

.bx-wrapper .bx-next {
   background: url(../your_path_to_next_icon.png) no-repeat 18px 5px;
 }
 .bx-wrapper .bx-prev {
   background-position: url(../path_to_prev_icon.png) no-repeat 0 5px;
 }

要设计这样的 div 你必须隐藏 pager-div itslef 并在滑块正下方自定义你的 div 然后传递 slide-index 和 total-slides 所以就像你说的那样，它将成为 3 个中的 1 个。

我做过的事情是

1：我删除了内置的 bxslider 寻呼机，这样我们就可以摆脱子弹及其 div。

2：我将 slide-index 和 total-slides 放在一个名为 slide-counter 的客户 div 中。

3：然后一些 css 到 next/prev 按钮可以到达您需要的确切位置。

请尝试 fiddle。祝一切顺利。

Bxslider 从寻呼机中删除点并将它们替换为数字，例如 4 中的 1 和 next-prev 链接

Bxslider to remove dots from pager and replace them with numbers like 1 of 4 with next-prev links

html

javascript

css

jquery

bxslider