Complementos de ciclo con puntos que no tienen números

<!DOCTYPE HTML>

<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script type="text/javascript" src="http://malsup.github.com/jquery.cycle.all.js"></script>
<script type="text/javascript">
$.fn.cycle.defaults.timeout = 6000;
$(function() {
$('#s4').after('<div id="nav" class="nav">').cycle({
        fx:     'fade',
        speed:  'fast',
        timeout: 0,
        pager:  '#nav'

    });
});
</script>
</head>
<body>
<div id="demos">
   <table cellspacing="20">
    <tr>
    <td>
        

Pager

        <div id="s4" class="pics">
            
            
            
            
            
            
            

        </div>

    </td></tr>
    </table>
</div>
</div>
</body>
</html>

I have done a little research in cycle plugin and so i try to make my own but the problem is i need that dot button instead of 1 2 or 3 etc but I am not able to find out why the 1, 2,3 are coming and from where it is coming . this is my 1st program using jQuery thats y i am having little bit problem in understanding it . So plz if any one can explain me .....it will b great

0

1 Respuestas

You can style the for the "numbers" with your own images, or via CSS3 make the "dots".

Ejemplo HTML de la navegación generada por el complemento mencionado anteriormente: (Creé el ciclo-bloque )

<div class="cycle-block">
    1
    2
    3
    4
    5
</div>

y el CSS:

.cycle-block a {
    background: url(../MYIMAGE.png) no-repeat scroll -305px 0 
    transparent;
    display: block;
    float: left;
    height: 14px;
    margin-left: 4px;
    overflow: hidden;
    text-indent: -9000px;
    width: 14px;
}

EDITAR:

Los números provienen del recuento de elementos del ciclo, y el buscapersonas definido aquí: pager: '#nav' colocará los números en ese elemento.

0
agregado
@ PHP_USER1 necesitas diseñarlo con CSS, sin etiquetas de imagen involucradas.
agregado el autor jackJoe, fuente
si buscapersonas: #nav coloca los números en ese elemento, entonces cómo reemplazarlo con un punto. en este mi JS me está haciendo div. ¿Puedo hacer manualmente y cuando hago clic en cualquiera cambia la foto
agregado el autor PHP_USER1, fuente
por favor me puede un ejemplo
agregado el autor PHP_USER1, fuente