Actualiza tú foro arrastrando y soltando, como las aplicaciones móviles.
Buenas, hace tiempo que no hacía un tutorial por aquí, mas bien los tutoriales que hago son para darle mejor aspecto visual al foro & aquí vamos con otro.
Este trata de actualizar nuestro foro, o mas bien recargar el foro, arrastrando y soltando el scrollbar al llegar a la parte de arriba de la web, algo así como las aplicaciones de los móviles.
Primero que todo necesitamos bajar el siguiente pack, http://usehook.com/hook/hook.zip , el cual incluye dos archivos importantes más las imágenes que este usa:
Luego subimos las dos imágenes en RUTADELFORO/images/hook.
Creamos una nueva hoja de estilo con el nombre de hook.css & que aparezca globalmente, luego copiamos & pegamos el código que viene en la hoja de estilos que venía en el pack.
Ah eso si tienen que editar la ruta de imágenes, según donde ustedes hayan subido las imágenes.
Seguimos.. subimos el archivo hook.js en RUTADELFORO/jscripts/
Editamos la plantilla headerinclude, & agregamos lo siguiente, donde estimen conveniente:
Y para terminar, editamos la plantilla header & arriba de todo agregamos lo siguiente:
Ya luego les quedaría algo así cuando llegue a la parte de arriba con el scrollbar:
![[Image: actualizar-navegador-arrastrando-y-soltando.jpg]](http://www.kabytes.com/wp-content/uploads/2013/03/actualizar-navegador-arrastrando-y-soltando.jpg)
No es captura de un foro, es de la web oficial del script.
Para soporte, en mi foro personal: http://hasaezs.com/forum/
Saludos, espero les guste.
Este trata de actualizar nuestro foro, o mas bien recargar el foro, arrastrando y soltando el scrollbar al llegar a la parte de arriba de la web, algo así como las aplicaciones de los móviles.
Primero que todo necesitamos bajar el siguiente pack, http://usehook.com/hook/hook.zip , el cual incluye dos archivos importantes más las imágenes que este usa:
- hook.css
- hook.js
Luego subimos las dos imágenes en RUTADELFORO/images/hook.
Creamos una nueva hoja de estilo con el nombre de hook.css & que aparezca globalmente, luego copiamos & pegamos el código que viene en la hoja de estilos que venía en el pack.
Ah eso si tienen que editar la ruta de imágenes, según donde ustedes hayan subido las imágenes.
Seguimos.. subimos el archivo hook.js en RUTADELFORO/jscripts/
Editamos la plantilla headerinclude, & agregamos lo siguiente, donde estimen conveniente:
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script src="{$mybb->settings['bburl']}/jscripts/hook.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery.noConflict();
</script>Y para terminar, editamos la plantilla header & arriba de todo agregamos lo siguiente:
<div id="hook">
<div id="loader">
<div class="spinner"></div>
</div>
<span id="hook-text">Refrescando...</span>
</div>Ya luego les quedaría algo así cuando llegue a la parte de arriba con el scrollbar:
![[Image: actualizar-navegador-arrastrando-y-soltando.jpg]](http://www.kabytes.com/wp-content/uploads/2013/03/actualizar-navegador-arrastrando-y-soltando.jpg)
No es captura de un foro, es de la web oficial del script.
Para soporte, en mi foro personal: http://hasaezs.com/forum/
Saludos, espero les guste.
Muy buen tuto me gusto pero esto sirve para que se actualize mas rapido el foro porque si no subirian a cada rato y tardaria un ratito en actualizarce a cada rato.
![[Image: tumblr_nj9sv13aff1tga1sco4_r1_500.gif]](https://31.media.tumblr.com/b9f3b87cfcc886d53d07cd3fe8e67a24/tumblr_nj9sv13aff1tga1sco4_r1_500.gif)
![[Image: tumblr_nj9sv13aff1tga1sco4_r1_500.gif]](https://31.media.tumblr.com/b9f3b87cfcc886d53d07cd3fe8e67a24/tumblr_nj9sv13aff1tga1sco4_r1_500.gif)
excelente, algun ejemplo? (online)

10 Mar, 2013, 3:43 pm Omar G. wrote:
Quizás tenga una pagina que no quiero refrescar, voy hacia arriba y ahí tienes, se refresco.
Supongo que mas de una manera habrá para no cargarlo en todas la paginas (Template Conditionals?)
10 Mar, 2013, 4:43 pm Cluster wrote:
excelente, algun ejemplo? (online)
La web oficial del script :p http://usehook.com
![[Image: signature.png]](https://omarg.me/cache/images/signature.png)