[contact-form-7 id="24085" title="Feedback RU"]

Новые шаблоны

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

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

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

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

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

    JS_Animated_How_to_add_link_to_Faded_slider

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

    JS_Animated_How_to_add_link_to_Faded_slider_1

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

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

    JS_Animated_How_to_add_link_to_Faded_slider_2

  4. Замените

    bigtarget: true, на bigtarget: false,

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

    JS_Animated_How_to_add_link_to_Faded_slider_3

  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. Введите нужную ссылку и нажмите на кнопку Сохранить (Сохранить), для того чтобы сохранить изменения. Вы можете добавить ссылки к остальным слайдам аналогично:

    JS_Animated_How_to_add_link_to_Faded_slider_3

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

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

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