Código de JQuery - Mover el scroll de un select con jquery

Imágen de perfil

Mover el scroll de un select con jquerygráfica de visualizaciones


JQuery

Publicado el 13 de Abril del 2015 por xve
1.122 visualizaciones desde el 13 de Abril del 2015. Una media de 14 por semana
En este ejemplo, os muestro con una manera sencilla, como desplazar el scroll de un select al inicio y final del mismo utilizando la instrucción scrollTop() de jquery.

Versión 1.0

Publicado el 13 de Abril del 2015gráfica de visualizaciones de la versión: Versión 1.0
1.123 visualizaciones desde el 13 de Abril del 2015. Una media de 14 por semana
estrellaestrellaestrellaestrellaestrella
estrellaestrellaestrellaestrella
estrellaestrellaestrella
estrellaestrella
estrella

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>
 
    <script>
    $(document).ready(function(){
 
        $("#primero").click(function(){
            $('#seleccion').scrollTop(0);
        });
 
        $("#ultimo").click(function(){
            $('#seleccion').scrollTop(9999);
        });
 
        // nada mas iniciar nos posicionamos en el último
        $("#ultimo").click();
    });
    </script>
 
    <style>
        select {width:200px;}
        select option {padding:3px 10px;}
    </style>
</head>
 
<body>
    <form id="registro" method="post">
        <select size="5" id="seleccion">
            <option value="1" selected>opcion 1</option>
            <option value="2">opcion 2</option>
            <option value="3">opcion 3</option>
            <option value="4">opcion 4</option>
            <option value="5">opcion 5</option>
            <option value="6">opcion 6</option>
            <option value="7">opcion 7</option>
            <option value="8">opcion 8</option>
            <option value="9">opcion 9</option>
            <option value="10">opcion 10</option>
            <option value="11">opcion 11</option>
            <option value="12">opcion 12</option>
            <option value="13">opcion 13</option>
        </select>
    </form>
 
    <input type="button" id="primero" value="subir scroll">
    <input type="button" id="ultimo" value="bajar scroll">
</body>
</html>



Comentarios sobre la versión: Versión 1.0 (0)


No hay comentarios
 

Comentar la versión: Versión 1.0

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios

http://lwp-l.com/s3133