Editando apunte: Uso de estrellas svg: Alertas

Editando apunte: Uso de estrellas svg: Alertas cerrar apuntes

ID: 110 (tabla: apuntes) Título:
Fecha: [poner fecha actual ]
Categorías: Vicisitudes de un Webmaster, Programación
Etiquetas: amigos, diseño, etiquetas, imágenes, php, sociedad, tags, webmaster
Extras: amigos, diseño, etiquetas, imágenes, php, sociedad, tags, webmaster
apunte: - - - - - - - -

<img src="diario.jocker.php?extra=estrella&puntas=15&tipo=a&borde=red" alt="estrella" style="border: 3px ridge red; float: right; margin: 0 0 .5em 1em; padding: .5em; width: 120px; height: 60px;"/>
	[rss]Existen muchos posibles usos para dibujos con forma de estrella; tal vez uno de los más comunes son los sistema de evaluación muy usados en blogs o páginas parecidas (como este diario)[/rss],
	pero nosotros lo aplicaremos en una alerta para indicar que tenemos nuevas fotos en la página de un amigo caricaturista: <a href="http://www.caricaturasmarbella.com">Caricaturas "San Jorge"</a>.


	Usaremos la misma estrella del apunte "<a href="?titulo=Generando+estrellas+svg&PHPSESSID=4nlghf98h585jgf3d8u1o58fv3">Generando estrellas svg</a>", pero con un número mayor de puntas, y con el borde rojo (tal como la estrella adjunta).
	Tal como vemos en la imagen, estará estirada y le añadiremos un texto en dos (2) líneas. En nuestro caso concreto "Nuevas Fotos". 


	<img src="ficheros/estrella.php?texto=Nuevas|Fotos" id="estrella_ejemplo" alt="estrella"/>
	[rss]Para darle algo de dinamismo le hemos añadido un efecto de rotación a las puntas de la estrella con una duración de cinco (5) segundos por cada giro.[/rss]


	Para los visitantes que no dispongan de un navegador que soporte este tipo de imágenes (podríamos considerarlos como navegadores obsoletos o anticuados), también se generan estrellas estáticas añadiendo el parámetro "img" con un valor distinto de "svg". La imagen del párrafo anterior de este apunte es un ejemplo;
	en nuestro caso hemos programado el evento de error de carga de la imagen (onerror).

<pre class="codigo"><img src="ficheros/estrella.php?texto=Nuevas|Fotos"
	id="estrella_ejemplo"
	alt="estrella"
	onerror="this.src += '&img=gif'"/></pre>

El código completo se puede obtener desde su fuente original: <a href="ficheros/estrella.txt?PHPSESSID=4nlghf98h585jgf3d8u1o58fv3">estrella.txt</a>; tan solo se debe cambiar la extensión del archivo o insertar el código con la instrucción include de php.

Controles Otras tablas: imagenes, postales, categorias, etiquetas, extras - - (popup ) - que

Seleccionar nuevo apunte

categoria Nombre:
Controles Otras tablas: apuntes, imagenes, postales, etiquetas extras - - Seleccionar: categoria
Descripción: - - - - - - - -	Apuntes

extra Nombre:
Controles Otras tablas: apuntes, imagenes, postales, categorias etiquetas - - Seleccionar: extra
Descripción: - - - - - - - -	Apuntes

etiqueta Nombre:
Controles Otras tablas: apuntes, imagenes, postales, categorias extras - - Seleccionar: etiqueta
Descripción: - - - - - - - -	Apuntes

Editor del diario

Zona de comentarios

Evaluación