Staff en línea

Página 1 de 3. 1, 2, 3  Siguiente

[rechazado] problemas con un código de smooth scroll
Tema iniciado por y Añadir a favoritos

URL:: Simply Books
Versión de mi foro:: phpbb3
Navegador:: Chrome
Descripcion del problema: Tengo un código javascript que hace el efecto smooth scroll en el foro, pero quiero saber qué valores del código tengo que cambiar para hacer que el retraso en el scrolling sea menor y a veces parece que falla; si hay dos zonas con scroll (por ejemplo las firmas) tengo que clicar para que se mueva el scroll de la segunda zona o intentarlo más de una vez con la rueda del ratón, no se mueve con solo poner el cursor encima de la zona y luego volver a clicar fuera para que se mueva el sroll principal del foro.
Capturas de pantalla del problema:

Aquí está el código:
Código:
!function(){function e(){var e=!1;e&&c("keydown",r),v.keyboardSupport&&!e&&u("keydown",r)}function t(){if(document.body){var t=document.body,o=document.documentElement,n=window.innerHeight,r=t.scrollHeight;if(S=document.compatMode.indexOf("CSS")>=0?o:t,w=t,e(),x=!0,top!=self)y=!0;else if(r>n&&(t.offsetHeight<=n||o.offsetHeight<=n)){var a=!1,i=function(){a||o.scrollHeight==document.height||(a=!0,setTimeout(function(){o.style.height=document.height+"px",a=!1},500))};if(o.style.height="auto",setTimeout(i,10),S.offsetHeight<=n){var l=document.createElement("div");l.style.clear="both",t.appendChild(l)}}v.fixedBackground||b||(t.style.backgroundAttachment="scroll",o.style.backgroundAttachment="scroll")}}function o(e,t,o,n){if(n||(n=1e3),d(t,o),1!=v.accelerationMax){var r=+new Date,a=r-C;if(a<v.accelerationDelta){var i=(1+30/a)/2;i>1&&(i=Math.min(i,v.accelerationMax),t*=i,o*=i)}C=+new Date}if(M.push({x:t,y:o,lastX:0>t?.99:-.99,lastY:0>o?.99:-.99,start:+new Date}),!T){var l=e===document.body,u=function(){for(var r=+new Date,a=0,i=0,c=0;c<M.length;c++){var s=M[c],d=r-s.start,f=d>=v.animationTime,h=f?1:d/v.animationTime;v.pulseAlgorithm&&(h=p(h));var m=s.x*h-s.lastX>>0,w=s.y*h-s.lastY>>0;a+=m,i+=w,s.lastX+=m,s.lastY+=w,f&&(M.splice(c,1),c--)}l?window.scrollBy(a,i):(a&&(e.scrollLeft+=a),i&&(e.scrollTop+=i)),t||o||(M=[]),M.length?E(u,e,n/v.frameRate+1):T=!1};E(u,e,0),T=!0}}function n(e){x||t();var n=e.target,r=l(n);if(!r||e.defaultPrevented||s(w,"embed")||s(n,"embed")&&/\.pdf/i.test(n.src))return!0;var a=e.wheelDeltaX||0,i=e.wheelDeltaY||0;return a||i||(i=e.wheelDelta||0),!v.touchpadSupport&&f(i)?!0:(Math.abs(a)>1.2&&(a*=v.stepSize/120),Math.abs(i)>1.2&&(i*=v.stepSize/120),o(r,-a,-i),void e.preventDefault())}function r(e){var t=e.target,n=e.ctrlKey||e.altKey||e.metaKey||e.shiftKey&&e.keyCode!==H.spacebar;if(/input|textarea|select|embed/i.test(t.nodeName)||t.isContentEditable||e.defaultPrevented||n)return!0;if(s(t,"button")&&e.keyCode===H.spacebar)return!0;var r,a=0,i=0,u=l(w),c=u.clientHeight;switch(u==document.body&&(c=window.innerHeight),e.keyCode){case H.up:i=-v.arrowScroll;break;case H.down:i=v.arrowScroll;break;case H.spacebar:r=e.shiftKey?1:-1,i=-r*c*.9;break;case H.pageup:i=.9*-c;break;case H.pagedown:i=.9*c;break;case H.home:i=-u.scrollTop;break;case H.end:var d=u.scrollHeight-u.scrollTop-c;i=d>0?d+10:0;break;case H.left:a=-v.arrowScroll;break;case H.right:a=v.arrowScroll;break;default:return!0}o(u,a,i),e.preventDefault()}function a(e){w=e.target}function i(e,t){for(var o=e.length;o--;)z[N(e[o])]=t;return t}function l(e){var t=[],o=S.scrollHeight;do{var n=z[N(e)];if(n)return i(t,n);if(t.push(e),o===e.scrollHeight){if(!y||S.clientHeight+10<o)return i(t,document.body)}else if(e.clientHeight+10<e.scrollHeight&&(overflow=getComputedStyle(e,"").getPropertyValue("overflow-y"),"scroll"===overflow||"auto"===overflow))return i(t,e)}while(e=e.parentNode)}function u(e,t,o){window.addEventListener(e,t,o||!1)}function c(e,t,o){window.removeEventListener(e,t,o||!1)}function s(e,t){return(e.nodeName||"").toLowerCase()===t.toLowerCase()}function d(e,t){e=e>0?1:-1,t=t>0?1:-1,(k.x!==e||k.y!==t)&&(k.x=e,k.y=t,M=[],C=0)}function f(e){if(e){e=Math.abs(e),D.push(e),D.shift(),clearTimeout(A);var t=D[0]==D[1]&&D[1]==D[2],o=h(D[0],120)&&h(D[1],120)&&h(D[2],120);return!(t||o)}}function h(e,t){return Math.floor(e/t)==e/t}function m(e){var t,o,n;return e*=v.pulseScale,1>e?t=e-(1-Math.exp(-e)):(o=Math.exp(-1),e-=1,n=1-Math.exp(-e),t=o+n*(1-o)),t*v.pulseNormalize}function p(e){return e>=1?1:0>=e?0:(1==v.pulseNormalize&&(v.pulseNormalize/=m(1)),m(e))}var w,g={frameRate:150,animationTime:800,stepSize:120,pulseAlgorithm:!0,pulseScale:8,pulseNormalize:1,accelerationDelta:20,accelerationMax:1,keyboardSupport:!0,arrowScroll:50,touchpadSupport:!0,fixedBackground:!0,excluded:""},v=g,b=!1,y=!1,k={x:0,y:0},x=!1,S=document.documentElement,D=[120,120,120],H={left:37,up:38,right:39,down:40,spacebar:32,pageup:33,pagedown:34,end:35,home:36},v=g,M=[],T=!1,C=+new Date,z={};setInterval(function(){z={}},1e4);var A,N=function(){var e=0;return function(t){return t.uniqueID||(t.uniqueID=e++)}}(),E=function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||function(e,t,o){window.setTimeout(e,o||1e3/60)}}(),K=/chrome/i.test(window.navigator.userAgent),L="onmousewheel"in document;L&&K&&(u("mousedown",a),u("mousewheel",n),u("load",t))}();

