Sujets similaires

Bonjour bonjour. Je me baladais sur le net et je suis tomber sur ce forum:
Ici

J'espère que la question n'a pas déjà été posé quelque part, si c'est le cas,n veuillez m'excuser, mais j'aimerai savoir comment faire pour avoir un menu comme celui du forum que j'ai indiqué. Quand je parle du menu, je fais référence à cleui qui se trouve tout en haut de la Pa, avec le règlement, le contexte et tout ça. J'ai tenté de bidouillé comme j'ai pu, mais je n'arrive pas à le refaire, pourriez vous m'aider?

Ma dernière question... Comment fait-on pour faire un effet de fondu comme sur les images du staff? J'ai trouvé le code, mais quand je le met il agit sur toute mon image de fond de Pa. Est-ce que ça ne marche que sur des petites images comme celles ci, ou bien peut-on le faire sur des images 'posées' sur l'image de fond d'une PA?
Je sais si c'est très clair tout ça drunken

En tout cas, je vous remercie d'avance pour votre aide I love you

Bonsoir ^^ Pour ta première réponse, il s'agit d'un script ^^

Tu le trouveras ici expliqué en anglais: http://www.dynamicdrive.com/dynamicindex17/haccordion.htm Si tu as du mal, je pourrais t'expliquer comment on l'installe ^^ (Sur le forum, ils ont rajouté ce script pour que ça devienne plus ou moins clair ^^ http://www.dynamicdrive.com/dynamicindex11/gradualfader.htm )

Pour ta second question, donne une class à ton image ^^ Exemple:

Code:: <img src='image.png" class="Fondu" />

Ensuite, tu mets ton code là:

Code:: .fondu
{
CODE;
}

Voilà, j'espère que c'est assez clair ^^ L'effet ira seulement sur les images avec la class Fondu^^

Merci beauccoup pour ta réponse <3 Calins

En revanche, je ne vois pas l'exemple que tu as mis pour les images Embarassed

Brefounette, merci encore pour cette réponse si rapide <3

Voilà, j'avais rippé sur une balise XD (oui, je les tape toute à la main, la flemme de cliquer >o<)

L'exemple est de nouveau visible =)

Micchi beaucoup pour ton aide ^^

Tout marche sur des roulettes? =D

Euh.. non pas vraiment -__-'
J'ai un peu de mal avec le premier truc.. En fait je me demande si je pourrai arriver à le faire comme je le veux sur ma Pa silent

Je l'ai fait en 5 minutes en reprenant le code du forum que tu m'as montré^^

Il faut que tu télécharge le fichier .js et ensuite tu l'héberge pour aller dans les templates (tu vas dans la section "général" des template). Tu choisis "overhall_header_new" et tu descends jusqu'à la balise

Code:: </head>

C'est plus simple je trouve et juste au dessus, tu mets:

Code:: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="URL_script">

Tu valide et tu n'oublie pas de publier le template^^

Tu mets ensuite ce code dans tes CSS:

Code:: .haccordion{
padding: 0;
width: 800px;
}

.haccordion ul{
margin: 0;
padding: 0;
list-style: none;
overflow: hidden; /*leave as is*/
}

.haccordion li{
margin: 0;
padding: 0;
display: block; /*leave as is*/
width: 100%; /*For users with JS disabled: Width of each content*/
height: 50px; /*For users with JS disabled: Height of each content*/
overflow: hidden; /*leave as is*/
float: left; /*leave as is*/
}

/*CSS for example Accordion #hc1*/

#hc1 li{
margin:0 0px 0 0; /*Spacing between each LI container*/
width: 800px;
}

#hc1 li .hpanel{
padding: 0px; /*Padding inside each content*/
background: transparent;
}

.haccordion li .hpanel{
width: 100%; /*For users with JS disabled: Width of each content*/
height: 50px; /*For users with JS disabled: Height of each content*/
}

Et voilà le code à mettre dans ta page d'accueil, par exemple:

Code:: <script type="text/javascript">haccordion.setup({
accordionid: 'hc1', //main accordion div id
paneldimensions: {peekw:'118px', fullw:'210px', h:'50px'},
selectedli: [0, true], //[selectedli_index, persiststate_bool]
collapsecurrent: false //<- No comma following very last setting!
})</script><div id="hc1" class="haccordion"><ul>

<li><div class="hpanel">CONTENU 1</div></li>
<li><div class="hpanel">CONTENU 2</div></li>
<li><div class="hpanel">CONTENU 3</div></li>
<li><div class="hpanel">CONTENU 4</div></li>
<li><div class="hpanel">CONTENU 5</div></li>
<li><div class="hpanel">CONTENU 6</div></li></ul>

Voilà, est ce clair? ^^ Si ça marche pas, dis le moi ^^

J'ai tout fait comme tu m'as indiqué, mais ça ne fonctionne pas. Ca m'a élargit mon forum au maximum. J'ai bien l'effet que je voulais sur le texte 'contenu', mais par contre je n'ai plus le header et ma barre de navigation est partie en haut à gauche, et certains boutons sont partis Oo
Comment ça se fait? Shocked

Le script, tu l'as bien mis entre

Code:: <head>...</head>

?

Parce que j'ai testé et ça marche du tonnerre moi 'o'

Je l'ai bien mis entre les deux balises, mais ça me fait toujours la même chose.. je suis maudite je pense.
Je crois qu'il vaut que je laisse tomber, je sens que je vais galérer pour arriver à le mettre où je veux sur ma PA et j'ai pas envie de t'embêter pendant des jours Embarassed

Brefounette, merci pour ton aide en tout cas Calins

Tu ne me dérange pas, ne t'en fais pas ^^ Je suis là pour ça et les défis ne me font pas peur ^^ Je vais retester tout ça pour voir XD

Oh! J'y pense 'o' Tu as déjà quelque chose dans ce template? 'o'

Merci c'est gentil Embarassed

Ah si.. J'avais mis quelque chose pour faire un espace entre la barre de navigation et la pub sous le header Oo Mais il me semble pas que ce soit vraiment gênant

Enlève ce que tu as rajouté et mets ça pour l'espace en question:

Code:: #page-body { padding-top: 20px; /* Espace entre la barre et les pubs */
}

et réessaye^^

C'est pas ça le problème (à mon avis) pasque ça me fait la même chose que elle et le overall header new doit être un des seuls templates que j'ai pas touché. =/

Ah mince... Bon reprenons ce que j'ai fait >o<

Et désolée de m'être emmêler les pinceaux '^^

Quand je disais que j'embêtais hein, t'excuses pas pour ça, c'est un peu normal de plus s'y retrouver avec tout ce que je demande et tout ce qui va pas Embarassed

Simple curiosité.. est-ce qu'on peut mettre cet 'effet' sur des images qui seraient ensuite intégrées à une image de fond de page d'accueil? Ou alors il faut que ce soit mis tout seul avant l'image de fond? Shocked

Je comprends pas du tout pourquoi ça marche pas, ça marche sur mon forum test O_O Tu peux me donner ton code Overall_header_new? 'o' Pour voir s'il n'y a pas un truc bizarre dedans ^^

Et je n'ai pas trop compris ta question 'o'

Vouip, le voilà:

Spoiler:

Code:: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}" xml:lang="{L_LANG_HTML}" xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

<title>{SITENAME_TITLE}{PAGE_TITLE}</title>
<meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-style-type" content="text/css" />
{META_FAVICO}
{META}
<meta name="title" content="{SITENAME_TITLE}{PAGE_TITLE}" />
{T_HEAD_STYLESHEET}
{CSS}
<link rel="search" type="application/opensearchdescription+xml" href="/improvedsearch.xml" title="{SITENAME}" />
<link rel="search" type="application/opensearchdescription+xml" href="{URL_BOARD_DIRECTORY}/search/improvedsearch.xml" title="{SEARCH_FORUMS}" />
<script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script>

<script src="{JS_DIR}jquery/ticker/ticker.js" type="text/javascript"></script>
<link type="text/css" rel="stylesheet" href="{JS_DIR}jquery/ticker/ticker.css" />

<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){
   
      pm = window.open('{U_PRIVATEMSGS_POPUP}', '_faprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');
      pm.focus();
   
   
      report = window.open('{switch_report_popup.U_REPORT_POPUP}', '_phpbbreport', 'HEIGHT={switch_report_popup.S_HEIGHT},resizable=yes,scrollbars=no,WIDTH={switch_report_popup.S_WIDTH}');
      report.focus();
   
   
      ticker_start({switch_ticker.HEIGHT}, {switch_ticker.SPACING}, {switch_ticker.SPEED}, '{switch_ticker.DIRECTION}', {switch_ticker.STOP_TIME});
   
});


   var logInPopUpLeft, logInPopUpTop, logInPopUpWidth = {LOGIN_POPUP_WIDTH}, logInPopUpHeight = {LOGIN_POPUP_HEIGHT}, logInBackgroundResize = false, logInBackgroundClass = false;

//]]>
</script>
{GREETING_POPUP}

<style type="text/css">
#hitskin_preview {
   margin: 0; padding: 0;
   position: fixed;
   top: 0; left: 0;
   width: 100%;
   height: 65px;
   background: url('http://2img.net/i/fa/hitskin/hitskin_bar.png') repeat-x left -15px;
   color: #fff;
}
* html #hitskin_preview { /* Fix for IE6 since it doesn't implement fixed positionning */
   position: absolute;
   top:expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop : document.body.scrollTop);
   z-index: 2;
   background: transparent url('http://2img.net/i/fa/hitskin/hitskin_bar-ie6.gif') repeat-x left -15px;
}
* html { /* Gunlaug's Speed fix for the above positionning fix. Sorry for the fix for the fix */
background: #fff url(foo) fixed;
}
#hitskin_preview h1 {
   float: left;
   margin: 3px 0 0 0;
   padding: 0 0 0 10px;
   font: italic normal 25px Arial,sans serif;
   color: #fff;
}
#hitskin_preview h1 img {
   vertical-align: middle;
}
#hitskin_preview em {
   color: #7CBA2C;
   font-weight: bold;
}
#hitskin_preview a {
color: #fff;
}
#hitskin_preview a:hover {
text-decoration: underline;
}

#hitskin_preview .content {
   text-align: right;
}
#hitskin_preview .content p {
   margin: 4px 1em 0px 1em;
   font-size: 13px;
   line-height: 1.8em;
   color: #fff;
   font-weight: bold;
}
#hitskin_preview .content p span {
   font-weight: normal;
   font-size: 0.8em;
}
body {
   margin-top: 40px !important;
}
{hitskin_preview.HITSKIN_RTL_CSS}
</style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://www.dynamicdrive.com/dynamicindex17/haccordion.jst">
</head>
<body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">

<div id="hitskin_preview" style="display: block;">
   <h1><img src="http://2img.net/i/fa/hitskin/hitskin_logo.png" alt="" /> Hit<em>skin</em>.com</h1>
   <div class="content">
      <p>
         {hitskin_preview.L_THEME_SITE_PREVIEW}
         <br />
         <span>{hitskin_preview.U_INSTALL_THEME}<a href="http://{hitskin_preview.U_RETURN_THEME}">{hitskin_preview.L_RETURN_THEME}</a></span>
      </p>
   </div>
</div>



<div id="login_popup">
   <table class="forumline" width="{LOGIN_POPUP_WIDTH}" height="{LOGIN_POPUP_HEIGHT}" border="0" cellspacing="1" cellpadding="0">
      <tr height="25">
         <td class="catLeft">
            <span class="genmed module-title">{SITENAME}</span>
         </td>
      </tr>
      <tr height="{LOGIN_POPUP_MSG_HEIGHT}">
         <td class="row1" align="left" valign="top">
            <div id="login_popup_buttons">
               <form action="{S_LOGIN_ACTION}" method="get">
                  <input type="submit" class="mainoption" value="{L_LOGIN}" />
                  <input type="button" class="mainoption" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';" />
                  <input id="login_popup_close" type="button" class="button" value="{L_DONT_DISPLAY_AGAIN}" />
               </form>
            </div>
            <span class="genmed">{LOGIN_POPUP_MSG}</span>
         </td>
      </tr>
   </table>
</div>


