Ver Mensaje Individual
  #1 (permalink)  
Antiguo 29/03/2012, 18:45
Avatar de morfasto
morfasto
 
Fecha de Ingreso: julio-2011
Ubicación: Lima
Mensajes: 291
Antigüedad: 12 años, 9 meses
Puntos: 8
Boton con SPAN sin HREF ni INPUT BUTTON

Hola, que tal?

Estuve revisando un poco el funcionamiento de una pagina web bastante interesante: www.imgur.com.

Esta pagina tiene algunas cosas que me llamaron la atencion y me gustaria implementarlas de la misma manera en mi pagina web.

Por ejemplo: http://imgur.com/gallery/lFIn4 , en este link se muestra una imagen y debajo de esta al lado derecho hay opciones para compartir. Lo que me llamo la atencion son esos botones para compartir ya que si veo el codigo fuente, esto es lo unico que aparece de ellos:
Código HTML:
Ver original
  1. <ul>
  2.         <li class="title" title="Share on Twitter">
  3.             <span class="twitter_custom"></span>
  4.         </li>
  5.         <li class="title" title="Share on Facebook">
  6.             <span class="facebook_custom"></span>
  7.         </li>
  8.         <li class="title" title="Share on Reddit">
  9.             <span class="reddit_custom"></span>
  10.         </li>
  11.         <li class="title" title="Share on Tumblr">
  12.             <span class="tumblr_custom"></span>
  13.         </li>
  14.         <li class="title" title="Share on Stumble Upon">
  15.             <span class="stumbleupon_custom"></span>
  16.         </li>
  17.         <li class="title" title="Share over email">
  18.             <a href="javascript:;" class="addthis_button_email"><span class="st_email_custom"></span></a>
  19.         </li>
  20.         <li class="title" title="More sharing options">
  21.             <span class="addthis_button st_sharethis_custom"><span></span></span>
  22.         </li>
  23.     </ul>

Se estan usando listas con SPAN, pero... en donde esta el boton? donde esta el href? Al parecer no se usa nada de esto, sino simplemente javascript o algo que no tengo idea jaja. Se que la imagen de cada boton se agrega por medio de la hoja de estilo, pero, donde esta el link del boton?

Por otro lado, si es que quiero abrir ese boton en otra pestaña del explorador dandole click derecho, no se puede, ya que el menu del click derecho no te da esas opciones, sino solo atras y otras mas. Por lo que solo te permite ejecutar el boton cuando se da click izquierdo.

Como es que se hace un boton asi? Me interesa bastante porque necesito tener un boton que tenga las mismas caracteristicas que explique anteriormente.

Alguna idea?

Muchas Gracias!