JavaScript - Implementar scrollbar personalizado a un div

   
Vista:

Implementar scrollbar personalizado a un div

Publicado por Sam (95 intervenciones) el 29/08/2014 17:03:15
Hola amigos a ver si me pueden ayudar:

Tengo el siguiente codigo que me permite personalizar mi barra de scrollbar y hacerla mas bonita esteticamente y un efecto smooth en el movimiento .


El asunto es que el objetivo es aplicarlo solo a un div cuyo id="contenedor_galeria"

pero lo que me ocurre es que a parte de implementarse en el div , tambien se implementa en el navegador de la pagina en el scroobar vertical.

y claro solo necesito que se impplemente en el div y no en digamos el body entero.

Si me pudieran ayudar les estaria muy agradecido este es el codigo:

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
52
53
54
55
56
57
58
<script>
 
    var nice1,nice2;
          var body;
          var off;
 
          $(window).load(function(){
            off = $("#contenedor_galeria").position();
            off.top+=2;
            off.left+=2;
            $("#contenedor_galeria").scroll();
          });
 
          function initScroll() {
 
            var tb = $('#nctouch').prop("checked");
 
            if (nice1) nice1.remove();
 
            nice1 = $("#contenedor_galeria").niceScroll({touchbehavior:tb,cursorcolor:"#555452",cursoropacitymax:0.6,cursorwidth:5,horizrailenabled:true,background:"none",autohidemode:false});
            $("#ncver").html(nice1.version);
 
            $("#contenedor_galeria").scroll(function(e) {
              if (!off) return;
              var px = $("#contenedor_galeria").scrollLeft() - off.left;
              var py = $("#contenedor_galeria").scrollTop() - off.top;
              body.style.backgroundPosition=-px+"px "+-py+"px";
 
              $("#infoscrolll").html($("#contenedor_galeria").scrollLeft()+'x'+$("#contenedor_galeria").scrollTop());
            });
 
            $("#contenedor_galeria").scroll();
 
          }
 
          $(document).ready(function() {
 
            body = document.getElementsByTagName("body")[0];
 
            $('body').niceScroll({cursoropacitymax:0.8,cursorwidth:8});
 
            $('#nctouch').iphoneStyle().change(function(){
              initScroll();
            });
 
            initScroll();
 
          });
 
          function getScroll(name) {
            $(name).scrollTop(Math.floor(Math.random()*3000));
          }
 
          function getScroll2D(name) {
            $(name).getNiceScroll().doScrollPos(Math.floor(Math.random()*4000),Math.floor(Math.random()*4000),150);
          }
 
</script>

Gracias de antemano.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve

Implementar scrollbar personalizado a un div

Publicado por xve (1596 intervenciones) el 29/08/2014 18:02:22
Hola Sam, no lo se muy bien, pero has probado a quitar esta linea?

1
$('body').niceScroll({cursoropacitymax:0.8,cursorwidth:8});
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Implementar scrollbar personalizado a un div

Publicado por Sam (95 intervenciones) el 29/08/2014 19:01:52
Xve, eres el P*** amo.

Mil gracias!!!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar