Recuerda con un post-it que Internet Explorer no mola

He adaptado la idea de InKiLiNo para recomendar a los lectores que no utilicen Internet Explorer, llevándola un poco más lejos: con un post-it les recuerdo que IE no respeta los estándares W3C y que, en general, es inseguro. De paso, les cuelo un anuncio de Adsense por si les apetece cambiar a Firefox.

Si quieres copiártelo, lo puedes hacer sin el menor rubor. Para ello sólo tienes que hacer dos cosas sencillas. En primer lugar, copia este código CSS en tu archivo de estilos (el style.css que utilices):

#postit {
position: fixed;
right: 0px;
top: 0px;
width: 240px;
height: 213px;
background: transparent url('http://img267.imageshack.us/img267/2431/postitpum1.gif') no-repeat top right fixed ;
}

#text-postit {
position: fixed;
right: 40px;
top: 40px;
width: 180px;
height: 213px;
background: transparent;
text-align: left;
font-size: 12px;
}

Posteriormente, por ejemplo, en el encabezado del tema que utilices (fichero header.php), en cualquier sitio entre las etiquetas <head> y </head>, copia lo siguiente:

<!--[if IE]>
<div id="postit">
<div id="text-postit">
<strong>Recordatorio importante:</strong>
Este sitio se ve mucho mejor con Firefox. <script type="text/javascript"><!--
google_ad_client = "pub-1765942847287859";
google_ad_output = "textlink";
google_ad_format = "ref_text";
google_cpa_choice = "CAAQxav2_gEaCMgPrE7o6BhuKOW14YcBMAA";
google_ad_channel = "0558196936";
//-->
</script>
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>. No use Internet Explorer (IE) porque <a href="http://www.w3c.es/">no respeta los estándares de la W3C</a> y, además, <a href="http://browsehappy.com/why">es inseguro</a>
</div>
</div>
<![endif]-->

Con la declaración <!--[if IE]>, te asegurarás de que sólo a los usuarios de Internet Explorer les salga el post-it. Por supuesto, ni que decir tiene que el mensaje lo puedes cambiar, y que no es necesario que pongas la parte del código con el anuncio de Adsense (si lo haces, recuerda cambiarlo y poner tus propios datos: google_ad_client, …).

Si no usas IE (haces bien), y quieres ver cómo queda, ahí va un pantallazo:

Pulsa para ver la imagen

El post-it se va moviendo junto con la barra de desplazamiento, quedando siempre en la parte superior derecha de la pantalla, por lo que no interfiere demasiado con el contenido.

Actualización: Debido a que IE6 no trabaja bien con transparencias ni con posiciones fijas, he tenido que añadir este hack en el fichero de estilos:

/* Post-It para IE6 */
#postit {
_position: absolute;
_right: 0px;
_top: 0px;
_width: 240px;
_height: 213px;
_background: #f6f89c;
}
#text-postit {
_position: absolute;
_right: 40px;
_top: 40px;
_width: 180px;
_height: 213px;
_background: transparent;
_text-align: left;
_font-size: 12px;
}

Recuerda con un post-it que Internet Explorer no mola
Valora este apunte

1 comentario en “Recuerda con un post-it que Internet Explorer no mola

Deja un comentario