Una nota adhesiva en una página web
Resuelto
Mickey7
Mensajes publicados
56
Estado
Miembro
-
CIDM -
CIDM -
Hola,
Me gustaría poner un "post-it" (o una imagen tipo post-it) en primer plano en una de mis páginas web. Esta página es un formulario y me gustaría indicar a los usuarios que por el momento no puedo responder. ¿Es posible? y si es así, ¿cómo debo hacerlo?
PD: se trata de la página http://ww5.hippogeriatrie.be
Gracias
Mickey
Configuración: Windows XP Firefox 2.0.0.11
8 respuestas
-
Hola Mickey7, A continuación encontrarás el código completo de un ejemplo de una página HTML que solo muestra el post-it. De hecho, copié/pegé las líneas de código del enlace de mi respuesta anterior en el lugar adecuado, solo tendrás que copiar/pegar en el lugar correcto:
<head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>Page</title> <script Language="Javascript"> <!-- /* Affiche un postit sur la page Amélioré par le site WEB Creation : - 20030801 : est maintenant compatible avec Netscape 6+ et Mozilla 1+ - 20030801 : amélioration du code et ajout d'un tableau de postits permettant de générer aléatoirement des postits D'autres scripts ? >> http://www.web-creation-fr.com */ // Vous pouvez rentrer plusieurs postits pour en afficher de façon aléatoire // Si vous ne voulez en afficher qu'un, il suffit de ne garder que le Postit[0] Postit=new Array(); Postit[0]="<b>Postit n°1 :</b><BR><BR>N'est-ce pas une <br>agréable façon d'indiquer<br>des nouveautés à vos<br> visiteurs ?"; Postit[1]="<b>Postit n°2 :</b><BR><BR>N'est-ce pas une <br>agréable façon d'indiquer<br>des nouveautés à vos<br> visiteurs ?"; Postit[2]="<b>Postit n°3 :</b><BR><BR>N'est-ce pas une <br>agréable façon d'indiquer<br>des nouveautés à vos<br> visiteurs ?"; Postit[3]="<b>Postit n°4 :</b><BR><BR>N'est-ce pas une <br>agréable façon d'indiquer<br>des nouveautés à vos<br> visiteurs ?"; Postit[4]="<b>Postit n°5 :</b><BR><BR>N'est-ce pas une <br>agréable façon d'indiquer<br>des nouveautés à vos<br> visiteurs ?"; // Choix aléatoire du postit à afficher function RandomPostit() { if (Postit.length>0) { nombre=(Math.floor((Postit.length)*Math.random())); return Postit[nombre]; } else { return Postit[0]; } } function AfficherPostit(xo,yo,texte) { // Si le navigateur est autre que IE (il doit respecter les dernières normes du DHTML pour pouvoir afficher le postit) if (!document.all){ // Définition du calque dans une variable pour plus de commodité calque=document.getElementById('postit'); // Si la coordonnée xo du postit vaut -1, alors on le centre en largeur if (xo==-1){xo=(window.innerWidth/2)-120;} // Si la coordonnée xo du postit vaut -1, alors on le centre en hauteur if (yo==-1){yo=(window.innerHeight/2)-120;} // Application de la position au calque calque.style.left=xo; calque.style.top=yo; // Insertion du contenu du postit document.getElementById('contenu').innerHTML="<font color=#000000 size=2 face=verdana>"+texte+"</font>"; // Et enfin affichage du calque calque.style.visibility="visible"; } else { // Si le navigateur est IE // Idem que ci-dessus pour le reste if (xo==-1){xo=(document.body.clientWidth/2)-120;} if (yo==-1){yo=(document.body.clientHeight/2)-120;} document.all.postit.style.left=xo; document.all.postit.style.top=yo; document.all.contenu.innerHTML='<font color=#000000 size=2 face=verdana>'+texte+'</font>'; document.all.postit.style.visibility="visible"; } } function FermerPostit() { if (!document.all) { calque=document.getElementById('postit'); calque.innerHTML=""; calque.style.visibility="hidden"; } else { postit.innerHTML=""; document.all.postit.style.visibility="hidden"; } } //--> </script> </head> <body onload="AfficherPostit(-1,-1,RandomPostit())"> <div id="postit" style="position:absolute;left:-240px;top:0px;width:240px;height:240px;visibility:hidden" > <table border=0 cellpading=0 width=240 height=240 background="../33_postit.gif"> <tr> <td align=center valign=middle> <div id="contenu"></div> </td> </tr> </table> <div id="close" style="position:relative;top:-230;left:100;width:21;height:21;"> <a href="javascript:FermerPostit()"> <img src="../33_punaise.gif" border=0 width="16" height="21"></a> </div> </div> </body>
Il suffit juste encore de changer l’emplacement des images 33_postit.gif et 33_punaise.gif A plus -
Para ayudar a quienes buscan hacerlo de forma simple: www.mypostup.com.
Muy fácil de integrar. Eficaz. -
Hola,
Siguiendo el enlace a continuación, encontrarás una solución para añadir un post-it en tu página, usando código CSS y HTML:
Post-it en la página Web
Nos vemos -
Hola,
muchas gracias. Me pongo a ello tan pronto como tenga un poco de tiempo.
Nos vemos
Mickey -
Hola,
Bueno... :o(
He intentado pero no lo he logrado. El CSS es demasiado complicado. Además, trabajo con FrontPage 2000 (así que para las últimas novedades, no es lo más adecuado). Cada vez más... ;o) no soy experto en la materia => las cosas relativamente simples son para mí una gran ventaja.
Si tenéis, pues, alguna solución!?
Un saludo
Mickey -
Hola,
Encontré otro ejemplo que utiliza un script y código HTML, sin CSS.
Basta con copiar/pegar las líneas del sitio en FrontPage siguiendo paso a paso las indicaciones:
Post-It
Hasta luego -
Je ne dois vraiment pas être doué :o((((((((((((
la seule image qui sort, est : onload="AfficherPostit(-1,-1,RandomPostit())"
je crois que c'est parce que je ne parviens pas à faire la différence entre :
"Insérez le code ci-dessous dans la balise <BODY> de votre page HTML"
et
"Insérez le code ci-dessous entre les balises <BODY> et </BODY> de votre page HTML"
C'est pas que je me décourage, mais le temps me manque de plus en plus => je crois que je vais laisser tombé.
En tout cas, un très grand merci pour tes conseils.
A+ (quand j'aurai un peu plus de temps ;o)
Mickey -
Hola,
Entonces... GRACIAS.
Solo me llevó unos minutos y FUNCIONA.
Cabe decir que todavía recibí, a través de mi formulario, varias solicitudes (como puedo ocuparme razonablemente de este tema, por ahora es tiempo perdido para los internautas y la credibilidad que se va de mí).
Una vez más (no soy belga por nada ;o) GRACIAS.
A+
Mickey
http://ww5.hippogeriatrie.be