Aide - Recherche - Membres - Calendrier
Version complète : Mon Code
La Communauté TitaXium > Service Communication > Espace Developpement
evok
boujour tout le monde! :-D

je voulais juste savoir si mon code est pas trop laid?????
et comment je pourrais l'optimiser ou l'améliorer??? whistling.gif

merci :santa:
evok


Citation
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Language" content="fr">
<meta name="Description" content="...">
<meta name="Keywords" content="...">
<title>Mon site perso - Accueil</title>
<link href="css/style.css" rel="stylesheet" type="text/css">
<style type="text/css">
#divScrollTextCont { position: absolute; left: 445px; top: 270px; width: 530px; height: 300px; clip: rect(0px 510px 282px 0px); overflow:hidden; visibility:hidden; font-family:verdana; font-size:10px}
#divText {position:absolute; left:0px; top:0px;}
</style>

<script language="JavaScript">
/********************************************************************************
** 
ScrollText
*  Copyright © 2001 <a href="/dhtmlcentral/thomas_brattli.asp">Thomas Brattli</a>
*  This script was released at DHTMLCentral.com
*  Visit for more great scripts!
*  This may be used and changed freely as long as this msg is intact!
*  We will also appreciate any links you could give us.
*
*  Made by <a href="/dhtmlcentral/thomas_brattli.asp">Thomas Brattli</a>
********************************************************************************
*/

function lib_bwcheck(){ //Browsercheck (needed)
this.ver=navigator.appVersion
this.agent=navigator.userAgent
this.dom=document.getElementById?1:0
this.opera5=this.agent.indexOf("Opera 5")>-1
this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom && !this.opera5)?1:0;
this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom && !this.opera5)?1:0;
this.ie4=(document.all && !this.dom && !this.opera5)?1:0;
this.ie=this.ie4||this.ie5||this.ie6
this.mac=this.agent.indexOf("Mac")>-1
this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0;
this.ns4=(document.layers && !this.dom)?1:0;
this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5)
return this
}
var bw=new lib_bwcheck()


/*****************

You set the width and height of the divs inside the style tag, you only have to
change the divScrollTextCont, Remember to set the clip the same as the width and height.
You can remove the divUp and divDown layers if you want.
This script should also work if you make the divScrollTextCont position:relative.
Then you should be able to place this inside a table or something. Just remember
that Netscape crash very easily with relative positioned divs and tables.

Updated with a fix for error if moving over layer before pageload.

****************/


//If you want it to move faster you can set this lower, it's the timeout:
var speed = 60

//Sets variables to keep track of what's happening
var loop, timer

//Object constructor
function makeObj(obj,nest){
    nest=(!nest) ? "":'document.'+nest+'.'
this.el=bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+'document.'+obj):0;
  this.css=bw.dom?document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+'document.'+obj):0;
this.scrollHeight=bw.ns4?this.css.document.height:this.el.offsetHeight
this.clipHeight=bw.ns4?this.css.clip.height:this.el.offsetHeight
this.up=goUp;this.down=goDown;
this.moveIt=moveIt; this.x=0; this.y=0;
    this.obj = obj + "Object"
    eval(this.obj + "=this")
    return this
}

// A unit of measure that will be added when setting the position of a layer.
var px = bw.ns4||window.opera?"":"px";

function moveIt(x,y){
this.x = x
this.y = y
this.css.left = this.x+px
this.css.top = this.y+px
}

//Makes the object go up
function goDown(move){
if (this.y>-this.scrollHeight+oCont.clipHeight){
  this.moveIt(0,this.y-move)
  if (loop) setTimeout(this.obj+".down("+move+")",speed)
}
}
//Makes the object go down
function goUp(move){
if (this.y<0){
  this.moveIt(0,this.y-move)
  if (loop) setTimeout(this.obj+".up("+move+")",speed)
}
}