Es que no tengo ni idea de js
Mensaje automático



[ok]Se movio el tema a la papelera[/ok]
Aria
avatar

¿Que estoy pensando? :

Escribe lo que tienes en mente [table class=fecha_up][td]Se modifico:10/7/15 - 15:25 hrs.[/td][/table]


Banner en temas :

http://static.tumblr.com/ee5c516eb48ee3e839f133da0917acf8/zcxvzo8/6Womvw4se/tumblr_static_keru_cover.jpg


Color de titulos :

#fff


Sombra titulo :

0 1px #000


Mensajes :

79


Puntos :

95


Me gusta :

8


ingreso :

10/03/2015


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

staff
oh my god, todo ese code para bajar el scroll?
Chalo
avatar

¿Que estoy pensando? :

Buen miércoles a todos [table class=fecha_up][td]Se modifico:23/05/18 - 8:31 hrs. [/td][/table]


Banner en temas :

https://coverfiles.alphacoders.com/322/32281.jpg


Color de titulos :

#fff


Sombra titulo :

0 0 1px #000


Mensajes :

6676


Puntos :

8737


Me gusta :

1004


ingreso :

17/04/2014


Sexo :

Masculino

Plataforma :

phpbb3


Navegador :

chrome


Ver perfil de usuario https://www.opensourcephpbb3.com

Volver arriba Ir abajo

jajaja es el que se usa en blogger, lo he sacado de una plantilla que tenía... andaba buscando algo parecido al scroll del Explorer en Windows 10 y encontré eso.
Aria
avatar

¿Que estoy pensando? :

Escribe lo que tienes en mente [table class=fecha_up][td]Se modifico:10/7/15 - 15:25 hrs.[/td][/table]


Banner en temas :

http://static.tumblr.com/ee5c516eb48ee3e839f133da0917acf8/zcxvzo8/6Womvw4se/tumblr_static_keru_cover.jpg


