Esconder texto que no cabe a lo ancho css …

Simular “text-overflow:ellipsis” para textos largos ( multilínea )

En CSS, si utilizamos las siguientes propiedades:

 
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
 
Podemos conseguir que un texto se corte a la anchura que queramos y se inserten automáticamente unos puntos suspensivos al final.
 

El murciel…

 

Leer más

¿Como puedo convertir o crear mi sitio web en responsive web design?

Desde la llegada de HTML5 y CSS3, el Responsive Design o “Diseño Sensible” es una nueva técnica que se está empezando a utilizar cada vez más. Consiste básicamente en adaptar los diseños de las páginas web en función del tamaño de la ventana del navegador, cambiando según esta aumenta o disminuye y sin necesidad de disponer varias versiones de CSS o HTML.

Podéis ver un pequeño ejemplo si redimensionáis el blog o si lo véis en un iPad; o podéis flipar si comprobáis hasta que punto se puede utilizar esta técnica entrando a Smashing Magazine o en mi página personal.

El ejemplo que os voy a proponer es muy simple y solo cuenta con 3 pasos: Añadir un meta tag al header, añadir compatibilidad con navegadores antiguos y realizar modificaciones en el CSS.

 

1. Añadir el meta tag para la escala

En primer lugar debemos añadir el siguiente código entre las etiquetas “<head>” de nuestra página.

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Básicamente lo que hace esta etiqueta es ajustar el ancho al ancho del dispositivo (sea un navegador o un dispositivo móvil) e indicar que no se debe hacer zoom inicialmente.

2. Añadir compatibilidad con navegadores antiguos

Como las versiones antiguas de Internet Explorer no soportan el meta “viewport”, debemos añadir un javascript que realice su función.

Leer más

Mostrar Leyenda / Aviso al cerrar pagina Web (javascript)

Les dejare un ejemplo de un codigo en JavaScript que servira para mostrar un advertencia o aviso al abandonar pagina web, de esa manera se puede evitar que algun usuario se salga por accidente de una pagina o pierda sus datos y claro tambien podra tener otras utilidades, espero les sirva.

 

Este codigo insertalo en el HEAD de tu Pagina:

<script language='javascript'>
closingvar =true
window.onbeforeunload = exitcheck;
function exitcheck()

///control de cerrar la ventana///
 if(closingvar == true)
  { exitcheck = false
    return "Aqui reemplaza esto por tu leyenda o aviso a mostrar ";
  }
}
</script> 
Leer más