HFR : Onglets, comment c'est fait?

HFR : Onglets, comment c'est fait? - HTML/CSS - Programmation

Marsh Posté le 30-05-2005 à 13:47:40    

Salut,
 
comment sont fais les onglets HFR?
 
Ce n'est pas une simple image de dégradé comme PhpWebGallery, puisque là celà respecte les couleurs persos.
 
Merci pour la piste ;)


---------------
ma vie, ma carrière! - Un trait d’union entre des photos et des mots.
Reply

Marsh Posté le 30-05-2005 à 13:47:40   

Reply

Marsh Posté le 30-05-2005 à 14:05:15    

http://forum.hardware.fr/message.p [...] &dest=joce


---------------
J'ai un string dans l'array (Paris Hilton)
Reply

Marsh Posté le 30-05-2005 à 14:09:05    

AGA a écrit :

Salut,
 
comment sont fais les onglets HFR?
 
Ce n'est pas une simple image de dégradé comme PhpWebGallery, puisque là celà respecte les couleurs persos.
 
Merci pour la piste ;)


 
Lis le code de la page? :??:


---------------
Can't buy what I want because it's free -
Reply

Marsh Posté le 30-05-2005 à 14:14:25    

Ben ouais, suffit de voir le code source [:johneh] (y'a de ces questions parfois :D )

Reply

Marsh Posté le 30-05-2005 à 15:07:10    

mouais.
 
Sans les CSS je fais rien, et moi j'y arrive pas à charger les CSS.
 
J'ai pas votre niveau non plus...
 
Merci qd même d'avoir lu...


---------------
ma vie, ma carrière! - Un trait d’union entre des photos et des mots.
Reply

Marsh Posté le 30-05-2005 à 15:09:34    

AGA a écrit :

mouais.
 
Sans les CSS je fais rien, et moi j'y arrive pas à charger les CSS.
 
J'ai pas votre niveau non plus...
 
Merci qd même d'avoir lu...


 

Citation :


<link rel="stylesheet" href="/include/the_style1.php?color_key=%23FFFFFF-%23DEDFDF-%23000080-%23C2C3F4-%23336699-%23FFFFFF-%23FFFFFF-%23000000-%23000080-%23000000-%23000080-%23F7F7F7-%23DEDFDF-%23C0C0C0-%23C0C0C0-%23FFFFFF-%23000000-%23000000-%230000FF-0-http:||forum-images.hardware.fr" />
<link rel="stylesheet" href="/themes/css_forum/1/style.php?color_key=%23FFFFFF-%23DEDFDF-%23000080-%23C2C3F4-%23336699-%23FFFFFF-%23FFFFFF-%23000000-%23000080-%23000000-%23000080-%23F7F7F7-%23DEDFDF-%23C0C0C0-%23C0C0C0-%23FFFFFF-%23000000-%23000000-%230000FF-0-http:||forum-images.hardware.fr" />
<link rel="stylesheet" href="/include/the_style.css" />


 
http://forum.hardware.fr/include/t [...] ardware.fr
http://forum.hardware.fr/themes/cs [...] ardware.fr
http://forum.hardware.fr/include/the_style.css


Message édité par skeye le 30-05-2005 à 15:10:08

---------------
Can't buy what I want because it's free -
Reply

Marsh Posté le 30-05-2005 à 15:17:16    

Merci.
Dans le code source je n'avais pas les style1.php, à cause de l'url rewriting je suppose.
 
merci de ton aide. :)


---------------
ma vie, ma carrière! - Un trait d’union entre des photos et des mots.
Reply

Marsh Posté le 30-05-2005 à 15:50:53    

J'ai ça, mais c'est pas encore parfait :/