Color de titulos :

#fff


Sombra titulo :

0 1px #000


Mensajes :

79


Puntos :

95


Me gusta :

8


ingreso :

10/03/2015


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

staff
No uses códigos de blogger para el foro, muchas veces solo interfiere con otros códigos y otras ni funciona. Hay formas más fáciles de hacer lo que pides, como chalo te respondió antes él te ayudará :P
RinC
avatar

¿Que estoy pensando? :

Ni se te ocurra -_- [table class=fecha_up][td]Se modifico:29/03/18 - 17:44 hrs. [/td][/table]


Banner en temas :

♥♥Open♥♥


Color de titulos :

#DF7401


Sombra titulo :

1px 1px 1px #fff


Mensajes :

788


Puntos :

1139


Me gusta :

193


ingreso :

28/01/2015


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

staff
[tag]Aria[/tag] Explicame que hace el code?
Chalo
avatar

¿Que estoy pensando? :

Buen miércoles a todos [table class=fecha_up][td]Se modifico:23/05/18 - 8:31 hrs. [/td][/table]


Banner en temas :

https://coverfiles.alphacoders.com/322/32281.jpg


Color de titulos :

#fff


Sombra titulo :

0 0 1px #000


Mensajes :

6676


Puntos :

8737


Me gusta :

1004


ingreso :

17/04/2014


Sexo :

Masculino

Plataforma :

phpbb3


Navegador :

chrome


Ver perfil de usuario https://www.opensourcephpbb3.com

Volver arriba Ir abajo

Oh, no sabía, pensaba que no funcionaría pero al probarlo conseguía el efecto.

Lo que hace es suavizar el movimiento del scroll cuando te mueves por la página. Juega con el tiempo que tarda en bajar/subir desde que giras la rueda del ratón y la distancia que recorre. Lo tengo puesto en el foro si quieres verlo.

He encontrado otro código:
Código:
if (window.addEventListener) window.addEventListener('DOMMouseScroll', wheel, false);
window.onmousewheel = document.onmousewheel = wheel;
 
function wheel(event) {
   var delta = 0;
   if (event.wheelDelta) delta = event.wheelDelta / 120;
   else if (event.detail) delta = -event.detail / 3;
 
   handle(delta);
   if (event.preventDefault) event.preventDefault();
   event.returnValue = false;
}
 
function handle(delta) {
   var time    = 1000;
   var distance    = 400;
 
   $('html, body').stop().animate({
      scrollTop: $(window).scrollTop() - (distance * delta)
   }, time );
}
Aria
avatar

¿Que estoy pensando? :

Escribe lo que tienes en mente [table class=fecha_up][td]Se modifico:10/7/15 - 15:25 hrs.[/td][/table]


Banner en temas :

http://static.tumblr.com/ee5c516eb48ee3e839f133da0917acf8/zcxvzo8/6Womvw4se/tumblr_static_keru_cover.jpg


Color de titulos :

#fff


Sombra titulo :

0 1px #000


Mensajes :

79


Puntos :

95


Me gusta :

8


ingreso :

10/03/2015


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

staff
la clave del code, que ya probe, y me gusto por cierto , esta en las variables que te dejo "abiertas"

Código:

! function () { function e() { var e = !1; e && c("keydown", r), v.keyboardSupport && !e && u("keydown", r) } function t() { if (document.body) { var t = document.body, o = document.documentElement, n = window.innerHeight, r = t.scrollHeight; if (S = document.compatMode.indexOf("CSS") >= 0 ? o : t, w = t, e(), x = !0, top != self) y = !0; else if (r > n && (t.offsetHeight <= n || o.offsetHeight <= n)) { var a = !1, i = function () { a || o.scrollHeight == document.height || (a = !0, setTimeout(function () { o.style.height = document.height + "px", a = !1 }, 500)) }; if (o.style.height = "auto", setTimeout(i, 10), S.offsetHeight <= n) { var l = document.createElement("div"); l.style.clear = "both", t.appendChild(l) } } v.fixedBackground || b || (t.style.backgroundAttachment = "scroll", o.style.backgroundAttachment = "scroll") } } function o(e, t, o, n) { if (n || (n = 1e3), d(t, o), 1 != v.accelerationMax) { var r = +new Date, a = r - C; if (a < v.accelerationDelta) { var i = (1 + 30 / a) / 2; i > 1 && (i = Math.min(i, v.accelerationMax), t *= i, o *= i) } C = +new Date } if (M.push({ x: t, y: o, lastX: 0 > t ? .99 : -.99, lastY: 0 > o ? .99 : -.99, start: +new Date }), !T) { var l = e === document.body, u = function () { for (var r = +new Date, a = 0, i = 0, c = 0; c < M.length; c++) { var s = M[c], d = r - s.start, f = d >= v.animationTime, h = f ? 1 : d / v.animationTime; v.pulseAlgorithm && (h = p(h)); var m = s.x * h - s.lastX >> 0, w = s.y * h - s.lastY >> 0; a += m, i += w, s.lastX += m, s.lastY += w, f && (M.splice(c, 1), c--) } l ? window.scrollBy(a, i) : (a && (e.scrollLeft += a), i && (e.scrollTop += i)), t || o || (M = []), M.length ? E(u, e, n / v.frameRate + 1) : T = !1 }; E(u, e, 0), T = !0 } } function n(e) { x || t(); var n = e.target, r = l(n); if (!r || e.defaultPrevented || s(w, "embed") || s(n, "embed") && /\.pdf/i.test(n.src)) return !0; var a = e.wheelDeltaX || 0, i = e.wheelDeltaY || 0; return a || i || (i = e.wheelDelta || 0), !v.touchpadSupport && f(i) ? !0 : (Math.abs(a) > 1.2 && (a *= v.stepSize / 120), Math.abs(i) > 1.2 && (i *= v.stepSize / 120), o(r, -a, -i), void e.preventDefault()) } function r(e) { var t = e.target, n = e.ctrlKey || e.altKey || e.metaKey || e.shiftKey && e.keyCode !== H.spacebar; if (/input|textarea|select|embed/i.test(t.nodeName) || t.isContentEditable || e.defaultPrevented || n) return !0; if (s(t, "button") && e.keyCode === H.spacebar) return !0; var r, a = 0, i = 0, u = l(w), c = u.clientHeight; switch (u == document.body && (c = window.innerHeight), e.keyCode) { case H.up: i = -v.arrowScroll; break; case H.down: i = v.arrowScroll; break; case H.spacebar: r = e.shiftKey ? 1 : -1, i = -r * c * .9; break; case H.pageup: i = .9 * -c; break; case H.pagedown: i = .9 * c; break; case H.home: i = -u.scrollTop; break; case H.end: var d = u.scrollHeight - u.scrollTop - c; i = d > 0 ? d + 10 : 0; break; case H.left: a = -v.arrowScroll; break; case H.right: a = v.arrowScroll; break; default: return !0 } o(u, a, i), e.preventDefault() } function a(e) { w = e.target } function i(e, t) { for (var o = e.length; o--;) z[N(e[o])] = t; return t } function l(e) { var t = [], o = S.scrollHeight; do { var n = z[N(e)]; if (n) return i(t, n); if (t.push(e), o === e.scrollHeight) { if (!y || S.clientHeight + 10 < o) return i(t, document.body) } else if (e.clientHeight + 10 < e.scrollHeight && (overflow = getComputedStyle(e, "").getPropertyValue("overflow-y"), "scroll" === overflow || "auto" === overflow)) return i(t, e) } while (e = e.parentNode) } function u(e, t, o) { window.addEventListener(e, t, o || !1) } function c(e, t, o) { window.removeEventListener(e, t, o || !1) } function s(e, t) { return (e.nodeName || "").toLowerCase() === t.toLowerCase() } function d(e, t) { e = e > 0 ? 1 : -1, t = t > 0 ? 1 : -1, (k.x !== e || k.y !== t) && (k.x = e, k.y = t, M = [], C = 0) } function f(e) { if (e) { e = Math.abs(e), D.push(e), D.shift(), clearTimeout(A); var t = D[0] == D[1] && D[1] == D[2], o = h(D[0], 120) && h(D[1], 120) && h(D[2], 120); return !(t || o) } } function h(e, t) { return Math.floor(e / t) == e / t } function m(e) { var t, o, n; return e *= v.pulseScale, 1 > e ? t = e - (1 - Math.exp(-e)) : (o = Math.exp(-1), e -= 1, n = 1 - Math.exp(-e), t = o + n * (1 - o)), t * v.pulseNormalize } function p(e) { return e >= 1 ? 1 : 0 >= e ? 0 : (1 == v.pulseNormalize && (v.pulseNormalize /= m(1)), m(e)) }
    var w, g = {
            frameRate: 150,
            animationTime: 800,
            stepSize: 120,
            pulseAlgorithm: !0,
            pulseScale: 8,
            pulseNormalize: 1,
            accelerationDelta: 20,
            accelerationMax: 1,
            keyboardSupport: !0,
            arrowScroll: 50,
            touchpadSupport: !0,
            fixedBackground: !0,
            excluded: ""
        },
        v = g, b = !1, y = !1, k = { x: 0, y: 0 }, x = !1, S = document.documentElement, D = [120, 120, 120], H = { left: 37, up: 38, right: 39, down: 40, spacebar: 32, pageup: 33, pagedown: 34, end: 35, home: 36 }, v = g, M = [], T = !1, C = +new Date, z = {}; setInterval(function () { z = {} }, 1e4); var A, N = function () { var e = 0; return function (t) { return t.uniqueID || (t.uniqueID = e++) } }(), E = function () { return window.requestAnimationFrame || window.webkitRequestAnimationFrame || function (e, t, o) { window.setTimeout(e, o || 1e3 / 60) } }(), K = /chrome/i.test(window.navigator.userAgent), L = "onmousewheel" in document; L && K && (u("mousedown", a), u("mousewheel", n), u("load", t))}();
