Visual Basic / VB.NET : Personnalisez vos boîtes de message (x)html

Description

Cette page est la traduction de l'article : CSS Message Boxes for different message types.
Dans cette page, nous allons visualiser des boîtes de message personnalisées en fonction du type de message.
j'etulise pur ca le VBscript & CSS

Source / Exemple :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head> 
<HTA:APPLICATION
      Application ID = "MsgPerso"
      APPLICATIONNAME = "MsgPerso"
      BORDER = "Thick"
      BORDERSTYLE = "Complex"
      CAPTION = "Yes"
      CONTEXTMENU = "no"
      ICON = ""
      INNERBORDER = "yes"
      MINIMIZEBUTTON = "no"
      NAVIGABLE = "Yes"
      SCROLL = "No"
      SCROLLFLAT = "Yes"
      SELECTION = "No"
      SHOWINTASKBAR = "Yes"
      SINGLEINSTANCE = "Yes"
      SYSMENU = "yes"
      VERSION = "1.0"
      WINDOWSTATE = "Normal"
      />
  <meta name="GENERATOR" content="Microsoft FrontPage 5.0">
  <meta name="ProgId" content="FrontPage.Editor.Document">
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
  <style type="text/css"> 
#element1 {
position:absolute;
background-color:#FFBABA;
top:224px;
right:210px;
}
#element2 {
position:absolute;
background-color:#BDE5F8;
top:355px;
right:210px;
}
#element3 {
position:absolute;
background-color:#FEEFB3;
top:155px;
right:1px;
}
#element4 {
position:absolute;
background-color:#DFF2BF;
top:224px;
right:14px;
}
div#bandeau {
width:600px;
height:50px;
background-color:#00CCFF;
}
div#contenu {
width:600px;
height:400px;
background-color:#FFCC00;
}
div#piedpage {
width:600px;
height:100px;
background-color:#33FF99;
}
div#menuhaut {
width:100px;
height:200px;
}
div#menubas {
width:100px;
height:200px;
}
.TA_Etapeencours {color:#990000; font-family:Impact, Arial; font-size:18px;border-bottom:1px dotted #666666;margin-left:10px;margin-right:4px;}
.TA_Fiche_ChapoAst2 {font:normal 14px verdana;color:#000000;line-height:24px; padding-bottom:20px;}
.ImgTitre_text2{ display:block; position:absolute; font-family: Impact, Arial, Helvetica  ; font-size:46px; color:#666666; text-decoration:none; background:#FFFFFF; padding-right:10px;}
.TA_Fiche_ChapoAst2 {font:normal 14px verdana;color:#000000;line-height:24px; padding-bottom:20px;}
</style> 
<!-- Insertion de scripts JavaScript -->
<script language="javascript"> 
/*
Script Texte défilant pour tous les navigateurs-
© Dynamic Drive (www.dynamicdrive.com)
Pour le code source complet, les instructions d'installation,
des centaines d'autres scripts DHTML et les modalités d'utilisation,
visitez dynamicdrive.com

/

//Spécifiez la largeur du texte défilant (en pixels)
var marqueewidth=330;
//Spécifiez la hauteur du texte défilant (en pixels, se rapporte uniquement à Netscape)
var marqueeheight=20;
//Spécifiez la vitesse de défilement du texte défilant (plus grand nombre = plus grande vitesse)
var speed=6;
//Spécifiez le contenu du texte défilant
var marqueecontents='<div class="TA_Etapeencours"><font face="Arial"><strong><big>Un grand merci à Janko Jovanovic (Auteur) Didier Mouronval (Traducteur) pour l´article :Personnalisez vos boîtes de message (X)HTML </big></strong></font></dive>';

if (document.all)
document.write('<marquee scrollAmount='+speed+' style="width:'+marqueewidth+'">'+marqueecontents+'</marquee>');

function regenerate(){
window.location.reload();
}
function regenerate2(){
if (document.layers){
setTimeout("window.onresize=regenerate",450);
intializemarquee();
}
}

function intializemarquee(){
document.cmarquee01.document.cmarquee02.document.write('<nobr>'+marqueecontents+'</nobr>');
document.cmarquee01.document.cmarquee02.document.close();
thelength=document.cmarquee01.document.cmarquee02.document.width;
scrollit();
}

function scrollit(){
if (document.cmarquee01.document.cmarquee02.left>=thelength*(-1)){
document.cmarquee01.document.cmarquee02.left-=speed;
setTimeout("scrollit()",100);
}
else{
document.cmarquee01.document.cmarquee02.left=marqueewidth;
scrollit();
}
}</script>
<title>Boite message perso</title>
</head>
<body>
<div id="bandeau" style="width: 1240px; height: 125px;"> 
<span class="ImgTitre_text2">Personnalisez vos boîtes de message (X)HTML<br>
<div class="TA_Fiche_ChapoAst2">Cette page est la traduction de l'article :<a href="http://www.jankoatwarpspeed.com/post/2008/05/22/CSS-Message-Boxes-for-different-message-types.aspx"> CSS Message Boxes for different message types.</a><br>
Dans cette page, nous allons visualiser des boîtes de message personnalisées en
fonction du type de message.
</div></span>
</div> 	
</div>
<div id="contenu" style="width: 1240px; height: 458px;"> 
<div id="element1">       
<div class="TA_Fiche_ChapoAst2" style="width: 520px; height: 116px;">
       <img src="error.ico" alt="texte alternatif" height="32" width="32">
       Les messages d'erreur devraient être affichés lorsque
       l'opération n'a pas pu se réaliser du tout. Par exemple :
       "Votre profil n'a pas pu être créé." La couleur
       rouge est appropriée pour ces messages car les gens l'associent
       à tous les types d'alerte.</div>
        </div>  
<div id="element2">
       
<div class="TA_Fiche_ChapoAst2" style="width: 520px; height: 95px;">
       <img src="info.ico" alt="texte alternatif" height="32" width="32">
          Le but de ce type de message est d'informer 
          l'utilisateur de quelque chose d'important. Cela peut être présenté
          en bleu car les gens associent souvent cette couleur à 
          une information, indépendamment du contenu. Cela peut
          correspondre à n'importe quelle information concernant les actions 
          de l'utilisateur.
          </div>
<div id="element3" style="width: 130px; height: 76px;">        
<div class="TA_Fiche_ChapoAst2" style="width: 520px; height: 95px;">
        <img src="warning.ico" alt="texte alternatif" height="32" width="32">
          Les messages d'alerte devraient être affichés 
          lorsqu'une opération n'a pas pu se terminer complètement. Par exemple
          "Votre profil a bien été enregistré, mais nous n'avons 
          pas pu envoyer de mail à votre adresse" ou "Si vous ne créez
         pas votre profil, vous ne pourrez pas chercher 
          d'emploi". Habituellement, ces messages sont affichés en jaune avec un point d'exclamation.
        </div>

        </div>

        </div>

        
<div id="element4" style="width: 123px; height: 38px;">
        
<div class="TA_Fiche_ChapoAst2" style="width: 189px; height: 324px;">
		<img src="success.ico" alt="texte alternatif" height="32" width="32">
          Les messages de réussite devraient être affichés après 
          le succès d'une action de l'utilisateur. J'entends par là une
          opération complètement terminée, pas partiellement 
          terminée et sans erreur jusque là. Le message pourrait dire par
          exemple : "Votre profil a été enregistré avec succès 
          et un mail de confirmation vous a été adressé à l'adresse que
          vous avez indiquée". Ce qui signifie que toutes les 
          étapes ont été effectuées avec succès (enregistrement du profil
          et envoi de mail).
         </div>

         </div>

<div id="menuhaut" style="width: 380px; height: 167px;">
<div class="TA_Etapeencours">Ajoutez un message personnalisée ici</div>
<br>

<form name="txtCommentaires">
  <textarea name="message" rows="10" cols="30" dir="ltr">Par exemple Votre profil n'a pas pu être créé.</textarea></form>
</div>

<div id="menubas" style="width: 314px; height: 209px;">
<div class="TA_Etapeencours">Choisissez un type de boite message</div>
	  <!--==--==--==--==--==--==--==--==-- Radio Button --==--==--==--==--==--==--==-->
      
<fieldset width="" 290px=""><legend><font face="Verdana">Icône...</font></legend>
      
<table style="text-align: left; width: 398px; height: 186px;" border="0" cellpadding="2" cellspacing="2">
        <tbody>

          <tr>

            <td style="width: 32px; height: 32px;"><font face="Verdana"><img style="width: 32px; height: 32px;" alt="" src="error.ico"></font></td>

            <td style="height: 32px; width: 264px;"><font face="Verdana"><input name="optMsg" value="MsgErr" onclick="MsgErr()" type="radio">Message 
            d'erreur </font> </td>

          </tr>

          <tr>

            <td style="width: 32px; height: 24px;"><font face="Verdana"><img style="width: 32px; height: 32px;" alt="" src="Info.ico"></font></td>

            <td style="height: 24px; width: 264px;"><font face="Verdana"><input name="optMsg" value="MsgInfo" onclick="MsgInfo()" type="radio">Message 
            d'information</font></td>

          </tr>

          <tr>

          <td style="width: 32px; height: 32px;"><font face="Verdana"><img style="width: 32px; height: 32px;" alt="" src="success.ico"></font></td>

            <td style="width: 264px; height: 32px;"><font face="Verdana"><input name="optMsg" value="MsgReust" onclick="MsgReusit()" type="radio">Message 
            de réussite</font></td>

          </tr>

          <tr>

            <td style="width: 32px; height: 48px;"><font face="Verdana"><img style="width: 32px; height: 32px;" alt="" src="warning.ico"></font></td>

            <td style="width: 264px; height: 48px;"><font face="Verdana"><input name="optMsg" value="MsgAlert" onclick="MsgAlert()" type="radio">Message 
            d'alerte</font></td>
          </tr>        
  </tbody>
      
</table>

      </fieldset>

</div>

</div>
																					   
<div id="piedpage" style="width: 1240px; height: 160px;"></div>	
 <!--#################[ Ajoute script code]######################--> 
 <SCRIPT LANGUAGE="VBScript"> 
   sub MsgErr() 
   img="error.ico" 
   x=document.txtCommentaires.message.value 
   document.write("<style type=""text/css"">")
   document.write ("body{")
   document.write ("font-family:Arial, Helvetica, sans-serif;")
   document.write ("font-size:13px;")
   document.write ("}")
   document.write (".info, .success, .warning, .error, .validation {")
   document.write ("border: 1px solid;")
   document.write ("margin: 10px 0px;")
   document.write ("padding:15px 10px 15px 50px;")
   document.write ("background-repeat: no-repeat;")
   document.write ("background-position: 10px center;")
   document.write ("}")
   document.write (".error {")
   document.write ("color: #D8000C;")
   document.write ("background-color: #FFBABA;")
   document.write("background-image: url(" &  img  & ")")
   document.write ("}</style>")
   document.write("<div class=""error"">" & x & "</div>")
  end sub 
  sub MsgInfo()
   img="info.ico" 
   x=document.txtCommentaires.message.value 
   document.write("<style type=""text/css"">")
   document.write ("body{")
   document.write ("font-family:Arial, Helvetica, sans-serif;")
   document.write ("font-size:13px;")
   document.write ("}")
   document.write (".info, .success, .warning, .error, .validation {")
   document.write ("border: 1px solid;")
   document.write ("margin: 10px 0px;")
   document.write ("padding:15px 10px 15px 50px;")
   document.write ("background-repeat: no-repeat;")
   document.write ("background-position: 10px center;")
   document.write ("}")
   document.write (".info {")
   document.write ("color: #00529B;")
   document.write ("background-color: #BDE5F8;")
   document.write("background-image: url(" &  img  & ")")
   document.write ("}</style>")
   document.write("<div class=""info"">" & x & "</div>")
  end sub 
  sub MsgAlert()
   img="warning.ico" 
   x=document.txtCommentaires.message.value 
   document.write("<style type=""text/css"">")
   document.write ("body{")
   document.write ("font-family:Arial, Helvetica, sans-serif;")
   document.write ("font-size:13px;")
   document.write ("}")
   document.write (".info, .success, .warning, .error, .validation {")
   document.write ("border: 1px solid;")
   document.write ("margin: 10px 0px;")
   document.write ("padding:15px 10px 15px 50px;")
   document.write ("background-repeat: no-repeat;")
   document.write ("background-position: 10px center;")
   document.write ("}")
   document.write (".warning {")
   document.write ("color: #9F6000;")
   document.write ("background-color: #FEEFB3;")
   document.write("background-image: url(" &  img  & ")")
   document.write ("}</style>")
   document.write("<div class=""warning"">" & x & "</div>")
  end sub  
  sub MsgReusit()
   img="success.ico" 
   x=document.txtCommentaires.message.value 
   document.write("<style type=""text/css"">")
   document.write ("body{")
   document.write ("font-family:Arial, Helvetica, sans-serif;")
   document.write ("font-size:13px;")
   document.write ("}")
   document.write (".info, .success, .warning, .error, .validation {")
   document.write ("border: 1px solid;")
   document.write ("margin: 10px 0px;")
   document.write ("padding:15px 10px 15px 50px;")
   document.write ("background-repeat: no-repeat;")
   document.write ("background-position: 10px center;")
   document.write ("}")
   document.write (".success  {")
   document.write ("color: #4F8A10;")
   document.write ("background-color: #DFF2BF;")
   document.write("background-image: url(" &  img  & ")")
   document.write ("}</style>")
   document.write("<div class=""success "">" & x & "</div>")
  end sub  
  </script>
</body>
</html>

Télécharger le projet

Codes Sources

Racine
index

A voir également

Personnalisez vos boîtes de message (x)html
Html array - Conseils pratiques -PHP
Scriptchat x ✓ - Forum VB.NET
Chat gratuit avec webcam et liaison BDD - Forum PHP
X tchat - Forum IRC
Span html - Forum PHP

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Personnalisez vos boîtes de message (x)html

Description

Source / Exemple :

Codes Sources

A voir également

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Du même auteur (medjahedScript)

Jeu de cow boy

Jeu sur excel

Truc pour supprimer le verus autorun.inf

Source / Exemple :

A voir également

Vous n'êtes pas encore membre ? inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Du même auteur (medjahedScript)

Jeu de cow boy

Jeu sur excel

Truc pour supprimer le verus autorun.inf

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !