jueves, 26 de septiembre de 2013

boton "ir al top" que desaparece

Cuando tenemos una página muy grande y el visitante ha llegado hasta abajo, para que suba rapido y no tenga que estar dando al la rueda del raton podemos poner un boton que suba arriba de la página.



Os dejo este código que esconde el boton cuando estamos arriba de la página y cuando comenzamos a bajar se muestra visible. El código es el suguiente:



  1. onscroll=function(){
  2.     var irtop=Math.max(document.documentElement.scrollTop,document.body.scrollTop);
  3.     if(irtop<200) {
  4.   document.getElementById('top').style.display='none';      
  5.  }else{
  6.         document.getElementById('top').style.display='block';
  7.   }
  8. }


Dentro del <body> pondemos uno de estos códigos:


          Este es para mostrar un enlace



  1. <div style="position:fixed;float: right;padding-right:20px;text-align:right;width:100%;right:0px;bottom:20px;z-index:10;display:none;" id="top">
  2. <a href="#top">subir</a></div>



         Este es para mostrar una imagen



  1. <div style="position:fixed;float: right;padding-right:20px;text-align:right;width:100%;right:0px;bottom:20px;z-index:10;display:none;" id="top">
  2. <a href="#top"><img src="URL_DE_LA_IMAGEN" width="50" height="50"></a></div>



        Este es para mostrar un boton



  1. <div style="position:fixed;float: right;padding-right:20px;text-align:right;width:100%;right:0px;bottom:20px;z-index:10;display:none;" id="top">
  2. <input value="subir" onclick="location.href = '#top'" type="button" /></div>



Como podeis ver, os dejo varias opciones, si quereis poner solo texto, poner una imagen, o poner un boton, que cada uno utilice la que mejor considere.




 Espero que os sea útil.




Un saludo..

martes, 24 de septiembre de 2013

Como hacer un portabultos para bicicleta "casero"

Hoy os voy a explicar como hacernos un portabultos para la bicicleta, pues cuando salimos con ella nos será muy útil para llevar una mochila o similar sin tener que ir con ella en la espalda, pues eso te produce un sudor y un peso innecesario, comenzamos.


Necesitaremos:
* 3 metros de varilla lisa de 6 mm.,
* 2 electrodos de rutilo.
* Un soldador de arco, para este trabajo he utilizado un inverter, que es mas ligero y a la hora de soldar es mas estable.
* Unos retales de pletina, con 10 cm. nos vale.
* 4 tornillos de 6x20.
* Pintura (del color que se adapte bien a nuestra bici, y que tengamos por casa.)

El coste de los materiales será inferior a 5 €.

Cortaremos la varilla de 6mm. de la siguientes medidas:

* 2 Und. de 72 cm.
* 1 Und. de 91 cm.
* 1 Und. de 60 cm.


una ves cortado, cojemos las piezas de 72 cm. y marcamos 12 cm. en su centro, y lo doblamos formando una U, con la pieza de 91 cm. le marcamos 12 cm. en su centro y la doblamos haciendo una U, a los extremos le marcamos 8 cm. y lo doblamos unos grados hacia dentro y a la vez hacia abajo, yo en la parte de atras la he doblado 1.5 cm. a 90º para que me haga de tope y no se resbale el bulto, y por útimo cojemos la pieza de 60 cm. y la doblamos haciendo un rectangulo que sea de 24 cm. x 6 cm.
Una vez que tengamos todas la piezas dobladas comenzamos a prepara para soldarlas. Centraremos el rectangulo que hemos hecho anteriormente a la pieza que mide 91 cm. (como se ve en la imagen) y le soldaremos las 2 U haciendo una V hacia el eje de la rueda trasera, las medidas para soldar estas varillas dependerá de la altura que querais darle, a mayor altura, mas juntos tendreis que soldar las varillas
Despues soldaremos las pletinas que sujetrán nuestro portabultos a la bicicleta, les haremos unos agujeros para los tornillos, que tendremos que hacer coincidir con los que lleve el cuadro de nuestra bici, por ello es muy importante tomar medidas.soldaremos las pletinas que van al eje de la rueda.

 

como podeis ver en la foto, las varillas iran por encima de la pletina, de lo contrario, podria llegar a rozar con los radios.
 


soldaremos la última pletina que es la que cojerá el portabultos al cuadro por debajo del sillin.

Una vez soldado todo, le quitaremos la cascarilla de la soldadura y pintaremos a nuestro gusto .

Y si todo ha salido bien , nos quedará algo como esto:

 

En este portabultos, en la parte trasera le he puesto un catadioptrico, cada uno le podeis añadir lo que creais oportuno.


Espero que os sea útil.


Un saludo...

martes, 17 de septiembre de 2013

Volver a la versión web desde versión móvil usando cookies en javascript

Después de haber tenido varias peticiones de como poder mostrar la versión web a los que hemos redireccionado a la versión móvil,


os dejo este código para que cuando tengamos a un visitante en la versión movil pueda ir a la versión web y no lo vuelva a redireccionar, esto lo he hecho creando una cookie, si el script lee la cookie te deja ver el contenido de la versión web, si no hay creada la cookie te redireccionará a la versión móvil. Tendremos que reemplazar lo siguiente del código puesto en Detectar moviles y redireccionar .


  1. Reemplazaremos:
  2. {
  3. window.location = "http://www.miwebmovil.com";

  4. }
  5. else
  6. {

  7. }


por el siguiente código:



  1. {
  2.        if(readCookie("nombredelacookie")){
  3.                 } else{  
  4.              window.location = "http://www.miwebmovil.com"; }
  5.             }
  6.             else { }



Como podemos ver en  este código, el que navega a través de un dispositivo móvil, antes de redireccionarlo comprobamos si esiste una cookie llamada "nombredelacookie"(recomiendo cambiar este nombre por uno personalizado), entonces le decimos que si esiste la cokie le mostramos esta página y si no esiste la cookie lo redireccionamos a la versión móvil.

 tambien en la versión web pondremos el siguiente código:



  1.   function readCookie(b){
  2.         var e=b+"=";
  3.         var a=document.cookie.split(";");
  4.         for(var d=0;d<a.length;d++){
  5.         var f=a[d];
  6.         while(f.charAt(0)==" "){
  7.         f=f.substring(1,f.length)
  8. }
  9.       if(f.indexOf(e)==0){
  10.         return f.substring(e.length,f.length)
  11.    }
  12.  }
  13.         return null}; 




Que será el encargado de leer la cookie.

Cuando hayamos tenido una visita desde un dispositivo móvil, lo hayamos redireccionado a la versión móvil y queramos dar la opcción para volver a la versión web y crear la cookie que necesitamos para poder mostrar la versión web con un dispositivo móvil, colocamos el siguiente enlace en la versión móvil:



  1. <a href="http://www.miweb.com" title=" " onClick="javascript:irwebcompleta();">ir a versión web</a>


 
como podemos ver en el mismo enlace tiene dos funciones, una nos envia a la versión web y la segunda llama a la función de javascript "irwebcompleta" que es la que nos creará la cookie.

Para crear la cookie utilizaremos el siguiente código:


  1. function irwebcompleta(a){
  2.     createCookie("nombredelacookie","accepted",a);
  3.  }    
  4. function createCookie(c,d,e){
  5.     if(e){
  6. var b=new Date();    
  7.     b.setTime(b.getTime()+(e*6*60*60*1000));  
  8.    var a="; expires="+b.toGMTString()}
  9.       else{
  10.    var a=""
  11.  }
  12.      document.cookie=c+"="+d+a+"; path=/"
  13.  }



 

este código debe ir donde esté la versión móvil.

Creo que ya está todo, cualquier duda o error de código, hacermelo saber.

Espero que os sea útil.




Un saludo...