//Calls the scrolling functions. Also checks whether the page is loaded or not.
function scroll(speed){
if (scrolltextLoaded){
  loop = true;
  if (speed>0) oScroll.down(speed)
  else oScroll.up(speed)
}
}

//Stops the scrolling (called on mouseout)
function noScroll(){
loop = false
if (timer) clearTimeout(timer)
}
//Makes the object
var scrolltextLoaded = false
function scrolltextInit(){
oCont = new makeObj('divScrollTextCont')
oScroll = new makeObj('divText','divScrollTextCont')
oScroll.moveIt(0,0)
oCont.css.visibility = "visible"
scrolltextLoaded = true
}
//Call the init on page load if the browser is ok...
if (bw.bw) onload = scrolltextInit

/***************
Multiple Scripts
If you have two or more scripts that use the onload event, probably only one will run (the last one).
Here is a solution for starting multiple scripts onload:
  1. Delete or comment out all the onload assignments, onload=initScroll and things like that.
  2. Put the onload assignments in the body tag like in this example, note that they must have braces ().
  Example: <body onload="initScroll(); initTooltips(); initMenu();">
**************/
</script>
<script language="Javascript"><!--
window.defaultStatus="www.evok.com"; //-->
</script>
<script language="JavaScript" src="js/menu.js">
</script>

</head>

<body bgcolor="#EAEAEA" topmargin="50" bottommargin="30">
<div align="center">
<table width="760" border="0" cellpadding="0" cellspacing="1" bgcolor="#666666">
  <tr>
  <td><table width="760" border="0" cellpadding="0" cellspacing="0" bgcolor="FFFFFF">
    <tr>
    <td height="115" align="right" background="images/head2.gif">
    <p style="word-spacing: 0; line-height: 150%; margin: 0" align="center"><img border="0" src="images/header4.gif" width="780" height="115"></td>
    </tr>
    <tr>
    <td height="22" align="center" background="images/haut.gif" class="menu">
    <div align="center">
      <p style="word-spacing: 0; line-height: 150%; margin: 0">...:::
                <script language="JavaScript" src="js/date.js">
</script>
                <script language="JavaScript">
  <!-- Hide the script from non-Javascript browsers
time_of_day();
todays_date();
document.writeln(""+time_statement+" nous sommes le "+document.day+" "+today.getDate()+" "+document.month+". "+date_statement+"")
// -- End Hiding Here -->
</script>
      :::...
    </div>
    </td>
    </tr>
    <tr>
    <td bgcolor="#FFFFFF">
    <p align="center" style="word-spacing: 0; line-height: 150%; margin: 0"><script language="javascript">
