JS Animated. Как добавить ссылку для слайдера «Faded slider»

Из этого туториала Вы узнаете, как добавить ссылку для слайдера «Faded slider» в JS-анимированном шаблоне.

Как правило, при нажатии на изображение слайдер отображает следующий слайд. У Вас не будет возможности добавить пользовательские ссылки к слайдам.

1. Войдите в вашу Панель управления хостингом (cPanel) и перейдите в Файловый менеджер (File manager):

   

2. Откройте корневую папку вашего сайта и найдите файл index.html , нажмите на значок Редактировать (Edit):

   

3. Прокрутите вниз файла и найдите следующий фрагмент кода:

   			$(function(){
   			$("#faded").faded({
   			speed: 1200,
   			crossfade: true,
   			bigtarget: true,
   			autoplay: 4800,
   			autorestart: 1200,
   			autopagination: true
   			});
   			});
   		

   

4. Замените

   bigtarget: true, на bigtarget: false,

5. Нажмите на кнопку «Сохранить», для того чтобы сохранить изменения:

   

6. Затем, в этом же файле, найдите код слайдера «faded slider», например:

   			<div id="faded">
   			<div class="rap">
   			<img src="images/img1.jpg" alt="" width="675" height="400" />
   			<img src="images/img2.jpg" alt="" width="675" height="400" />
   			<img src="images/img3.jpg" alt="" width="675" height="400" />
   			<img src="images/img4.jpg" alt="" width="675" height="400" />
   			<img src="images/img5.jpg" alt="" width="675" height="400" />
   			</div> 
   			</div>
   		

7. Давайте добавим ссылку к первому слайду. Вам нужно добавить ссылку, используя тэг href, например:

   			<a href="http://google.com/"><img src="images/img1.jpg" alt="" width="675" height="400" />
   			</a>
   		

8. Введите нужную ссылку и нажмите на кнопку Сохранить (Сохранить), для того чтобы сохранить изменения. Вы можете добавить ссылки к остальным слайдам аналогично:

   

9. Обновите ваш сайт, для того чтобы просмотреть изменения.

Вы можете также ознакомиться с детальным видео-туториалом ниже: