Un "post-it" sur une page web

Résolu

Mickey7 Messages postés 53 Date d'inscription Statut Membre Dernière intervention -
CIDM - 20 oct. 2008 à 19:57

Bonjour,

J'aimerais mettre un "post-it" (ou une image du style post-it) en avant plan sur une de mes pages web.
Cette page est un formulaire et j'aimerais signaler, aux internautes, que je ne peux y répondre pour le moment.

Est-ce possible ? et si oui, comment dois-faire ?

PS: il s'agit de la page http://ww5.hippogeriatrie.be

Merci

Mickey

Afficher la suite

A voir également:

Un "post-it" sur une page web
Comment supprimer une page sur word - Guide
Web office - Guide
Comment imprimer un tableau excel sur une seule page - Guide
Post it windows - Télécharger - Agendas & Calendriers
Comment traduire une page web - Guide

8 réponses

Réponse 1 / 8

Christounet Messages postés 1264 Date d'inscription Statut Membre Dernière intervention 1 392

Bonjour Mickey7,

Tu trouveras ci-dessous le code complet d'un exemple d'une page HTML qui affiche juste le post-it, en fait j'ai copier/coller les lignes de code du lien de ma réponse précédente au bon endroit, tu n'auras plus qu'a copier/coller au bon endroit:

<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

chrisdrud

Bonjour,

Quelles sont les valeurs à modifier pour avoir la punaise cntrée en haut du post it ?
J'ai eu beau essayer differentes valeurs, ça ne fonctionne pas.

Merci d'avance

Réponse 2 / 8

CIDM

Pour aider ceux qui cherchent a en faire un simplement : www.mypostup.com.

Très facile a intégrer. Efficace.

Réponse 3 / 8

Christounet Messages postés 1264 Date d'inscription Statut Membre Dernière intervention 1 392

Bonjour,

En suivant le lien ci-dessous, tu trouveras une solution pour ajouter un post-it sur ta page, en utilsant du code CSS et HTML:

Post-it sur page Web

A plus

Réponse 4 / 8

Mickey7 Messages postés 53 Date d'inscription Statut Membre Dernière intervention 1

Salut,

merci beaucoup. Je m'y colle dès que j'ai un peu de temps.

A+
Mickey

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 8

Mickey7 Messages postés 53 Date d'inscription Statut Membre Dernière intervention 1

Bonjour,

Bin voilà ... :o(

J'ai essayé mais je n'y suis pas arrivé. Le CSS est trop compliqué. De plus, je travail avec FrontPage 2000 (donc pour les dernières nouveautés, c'est pas top). De plus en plus ... ;o) je suis pas trop expert en la matière => les trucs relativement simples sont pour moi un grand avantage.

Si vous avez donc des solutions !?

A+
Mickey

Réponse 6 / 8

Christounet Messages postés 1264 Date d'inscription Statut Membre Dernière intervention 1 392

Bonjour,

J'ai trouvé un autre exemple qui utilises un script et du code htlm, pas de css.

Il suffit de copier/coller les lignes du site dans Frontpage en suivant pas à pas les indications:

Post-It

A plus

Réponse 7 / 8

Mickey7 Messages postés 53 Date d'inscription Statut Membre Dernière intervention 1

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

Réponse 8 / 8

Mickey7 Messages postés 53 Date d'inscription Statut Membre Dernière intervention 1

Salut,

Alors là... MERCI.
Ca ne m'a prit que quelques minutes et CA MARCHE.

Il faut dire que j'ai encore reçu, via mon formulaire, plusieurs demandes (comme je peux m'occuper raisonnablement de ce sujet, pour le moment, c'est du temps perdu pour les internautes et de la crédibilité qui s'envole pour moi).

Encore une fois (je ne suis pas belge pour rien ;o) MERCI.

A+
Mickey
http://ww5.hippogeriatrie.be

Christounet Messages postés 1264 Date d'inscription Statut Membre Dernière intervention 1 392

Bonjour Mickey7,

Bien ton site, j'apprécie surtout la petite bannière en haut à gauche pour la Belgique.

A plus

PS: Je suis belge aussi et fier de l'être.

Discussions similaires

Post it sur le bureau (Mac)

Créer plusieurs aides-mémoires postit sur Mac

Post-it avec une liste à cocher sur le bureau

Votre réponse

Discussions similaires