Implementar scrollbar personalizado a un div
Publicado por Sam (106 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:
Gracias de antemano.
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
0