busca en el code de arriba:
Código:

 var w, g = {
            frameRate: 150,
            animationTime: 800,
            stepSize: 120,
            pulseAlgorithm: !0,
            pulseScale: 8,
            pulseNormalize: 1,
            accelerationDelta: 20,
            accelerationMax: 1,
            keyboardSupport: !0,
            arrowScroll: 50,
            touchpadSupport: !0,
            fixedBackground: !0,
            excluded: ""
        },
creo que en estos esta la clave

Código:
 frameRate: 150,
  animationTime: 800,

pero puedes jugar con los otros valores, no toques los que tienen !

guarda los valores por default por si lo dejas muy mal puedas restaurar
Chalo
avatar

¿Que estoy pensando? :

Buen miércoles a todos [table class=fecha_up][td]Se modifico:23/05/18 - 8:31 hrs. [/td][/table]


Banner en temas :

https://coverfiles.alphacoders.com/322/32281.jpg


Color de titulos :

#fff


Sombra titulo :

0 0 1px #000


Mensajes :

6676


Puntos :

8737


Me gusta :

1004


ingreso :

17/04/2014


Sexo :

Masculino

Plataforma :

phpbb3


Navegador :

chrome


Ver perfil de usuario https://www.opensourcephpbb3.com

Volver arriba Ir abajo

Genial! Muchas gracias, voy a probar a ver
Aria
avatar

¿Que estoy pensando? :

Escribe lo que tienes en mente [table class=fecha_up][td]Se modifico:10/7/15 - 15:25 hrs.[/td][/table]


Banner en temas :

http://static.tumblr.com/ee5c516eb48ee3e839f133da0917acf8/zcxvzo8/6Womvw4se/tumblr_static_keru_cover.jpg


Color de titulos :

#fff


Sombra titulo :

0 1px #000


Mensajes :

79


Puntos :

95


Me gusta :

8


ingreso :

10/03/2015


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

staff
Hola [tag]Aria[/tag]

[ok]Si tu duda fue resuelta, y los códigos que se te proporcionaron te funcionaron por favor edita el tema y marca Resuelto[/ok]
Fibo
avatar

¿Que estoy pensando? :

Estamos en Open, Estamos en Familia [table class=fecha_up][td]Se modifico:1/02/17 - 19:06 hrs.[/td][/table]


Banner en temas :

https://i.imgur.com/R9vnOcf.jpg


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #fff


Mensajes :

409


Puntos :

618


Me gusta :

121


ingreso :

11/09/2015


Sexo :

Masculino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario https://www.opensourcephpbb3.com

Volver arriba Ir abajo

Sigue pasando lo mismo... si hay otra zona con scroll, como las firmas, tengo que clicar ahí para moverlo y luego volver a clicar fuera para mover el scroll principal del foro... eso es normal o no debería hacerlo? Porque con el scroll normal no pasaba [tag]Chalo[/tag]
Aria
avatar

¿Que estoy pensando? :

Escribe lo que tienes en mente [table class=fecha_up][td]Se modifico:10/7/15 - 15:25 hrs.[/td][/table]


Banner en temas :

http://static.tumblr.com/ee5c516eb48ee3e839f133da0917acf8/zcxvzo8/6Womvw4se/tumblr_static_keru_cover.jpg


Color de titulos :

#fff


Sombra titulo :

0 1px #000


Mensajes :

79


Puntos :

95


Me gusta :

8


ingreso :

10/03/2015


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

 En la misma categoria


Permisos de este foro:
No puedes responder a temas en este foro.