jQuery cycle() goto page name?

Question

Please how to setting jQuery .cycle() plugin for link <a href="" to go cycle slide NAME? Example.

<div id="slides">
<div name="slide_blue"> content of slide name slide_blue</div>
<div name="slide_red"> content of slide name slide_red</div>
</div>

and I need creatie links:

<a href=".cycle() to div name slide_blue">Blue<a>
<a href=".cycle() to div name slide_red">Red<a>

jQuery setting example

$("#slides").cycle({
fx: 'ScrollHorz'
});

Can abybody help me create links for set slide cycle name?

Answer 1

Live DEMO && code

Something like this, modify it to your needs:

<div id="slides">
<div name="slide_blue"> content of slide name slide_blue</div>
<div name="slide_red"> content of slide name slide_red</div>
<div name="slide_yellow"> content of slide name slide_yellow</div>
</div>

<div>
    <a href=".cycle() to div name slide_blue" class="slide_blue">Blue<a>
    <a href=".cycle() to div name slide_red" class="slide_red">Red<a>
    <a href=".cycle() to div name slide_yellow" class="slide_yellow">Yellow<a>
</div>

<script>
(function() {

    $("#slides").cycle({
       fx: 'scrollRight'
    });

    var cycleTo = function() {
        var className = $(this).attr('class');
        var divSelected = $('#slides div[name='+className+']');
        var slideIndex = $('#slides div').index(divSelected);
        $('#slides').cycle(slideIndex); 
        return false; 
    }

    $('div a').click(cycleTo); 

}())
</script>