Fading Javascript Tooltip

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam id tellus. Nulla orci enim, vulputate et, pharetra eget, imperdiet non, sem. Mauris sit amet mi nec nulla porttitor dapibus. Curabitur leo sem, lacinia sed, commodo eu, mattis sit amet, felis. Ut tortor. Donec porttitor orci et neque. Curabitur eget diam at libero egestas suscipit. In tortor est, ullamcorper eu, dapibus et, condimentum nec, nunc. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Duis vel purus eget diam aliquam luctus. Nullam risus ipsum, aliquam et, lacinia sit amet, fermentum vel, mi. In hac habitasse platea dictumst. Maecenas et dui non tortor lobortis feugiat. Donec eleifend iaculis arcu. Cras vitae leo nec nunc rhoncus laoreet. Integer eget enim. Nunc dignissim cursus mi. Donec eros.

Leer Mas......

Menu3D

Por ahi anda: bajo el título del blog...

Leer Mas......

MooChek

	Primera etiquta
	Segunda etiqueta
	Tercera etiqueta

	proposición n°1
	proposición n°2
	proposición n°3
	proposición n°4

Leer Mas......

MooVirtualImageBox

• 
• 
• 

Leer Mas......

CLASICA SE MUDA

Todas sus entradas están ahora en "AYUDA-KAOS":

ENTRADAS

Leer Mas......

Expansor de imágenes

Con un código CSS y otro de HTML, podemos exponer, en pequeñito, las imágenes que elijamos... o fotos de quienes somos... o fotos de nuestros vajes... cuadros que nos gustan...

Y ampliarlas con sólo pasar el ratón por encima-pop-up-... y añadirles un comentario.

He colocado-una vez expandida mi plantilla, el código CSS antes del cierre de "skin". Y el código HTML justo detrás del "header-wrapper" y justo antes del "b:section class="header" id="header".

Luego, he cambiado las URL de "src=" por las de mis imágenes, y he añadido detrás el texto que me ha parecido, en lugar del que trae el código para las fotos que incluye. Este es el código original:

CSS:

<style type="text/css"><br /><br />/*Credits: Dynamic Drive CSS Library */<br />/*URL: http://www.dynamicdrive.com/style/ */<br /><br />.thumbnail{<br />position: relative;<br />z-index: 0;<br />}<br /><br />.thumbnail:hover{<br />background-color: transparent;<br />z-index: 50;<br />}<br /><br />.thumbnail span{ /*CSS for enlarged image*/<br />position: absolute;<br />background-color: lightyellow;<br />padding: 5px;<br />left: -1000px;<br />border: 1px dashed gray;<br />visibility: hidden;<br />color: black;<br />text-decoration: none;<br />}<br /><br />.thumbnail span img{ /*CSS for enlarged image*/<br />border-width: 0;<br />padding: 2px;<br />}<br /><br />.thumbnail:hover span{ /*CSS for enlarged image on hover*/<br />visibility: visible;<br />top: 0;<br />left: 60px; /*position where enlarged image should offset horizontally */<br /><br />}<br /><br /></style><br />


HTML:

<a class="thumbnail" href="#thumb"><img src="media/tree_thumb.jpg" width="100px" height="66px" border="0" /><span><img src="media/tree.jpg" /><br />Simply beautiful.</span></a><br /><br /><a class="thumbnail" href="#thumb"><img src="media/ocean_thumb.jpg" width="100px" height="66px" border="0" /><span><img src="media/ocean.jpg" /><br />So real, it's unreal. Or is it?</span></a><br /><br /><br /><br /><br /><br /><br /><a class="thumbnail" href="#thumb">Dynamic Drive<span><img src="media/dynamicdrive.gif" /><br />Dynamic Drive</span></a><br /><br /><a class="thumbnail" href="#thumb">Zoka Coffee<span><img src="media/zoka.gif" /><br />Zoka Coffee</span></a><br />


Es de Dinamic Drive CSS Library

Leer Mas......