<!--hide from old browsers
document.write("vous utilisez <b>" + navigator.appName + "</b>." + navigator.appVersion)
// end script hiding -->
</script>
    <p align="center" style="line-height: 150%; text-indent: 0; word-spacing: 0; margin: 0">vous êtes perdues? regarder <a href="http://">le plan du site</a></p>
    <p align="center" style="line-height: 150%; text-indent: 0; word-spacing: 0; margin: 0">t'aime pas la couleur du site? <a href="../index2.htm">Change la!..</a></p>
    <table width="850" border="0" cellspacing="0" cellpadding="2">
      <tr valign="top">
      <td width="250" align="center"><table width="200" border="0" cellpadding="0" cellspacing="1" bgcolor="#686870">
        <tr>
        <td><table width="200" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
          <tr>
          <td align="center"><table width="200" border="0" cellspacing="0" cellpadding="0">
            <tr>
            <td height="20" align="center" background="images/menu-barre-haut2.gif">
            <p style="word-spacing: 0; line-height: 150%; margin: 0">&curren;<b>Moi</b>&curren;</p>
            </td>
            </tr>
            <tr>
            <td align="left" bgcolor="#EAEAEA" leftmargin="2">
            <p style="line-height: 150%; word-spacing: 0; margin: 0"><img border="0" src="images/puce-fleche.gif" name="i601873" hspace="0" vspace="0" width="10" height="8">
            <a href="#" onmouseover="i601873.src='images/puce-fleche-over.gif'" onmouseout="i601873.src='images/puce-fleche.gif'">P'tite
            présentation</a><br>
            <img border="0" src="images/puce-fleche.gif" name="i601874" hspace="0" vspace="0" width="10" height="8"> <a href="#" onmouseover="i601874.src='images/puce-fleche-over.gif'" onmouseout="i601874.src='images/puce-fleche.gif'">Mon
            CV et mes Études</a></p>
            </td>
            <tr>
            <td height="12" background="images/menu-bas.gif">&nbsp;</td>
            </tr>
          </table></td>
          </tr>
        </table></td>
        </tr>
      </table>
      <p style="word-spacing: 0; line-height: 150%; margin: 0"><br>
      <br>
      <table width="200" border="0" cellpadding="0" cellspacing="1" bgcolor="#686870">
        <tr>
        <td><table width="200" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
          <tr>
          <td align="center"><table width="200" border="0" cellspacing="0" cellpadding="0">
            <tr>
            <td height="20" align="center" background="images/menu-barre-haut.gif">
            <p style="word-spacing: 0; line-height: 150%; margin: 0">&curren;<b>Graphisme</b>&curren;</p>
            </td>
            </tr>
            <tr>
            <td align="left" bgcolor="#EAEAEA">
            <p style="line-height: 150%; word-spacing: 0; margin: 0"><img border="0" src="images/puce-fleche.gif" name="i601875" hspace="0" vspace="0" width="10" height="8">
            <a href="#" onmouseover="i601875.src='images/puce-fleche-over.gif'" onmouseout="i601875.src='images/puce-fleche.gif'">Portfolio</a><br>
            <img border="0" src="images/puce-fleche.gif" name="i601876" hspace="0" vspace="0" width="10" height="8"> <a href="#" onmouseover="i601876.src='images/puce-fleche-over.gif'" onmouseout="i601876.src='images/puce-fleche.gif'">Graphisme
            et Internet</a><br>
            <img border="0" src="images/puce-fleche.gif" name="i601877" hspace="0" vspace="0" width="10" height="8"> <a href="#" onmouseover="i601877.src='images/puce-fleche-over.gif'" onmouseout="i601877.src='images/puce-fleche.gif'">Liens
            utiles</a></td>
            <tr>
            <td height="12" background="images/menu-bas.gif">
            <p style="word-spacing: 0; line-height: 100%; margin: 0">&nbsp;</td>
            </tr>
          </table></td>
          </tr>
        </table></td>
        </tr>
      </table>
      <p style="word-spacing: 0; line-height: 150%; margin: 0"><br>
      <br>
      <table width="200" border="0" cellpadding="0" cellspacing="1" bgcolor="#686870">
        <tr>
        <td><table width="200" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
          <tr>
          <td align="center"><table width="200" border="0" cellspacing="0" cellpadding="0">
            <tr>
            <td height="20" align="center" background="images/menu-barre-haut.gif">
            <p style="word-spacing: 0; line-height: 150%; margin: 0">&curren;<b>Contacts</b>&curren;</p>
            </td>
            </tr>
            <tr>
            <td>
            <div id="divScrollTextCont">
            <div id="divText" style="width: 500; height: 450">
            <b><a name="haut">BIENVENUE SUR MON SITE PERSO</a></b><br>
            PRÉFACE<br>
             
            - FIN -</font><br>
            </div>
          </div>
          </td>
            </tr>
            <tr>
            <td align="left" bgcolor="#EAEAEA">
            <p style="line-height: 150%; word-spacing: 0; margin: 0"><img border="0" src="images/puce-fleche.gif" name="i601878" hspace="0" vspace="0" width="10" height="8">
            <a href="#" onmouseover="i601878.src='images/puce-fleche-over.gif'" onmouseout="i601878.src='images/puce-fleche.gif'">E-mail</a><br>
            <img border="0" src="images/puce-fleche.gif" name="i601879" hspace="0" vspace="0" width="10" height="8"> <a href="#" onmouseover="i601879.src='images/puce-fleche-over.gif'" onmouseout="i601879.src='images/puce-fleche.gif'">Livre
            d'Or</a><br>
            <img border="0" src="images/puce-fleche.gif" name="i601880" hspace="0" vspace="0" width="10" height="8"> <a href="#" onmouseover="i601880.src='images/puce-fleche-over.gif'" onmouseout="i601880.src='images/puce-fleche.gif'">Remarques</a></p>
            </td>
            <tr>
            <td height="12" background="images/menu-bas.gif">
            <p style="word-spacing: 0; line-height: 100%; margin: 0">&nbsp;</td>
            </tr>
          </table></td>
          </tr>
        </table></td>
        </tr>
      </table>
      <p style="word-spacing: 0; line-height: 150%; margin: 0"><br>
      <div align="center">
        <center>
        <table border="0" cellspacing="1" bgcolor="#686870" width="31">
        <tr>
          <td bgcolor="#EAEAEA" height="7" width"88" width="92">
          <p style="word-spacing: 0; line-height: 150%; margin: 0">titaxtium</p>
          </td>
        </tr>
        <tr>
          <td bgcolor="#EAEAEA" height="1" width"80" width="92"><a href="http://www.speedy-diz.com" target="_blank"><img border="0" src="images/speeddiz88.gif" width="88" height="31"></a></td>
        </tr>
        <tr>
          <td bgcolor="#EAEAEA" height="1" width"80" width="92">
          <p style="word-spacing: 0; line-height: 150%; margin: 0">EJS</p>
          </td>
        </tr>
        </table>
        </center>
      </div>
      <p style="word-spacing: 0; line-height: 150%; margin: 0"><br>
      </p>
      </td>
      <td width="630" align="center"><table width="600" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#686870">
        <tr>
        <td><table width="600" border="0" cellpadding="0" cellspacing="0" bgcolor="#eaeaea">
          <tr>
          <td height="20" align="center" background="images/menu-haut.gif" class="titre">
          <p style="word-spacing: 0; line-height: 150%; margin: 0">&curren;~&curren; <b>Accueil </b>&curren;~&curren;</p>
          </td>
          </tr>
          <tr>         
          <td><table align="center" width="550" height="300" bgcolor="#686870" border="0" cellspacing="0" cellpadding="0">
            <tr>
            <td width="38" bgcolor="#EAEAEA"><br>
            <a href"#" onmouseover="scroll(-2); i601881.src='images/flechescrollup2-over.gif'" onmouseout="noScroll(); i601881.src='images/flechescrollup2.gif'" onclick="return false"><img id="divUp" src="images/flechescrollup2.gif" border="0" name="i601881" hspace="0" vspace="0" width="12" height="12"></a><br>
            <br>
            <br>
            <a href"#" onmouseover="scroll(2); i601882.src='images/flechescrolldown2-over.gif'" onmouseout="noScroll(); i601882.src='images/flechescrolldown2.gif'" onclick="return false"><img id="divDown" src="images/flechescrolldown2.gif" border="0" name="i601882" hspace="0" vspace="0" width="12" height="12"></a><br>
            <td bgcolor="#EAEAEA">&nbsp;
            </tr>
          </table></td>
          </tr>
          <tr>
          <td height="12" background="images/menu-bas.gif">
          <p style="word-spacing: 0; line-height: 100%; margin: 0">&nbsp;</td>
          </tr>
        </table>
        </tr>
      </table>
      <div align="center">
        <center>
        <table border="0" cellspacing="1" width="100">
        <tr>
          <td align="center">
          <p style="word-spacing: 0; line-height: 150%; margin: 0">merci</p>
          <p style="word-spacing: 0; line-height: 150%; margin: 0">&nbsp;</p>
          <p style="word-spacing: 0; line-height: 150%; margin: 0">Xiti</p>
          </td>
        </tr>
        </table>
        </center>
      </div>
      </td>
      </tr>
    </table></td>
    </tr>
    <tr>
    <td height="20" align="center" valign="middle" background="images/bas.gif">
    <p style="word-spacing: 0; line-height: 150%; margin: 0"><b>Copyright © 2004 - NomDeVotreSite - Tous droits réservés.</b></p>
    </td>
    </tr>
  </table></td>
  </tr>
</table>
</div>
</body>
[HaCkEr][ShOw][06]
Le script est de toi ?
Xtouch
Salut,
je sais pas si c'est un problème de copier coller ou pas, mais déjà manque la balise </html> tout à la fin.

Ensuite, bon, c'est quand même assez conséquent comme code, mais bon.

Pour optimiser, déjà enlève les commentaires du code, les personnes naviguant sur ton site n'ont pas besoin de les avoir (toi tu peux garder une version avec commentaire si tu préfère)

Ensuite tu es sûr que tu as besoin de tout ce javascript ?
Pense que certaines personnes peuvent ne pas l'avoir ^_^

Sinon c'est un tableau classique, long mais classique.
J'imagine qu'il est impossible de rempalcer ton tableau par des div ?
Ce serait pas mal, ça allège le code souvent.
[HaCkEr][ShOw][06]
C'est exactement ça tongue.gif

Ton code sans tableau ( mais avec des CSS ), et sans les commentaires ( qui ne sont sans doute pas de toi non ? ) il ne fera plus que 15 lignes laugh.gif
evok
Citation
Le script est de toi ?

non le script n'est pas de moi.... je l'ai trouvé sur un kitgrafik whistling.gif

Citation
je sais pas si c'est un problème de copier coller ou pas, mais déjà manque la balise </html> tout à la fin.

