[contact-form-7 id="24078" title="Feedback EN"]

Featured templates

JS Animated. How to add link to Faded slider

This tutorial will show you how to add a link to Faded slider in JS Animated templates.

JS Animated. How to add link to Faded slider

As a rule, clicking an image is set to switch to next image without having an option to use custom links instead.

  1. Log into your hosting cPanel and navigate to File manager:

    JS_Animated_How_to_add_link_to_Faded_slider

  2. Open your root folder and find index.html file, click Edit icon:

    JS_Animated_How_to_add_link_to_Faded_slider_1

  3. Scroll to the end of the file and find this code:

    			$(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. You should replace

    bigtarget: true, with bigtarget: false,

  5. Click Save button to save changes:

    JS_Animated_How_to_add_link_to_Faded_slider_3

  6. Then you should find the code with faded slider in the same file, here is an example of code:

    			<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. Let’s add a link to the first slider image. Link should be added by using href tag, for example:

    			<a href="http://google.com/"><img src="images/img1.jpg" alt="" width="675" height="400" />
    			</a>
    		
  8. Enter the desired link for slider image and click Save button to save changes. The links for other images should be added the same way:

    JS_Animated_How_to_add_link_to_Faded_slider_3

  9. Refresh your page to see changes.

Feel free to check the detailed video tutorial below:

JS Animated. How to add link to Faded slider