<a name="top"></a>
{JAVAscript}
<table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="0" cellpadding="10" border="0" align="center">
   <tr>
      <td class="bodyline">
         <table width="100%" cellspacing="0" cellpadding="0" border="0">
            <tr>
               
               <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
               <td align="center" width="100%" valign="middle">
                  <div class="maintitle">{MAIN_SITENAME}</div>
                  <br />
                  <span class="gen">{SITE_DEscriptION}<br /> </span>
               </td>
               

               
               <td align="center" width="100%" valign="middle">
                  <a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a><br />
                  <div class="maintitle">{MAIN_SITENAME}</div>
                  <br />
                  <span class="gen">{SITE_DEscriptION}</span>
               </td>
               

               
               <td align="center" width="100%" valign="middle">
                  <div class="maintitle">{MAIN_SITENAME}</div>
                  <br />
                  <span class="gen">{SITE_DEscriptION}<br />  </span>
               </td>
               <td>
                  <a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a>
               </td>
               
            </tr>
         </table>

         <table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
            <tr>
               <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
            </tr>
         </table>

         <div style="clear: both;"></div>

         
         <div id="fa_ticker_block" style="margin-top:4px;margin-bottom:4px;">
            <table width="100%" border="0" cellspacing="0" cellpadding="0" class="forumline">
               <tr>
                  <td {CLASS_TABLE_TYPE} align="left" class="row1">
                     <div id="fa_ticker_container">
                        <div id="fa_ticker" style="height:{switch_ticker.HEIGHT}px;">
                           <div class="fa_ticker_content">
                              
                              <div>{switch_ticker.ticker_row.ELEMENT}</div>
                              
                           </div>
                        </div>
                     </div>
                  </td>
               </tr>
            </table>
         </div>
         

         <div id="page-body">
            <div id="{ID_CONTENT_CONTAINER}"{CLASS_CONTENT_CONTAINER}>
               <table cellpadding="0" cellspacing="0" width="100%" class="three-col">
                  <tbody>
                     <tr>
                        <td valign="top" width="{C1SIZE}">
                           <div id="{ID_LEFT}">
                              
                              {giefmod_index1.MODVAR}
                                 
                                 <div style="height:{SPACE_ROW}px"></div>
                                 
                              
                           </div>
                        </td>
                        <td valign="top" width="100%">

                        </td>
                     </tr>
                  </tbody>
               </table>
            </div>
         </div>
      </td>
   </tr>
</table>
</body>
</html>

Euh comment dire. Ma Pa est faite d'une image de fond, et j'aimerai mettre d'autres images sur ce fond. Je me demandai s'il était possible de faire pareil avec ce style de 'menu', de le mettre sur une image de fond. Je sais pas si c'est plus clair là Oo

Mais comment j'ai fait pour faire une erreur pareille...

Il manque la balise de fin pour refermer le 2nd script...

Code:: </script>

il faut le rajouter et ton lien de script, se termine en .jst au lieu de .js ^^ Essaye de l'héberger avec un autre hébergeur ou regarde s'il n'y a pas une erreur ^^

Et honnêtement, je sais pas pour ta question... Comme il s'agit d'un script, je suppose que c'est ok si tu rajoute des images par dessus une image de fond 'o'

Roooh c'est niquel. Mercii beaucoup beaucoup pour ton aide <3 Calins

Je vais paraitre bête mais euh ... Il est où le fichier à télécharger ? ._.

Ravie que ça marche =D

Basil > Il se trouve dans ce lien ^^ http://www.dynamicdrive.com/dynamicindex17/haccordion.htm quand tu vas à Step 1, quand tu descends, tu arrive à "1.haccordion.js (one variable near the top inside this file you should customize)" Il s'agit du fichier à télécharger ^^

C'est ce que j'ai fais mais euh ... Ça ne me le fait pas télécharger, ça m'affiche juste le code dans une nouvelle fenêtre. confused

Il faut que tu copies l'adresse qui s'affiche dans la barre d'adresse, et tu la colles dans le script qu'à donner Enko ^^

Par contre j'ai réussit à mettre mes images et tout, tout fonctionnait très bien hier soir et là je reviens sur mon fo' test et les images sont bien alignées Oo comment ça se fait? Sous le choc

Tout à l'air bon en plus, je comprend pas trop pourquoi tout s'est décalé comme ça.
Je vais embêter encore un peu je crois, mais je me demande un autre truc... Je voulais mettre des images sur celle de fond que j'ai mis dans ma PA, le truc c'est que je ne me souvient plus comment on fait >< Pourriez-vous m'aider là aussi? Ange

Après j'arrête avec mes questions promis ^^

Petites questions

Petites questions

Sujets similaires

Sujets similaires

Partenaires Or