la balise</html> à la fin c'est un copier/coller à l'arrache... :innocent:

Citation
Sinon c'est un tableau classique, long mais classique.
J'imagine qu'il est impossible de rempalcer ton tableau par des div ?
Ce serait pas mal, ça allège le code souvent.

Citation
C'est exactement ça . Ton code sans tableau ( mais avec des CSS ), et sans les commentaires ( qui ne sont sans doute pas de toi non ? ) il ne fera plus que 15 lignes


je voudrait bien mais étant un pur débutant en codage, je na sais pas comment on fait???

vous auriez pas un petit exemple pour moi?

evok.
Mandos
Je ne pense pas que de coder le site sans tableau mais avec de la css soit forcément la meilleur solution, surtout que si le code est aussi long, c que le design doit être assez compliqué à découpé (ou le découpeur est nul tongue.gif ).
Plutôt que de faire plein de <table> (yen a au moins 20), fait un seul tableau avec des colspan ou autres.
Xtouch
Faudrait voir la page que ça donne en fait.
Ca nous permettrais de te conseiller la meilleur solution smile.gif

Selon la tête du design, on pourra t'aider.
[HaCkEr][ShOw][06]
Et puis au pire refaire une découpe ... tongue.gif
evok
le design de mon site et pas extraordinaire.
les bors de tableaux et les espaces entre les cellules font partie intégrante de mon design... donc enlevé certaines balises <table> changerait le design

ps: comment on fait pour intégrer une image dans un message???
[HaCkEr][ShOw][06]
Pour mettre une image dans ton message, va sur
http://www.imageshack.us ( par exemple ), tu héberge ton image, et ensuite le site va te donner un code qui devrait ressembler à ça --->
Code
[IMG]http://img47.exs.cx/img47/6392/avat_dig.jpg[/IMG]


Tu met ce code dans ton message, et on aura l'image, mais le mieux, vu que je suppose que l'image est grande est de mettre -->
Code
[URL=http://l'adresse_de_ton_image]LE LIEN[/URL]


Voili smartass.gif
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'informations, la mise en page et les images, veuillez cliquer ici.
Invision Power Board © 2001-2010 Invision Power Services, Inc.