classExtLink

Version: Pro

classExtLink

type: String

default: "evo_link"

The CSS class used for the external slide-links. You can link directly to any slide by adding links anywhere on the page.

The href attribute should match the id of your Evo Slider. The rel attribute defines the number of the slide to link. Each external link must have the class that set in the option.

Example:

<!doctype html>
<html>
<head>
    <title>My First Evo Slider</title>
    
    <link rel="Stylesheet" type="text/css" href="css/evoslider.css" />
    <link rel="Stylesheet" type="text/css" href="css/default/default.css" />
    <!--[if IE]>
        <link rel="stylesheet" type="text/css" href="css/default/default.ie.css" />
    <![endif]-->
    
    <script type="text/javascript" src="scripts/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="scripts/jquery.easing.1.3.js"></script>
    <script type="text/javascript" src="scripts/jquery.evoslider-1.0.0.min.js"></script>   
</head>
<body>

<div id="mySlider" class="evoslider default">    
    <dl>
    
	    <dt>slide one</dt>
	    <dd data-src="image1.jpg" data-thumb="image1-thumb.jpg">
	    </dd>
	
	    <dt>slide two</dt>
	    <dd data-src="image2.jpg" data-thumb="image2-thumb.jpg">
	    </dd>
	
	    <dt>slide three</dt>
	    <dd data-src="image3.jpg" data-thumb="image3-thumb.jpg">
	    </dd>
	
	    <dt>slide four</dt>
	    <dd data-src="image4.jpg" data-thumb="image4-thumb.jpg">
	    </dd>  
    
    </dl>
</div>

<a href="#mySlider" class="evo_link" rel="3">External link</a> 

<script type="text/javascript">
    
    var myEvoSlider = $("#mySlider").evoSlider({
        classExtLink: "evo_link"
    });
    
</script>

</body>
</html>