Как заменить слайдер Nivo "prev" и "next" на изображения (стрелки)

Question

Как заменить слайдер Nivo "prev" и "next" на изображения (стрелки)

Я использую слайдер Nivo...

Мне удалось скрыть номера с нижней части слайдера с помощью CSS.

то, что я хочу сделать сейчас, это заменить "предыдущий" и "следующий" стрелками, которые я сделал в фотошопе... Я искал здесь и в Google, но не могу найти решение.

Буду очень признателен, если кто-нибудь может помочь, пожалуйста.

Sandeep

1

slider nivo-slider

Источник

user2236577 02 апр '13 в 14:54

3 ответа

Другие вопросы по тегам slider nivo-slider

user2250455 05 апр '13 в 19:44 2013-04-05 19:44 · Answer 1 · 2013-04-05 19:44

Я бы использовал замену изображения 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. Вы также можете использовать позиционирование, чтобы поместить стрелки в нужное место в слайд-шоу.

user2282283 15 апр '13 в 12:19 2013-04-15 12:19 · Answer 2 · 2013-04-15 12:19

Вы можете сделать это, создав новую тему со своими изображениями и настройками, см. Здесь: http://support.dev7studios.com/articles/nivo-slider-jquery-plugin/creating-custom-themes

ИЛИ, изменив изображение PNG для кнопок, в существующую тему.

1

Источник

user2282283 15 апр '13 в 12:19

user2910583 20 ноя '13 в 07:23 2013-11-20 07:23 · Answer 3 · 2013-11-20 07:23

Включите эту строку в ваш файл

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

и включать background:url(arrows.png) no-repeat; в.theme-default .nivo-directionNav a в файле default.css, хранящемся в папке по умолчанию. обратите внимание, что изображение стрелки должно храниться в той же папке, где находится файл defalut.css. надеюсь, это поможет.