Code :
  1. <html>
  2. <head>
  3. <style type="text/css">
  4. <!--
  5. img
  6. {
  7. border: 0px;
  8. margin: 0px;
  9. }
  10. .cadreonglet
  11. {
  12. float: left;
  13. }
  14. .beforonglet, .afteronglet,  .beforongletsel,  .afterongletsel
  15. {
  16. float: left;
  17. height: 18px;
  18. width: 4px;
  19. font-size:0px;
  20. padding: 0px;
  21. }
  23. .onglet
  24. {
  25. background-color: #336699;
  26. background-image: url(http://forum-images.hardware.fr/themes_static/temp/1-19-185-202-219-51-102-153.png);
  27. background-repeat:repeat-x;
  28. }
  30. .ongletsel, .ongletonmouseover
  31. {
  32. background-color: #DEDFDF;
  33. background-image: url(http://forum-images.hardware.fr/themes_static/temp/1-19-242-242-242-222-223-223.png);
  34. background-repeat:repeat-x;
  35. }
  37. .beforonglet
  38. {
  39. background-color: #336699;
  40. background-image: url(http://forum-images.hardware.fr/themes_static/temp/3-19-255-255-255-51-102-153.png);
  41. background-repeat:no-repeat;
  42. }
  44. .afteronglet
  45. {
  46. background-color: #336699;
  47. background-image: url(http://forum-images.hardware.fr/themes_static/temp/4-19-255-255-255-51-102-153.png);
  48. background-repeat:no-repeat;
  49. }
  51. .beforongletsel
  52. {
  53. background-color: #DEDFDF;
  54. background-image: url(http://forum-images.hardware.fr/themes_static/temp/3-19-255-255-255-222-223-223.png);
  55. background-repeat:no-repeat;
  56. }
  58. .afterongletsel
  59. {
  60. background-color: #DEDFDF;
  61. background-image: url(http://forum-images.hardware.fr/themes_static/temp/4-19-255-255-255-222-223-223.png);
  62. background-repeat:no-repeat;
  63. }
  64. -->
  65. </style>
  66. </head>
  67. <body>
  68. <table class="none" style="border:0px" cellspacing="0" cellpadding="0">
  69. <tr><td style="vertical-align:bottom">
  70.  <div class="cadreonglet">
  71.      <div class="beforonglet" id="befor1">&nbsp;</div>
  72.   <a href="/forum2.php?config=hardwarefr.inc&amp;cat=10&amp;subcat=0&amp;page=1&amp;post=71136" class="onglet" id="onglet1" onmouseover="select_onglet(1)" onmouseout="unselect_onglet(1)" title="Liste générale">
  73.    <img src="http://forum-images.hardware.fr/themes_static/images/old style/global.gif" title="Liste générale" alt="All" />
  74.   </a>
  75.   <div class="afteronglet" id="after1">&nbsp;</div><div class="beforongletsel">&nbsp;</div>
  76.   <div class="ongletsel" title="Sujet où j'ai participé">
  77.    <img src="http://forum-images.hardware.fr/themes_static/images/old style/multipleflag1.gif" title="Sujet où j'ai participé" alt="" />
  78.   </div>
  79.   <div class="afterongletsel">
  80.    &nbsp;
  81.   </div>
  82.  </div>
  83. </td></tr>
  84. </table>
  85. </body>
  86. </html>


Message édité par AGA le 30-05-2005 à 15:51:14

---------------
ma vie, ma carrière! - Un trait d’union entre des photos et des mots.
Reply

Marsh Posté le 30-05-2005 à 20:15:59    

Harkonnen a écrit :

http://forum.hardware.fr/message.p [...] &dest=joce


 
Nan mais celui la  :sarcastic: Toujours pret à faire chier les webdev  :whistle:


---------------
Si la vérité est découverte par quelqu'un d'autre,elle perd toujours un peu d'attrait
Reply

Marsh Posté le 31-05-2005 à 11:01:01    

Bref,  
le truc intéressant c'est ça : http://forum-images.hardware.fr/th [...] 23-223.png
 
Comment on fait pour générer ça?
 
Merci.


---------------
ma vie, ma carrière! - Un trait d’union entre des photos et des mots.
Reply

Marsh Posté le 31-05-2005 à 11:01:01   

Reply

Marsh Posté le 31-05-2005 à 11:40:09    

Heu ... sois tu le fait avec photoshop ... soit avec la lib GD :D


---------------
Si la vérité est découverte par quelqu'un d'autre,elle perd toujours un peu d'attrait
Reply

Marsh Posté le 31-05-2005 à 13:32:04    

Ok, avec GD si on veut du dynamique.
 
Merci.


---------------
ma vie, ma carrière! - Un trait d’union entre des photos et des mots.
Reply

Marsh Posté le 31-05-2005 à 14:28:42    

C'est un peu utiliser des gros gros moyens pour un petit truc mais ça peut etre amusant si tu fais quelques add-ons. Par exemple je me rappelle que sur mon ancien forum (flashy inside) j'avais fait mes menus avec GD et que la couleur du forum changeait graduellement selon l'heure (rouge le matin - jaune clair a midi - rouge le soir - bleu la nuit) et ça ... merci GD :D


---------------
Si la vérité est découverte par quelqu'un d'autre,elle perd toujours un peu d'attrait
Reply

Marsh Posté le 07-06-2005 à 10:51:23    

esox_ch a écrit :

C'est un peu utiliser des gros gros moyens pour un petit truc mais ça peut etre amusant si tu fais quelques add-ons. Par exemple je me rappelle que sur mon ancien forum (flashy inside) j'avais fait mes menus avec GD et que la couleur du forum changeait graduellement selon l'heure (rouge le matin - jaune clair a midi - rouge le soir - bleu la nuit) et ça ... merci GD :D


J'ai noté ça sur mon bloc-note pompe-idées :D

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed