Onglet dans la PA Bouton_activeOnglet dans la PA Bouton_hoverOnglet dans la PA Fb-hoverOnglet dans la PA Fb-active
CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur:

Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus!

Derniers sujets
» Système d'onglets simple et personnalisable
Onglet dans la PA EmptyLun 03 Juin 2024, 17:20 par birds

» Fiche de Présentation RPG
Onglet dans la PA EmptySam 30 Mar 2024, 22:07 par Peyton972

» [RPG] Fiche personnage avec bannière
Onglet dans la PA EmptySam 30 Mar 2024, 22:06 par Peyton972

» Structure de Qui Est En Ligne (1)
Onglet dans la PA EmptyLun 04 Mar 2024, 23:20 par Peyton972

» Qui Est En Ligne - Utopia
Onglet dans la PA EmptyDim 24 Déc 2023, 18:16 par romee

» Pack forum complet "Androïd Sylver" RPU (N°2)
Onglet dans la PA EmptyJeu 02 Nov 2023, 06:42 par Hydrar

» Formulaire de connexion rapide amélioré
Onglet dans la PA EmptySam 04 Mar 2023, 18:57 par Krager

» Avatar centré dans le profil
Onglet dans la PA EmptySam 11 Fév 2023, 06:04 par Krager

-19%
Le deal à ne pas rater :
PC portable MSI Gaming Pulse 16” -Ultra7 155H -16Go/512 Go
1299 € 1599 €
Voir le deal

Partagez
 

Onglet dans la PA

Voir le sujet précédent Voir le sujet suivant Aller en bas 
Umbre
Umbre
{ Membre }
{ Membre }

Féminin Messages : 21



Onglet dans la PA Empty
Bonjour ou bonsoir à tous ceux qui liront ce message.

Mon problème concerne ce forum qui est en cours de création : behindthemirror.fr-bb.com

Je suis arrivé dans le projet en cours de route. Une partie du travail de codage avait été fait y compris la PA. Les codes de la PA qui coincent ne sont pas de moi donc je ne saurais pas dire pourquoi ça ne marche ( vu que j'ai du mal à comprendre comment ça marche à la base ).

Il y a quelques temps les onglets de la PA fonctionnaient à merveille mais depuis peu plus rien. La PA reste bloqué sur la première page.

Je vous mets le code de la PA :

Code:
<table align="center">
<tbody>
<tr>
<td><div class="onglets" onmouseover="javascript:shownavigation()">Index</div></td>
<td><div class="onglets" onmouseover="javascript:showpostesvacants()">Sabliers</div></td>
<td><div class="onglets" onmouseover="javascript:showmeteo()">News</div></td>
<td><div class="onglets" onmouseover="javascript:shownouveautes()">Du Mois</div></td>
<td><div onmouseover="javascript:showstaff()"></div></td></tr></tbody></table>
<table align="center">
<tbody>
<tr>
<td valign="center" width="70%" align="center"><!-- Contenu "Onglet Navigation" --><div id="navigation"><div class="contenu">
<table align="center">
<tbody>
<tr>
<td>
<table>
<tbody>
<tr>
<td class="fondpa1" height="72" width="500">
<center><a class="lienmenu" href="http://behindthemirror.fr-bb.com/t8-le-reglement">règlement</a> <a class="lienmenu" href="http://vardaprotectsirius.virtuaboard.com/panneau-d-affichages-f1/histoire-mise-en-situation-t1267.htm">histoire</a> <a class="lienmenu" href="http://vardaprotectsirius.virtuaboard.com/intrigues-et-scenarios-f91">intrigues</a> <a class="lienmenu" href="http://behindthemirror.fr-bb.com/f4-raconte-moi-ton-histoire">présentations</a> <a class="lienmenu" href="http://behindthemirror.fr-bb.com/t7-bottin-des-avatars">avatars</a> <a class="lienmenu" href="http://behindthemirror.fr-bb.com/f10-invites">invités</a> <a class="lienmenu" href="http://vardaprotectsirius.virtuaboard.com/les-partenaires-f3/devenir-partenaire-t1248.htm">nous lier</a></center></td></tr></tbody></table>
<table>
<tbody>
<tr>
<td class="fondpa1" height="250" width="400"><div class="titrepa1">contexte</div>
<center><div style="TEXT-ALIGN: justify; WIDTH: 390px; FONT-FAMILY: Tahoma, Geneva, sans-serif; HEIGHT: 210px; FONT-SIZE: 12px; OVERFLOW: auto">
Et si tous ces livres que nous lisons n'étaient pas que de la fiction sortie tout droit de l'imaginaire de leurs auteurs? Si inconsciemment ces fameux auteurs avaient, au plus profond d'eux même et sans le savoir, conscience d'un monde où ces personnages, leurs histoires existaient réellement? Un monde parallèle au nôtre mais dont personne n'en connait l'existence ? Et si Edward Cullen et les siens y vivent alors réellement mais avec quelques années de plus, si le terrifiant mais sexy Klaus est toujours en quête de ses armées d'hybrides avec Elena en plein milieu de tout ça? Les soeurs Halliwell et les frères Winchester en guerre contre les forces du mal, démons, mauvais sorciers, vampires sanguinaires et autres créatures de ce crus. Et oui tout ceci est réel dans ce monde-ci, ce monde pareil au nôtre sur bien des événements, des lieux etc mais en même temps si différent par les personnes qui peuvent s'y trouver... Une personne de ce monde peut exister dans le nôtre mais ne pas avoir la même vie, ne pas s'être marié à la même femme, ne pas avoir la même personnalité etc...
Il arrive cependant que nos deux mondes entrent en connexion l'un avec l'autre permettant ainsi un passage entre eux. Ce miracle est possible par une série de rares miroirs, bien que certaines très rares personnes des deux mondes les aient étudié, ils ne comprennent et ne savent toujours pas leur origine, par qui ils ont été fait, des magiciens, des aliens? C'est une grande question toujours sans réponse! Mais quand ces quelques miroirs sont positionnés au même endroit dans les deux mondes à l'exact même centimètre alors le champ s'ouvre et si vous le touchez vous atterrirez dans l'autre monde. Tant que les miroirs seront placés au même endroit alors la connexion existe, mais si vous les bougeaient ailleurs dans la pièce par exemple ou si l'un des deux miroirs est brisé alors la connexion est rompue. Quelques rares humains de notre monde ont pu passer dans celui-ci, par le plus grand des hasards, complètement perdus sur l'endroit où ils se trouvent, certains sont bloqués parce que l'un des miroirs a été brisé ou déplacé, d'autres bien qu'ils soient rares se baladent d'un monde à l'autre...
</div></center></td>
<td class="fondpa1" height="250" width="96"><div class="titrepa2">votez</div>
<center><div style="TEXT-ALIGN: center; FONT-FAMILY: Tahoma, Geneva, sans-serif; HEIGHT: 210px; FONT-SIZE: 12px"><a class="lienmenu2" href="http://www.root-top.com/topsite/titop/in.php?ID=487">♥️</a><a class="lienmenu2" href="http://www.root-top.com/topsite/obsession27/in.php?ID=13685">♥️</a><a class="lienmenu2" href="http://www.root-top.com/topsite/belette/in.php?ID=2036">♥️</a><a class="lienmenu2" href="http://www.root-top.com/topsite/mr/in.php?ID=2089">♥️</a><a class="lienmenu2" href="http://www.root-top.com/topsite/lilie/in.php?ID=5506">♥️</a><a class="lienmenu2" href="http://www.root-top.com/topsite/harry_potter_the_world/in.php?ID=7415">♥️</a><a class="lienmenu2" href="http://www.root-top.com/topsite/beauxbatons/in.php?ID=2366">♥️</a><a class="lienmenu2" href="http://www.root-top.com/topsite/serpentgy/in.php?ID=5338">♥️</a><a class="lienmenu2" href="http://www.root-top.com/topsite/julie2630/in.php?ID=594">♥️</a></div></center></td></tr></tbody></table>
<table>
<tbody>
<tr>
<td class="fondpa1" height="160" width="200"><div class="titrepa1">statistiques</div>
<center><div style="TEXT-ALIGN: justify; WIDTH: 245px; FONT-FAMILY: Tahoma, Geneva, sans-serif; FONT-SIZE: 12px"><strong>Ouverture</strong> le 12.11.10<br><strong>Vampires Pacifistes</strong> : 1<br><strong>Vampires</strong> : 1<br><strong>Métamorphes</strong> : 0<br><strong>Hybrides</strong> : 1<br><strong>Sorciers</strong> : 0<br><strong>Loups-Garous</strong> : 0<br><strong>Démons</strong> : 0<br><strong>Anges</strong> : 0<br><strong>Autres Créatures</strong> : 1<br><strong>Humains</strong> : 1<br><strong>Humains des Miroirs</strong> : 0</div></center></td>
<td class="fondpa1" height="160" width="248"><div class="titrepa1">infos diverses</div>
<center><div style="TEXT-ALIGN: justify; WIDTH: 245px; FONT-FAMILY: Tahoma, Geneva, sans-serif; HEIGHT: 128px; FONT-SIZE: 12px">• 15 lignes de RP minimum<br>• Nous sommes en Août en 2020<br>• Nous recherchons des Professeurs, du Personnel, des Fantômes et des Elèves</div></center></td></tr></tbody></table></td>
<td>
<table>
<tbody>
<tr>
<td class="fondpa1" height="220" width="250"><div class="titrepa1">staff</div>
<center><div style="TEXT-ALIGN: justify; WIDTH: 245px; FONT-FAMILY: Tahoma, Geneva, sans-serif; HEIGHT: 178px; FONT-SIZE: 12px">
<br><center><span class="info"><img src="http://i45.servimg.com/u/f45/13/55/10/23/christ12.png"><span><center><b>Renesmée Cullen</b><br>fondatrice<br><img src="http://s4.noelshack.com/uploads/images/11946043086219_tumblr_lv1r3xsai01qf6uero4_250.gif"></center></span></span>
<span class="info"><img src="http://i45.servimg.com/u/f45/13/55/10/23/liv11.png"><span><center><b>Mia Sanders</b><br>administratrice<br><img src="http://img11.hostingpics.net/pics/917953liv2.gif"></center></span></span>
<span class="info"><img src="http://i45.servimg.com/u/f45/13/55/10/23/av2311.png"><span><center><b>Caroline Forbes</b><br>modératrice<br><img src="http://img205.imageshack.us/img205/7793/candice12.gif"></center></span></span>
<span class="info"><img src="http://i45.servimg.com/u/f45/13/55/10/23/610.jpg"><span><center><b>Numéro 4</b><br>modérateur<br><img src="http://img4.hostingpics.net/pics/825708diannalex.gif"></center></span></span>
<span class="info"><img src="http://i45.servimg.com/u/f45/13/55/10/23/elena-10.jpg"><span><center><b>Elena Gilbert</b><br>???<br><img src="http://img11.hostingpics.net/pics/865613ND5.gif"></center></span></span>
 </center></div></center></td></tr>
<tr>
<td class="fondpa1" height="160" width="250"><div class="titrepa1">predefinis</div>
<center><div style="TEXT-ALIGN: justify; WIDTH: 245px; FONT-FAMILY: Tahoma, Geneva, sans-serif; HEIGHT: 118px; FONT-SIZE: 12px">
<center><a href="http://vardaprotectsirius.virtuaboard.com/persos-pre-definis-et-avatars-f67/eleves-d-alag-1-1-t1301.htm#21166"><img alt="" src="http://img710.imageshack.us/img710/5413/miniiconscorpius.jpg" height="72" width="34"></a> <a href="http://vardaprotectsirius.virtuaboard.com/eleves-des-aer-1-1-f112/les-filles-1-1-t1363.htm#21365"><img alt="" src="http://img691.imageshack.us/img691/2276/miniiconloraline.jpg" height="72" width="34"></a> <a href="http://vardaprotectsirius.virtuaboard.com/eleves-d-aglareb-3-3-f108/les-garcons-2-2-t1309.htm"><img alt="" src="http://img64.imageshack.us/img64/4660/miniiconjames.jpg" height="72" width="34"></a> <a href="http://vardaprotectsirius.virtuaboard.com/persos-pre-definis-et-avatars-f67/eleves-d-aglareb-3-3-t1283.htm"><img alt="" src="http://img42.imageshack.us/img42/6113/miniiconlily.jpg" height="72" width="34"></a> <a href="http://vardaprotectsirius.virtuaboard.com/eleves-d-aglareb-3-3-f108/les-garcons-2-2-t1309.htm"><img alt="" src="http://img64.imageshack.us/img64/6887/miniiconalbus.jpg" height="72" width="34"></a><br><br>prenez-les, ça urge! ♥️</center></div></center></td></tr>
<tr>
<td class="fondpa1" height="109" width="250"><div class="titrepa1">partenaires</div>
<center><div style="TEXT-ALIGN: justify; WIDTH: 245px; FONT-FAMILY: Tahoma, Geneva, sans-serif; HEIGHT: 70px; FONT-SIZE: 12px"><br>
<center><a href="http://rebirth-forum.forumactif.com/"><img alt="" src="http://img17.imageshack.us/img17/7921/miniboutonrebirth.jpg" height="25" width="25"></a> <a href="http://evalaness.forumactif.com/"><img alt="" src="http://img121.imageshack.us/img121/9726/logo1a.jpg"></a> <a href="http://zestedecouleurs.forumactif.org/forum.htm"><img alt="" src="http://img138.imageshack.us/img138/7779/miniboutonzeste.jpg" height="25" width="25"></a> <a href="http://readwithprecautions.forumdeouf.com/"><img alt="" src="http://img163.imageshack.us/img163/5296/miniboutontored.jpg" height="25" width="25"></a><br><a href="http://vardaprotectsirius.virtuaboard.com/partenaires-f95">Plus ?</a> <a href="http://vardaprotectsirius.virtuaboard.com/les-partenaires-f3/devenir-partenaire-t1248.htm">Devenir ?</a> </center></div></center></td></tr></tbody></table></td></tr></tbody></table></div></div><!-- Contenu "Onglet Postes Vacants"  --><div style="DISPLAY: none" id="postesvacants"><div class="contenu">
<center>
<table>
<tbody>
<tr>
<td>
<table height="298">
<tbody>
<tr>
<td width="60">0 points.</td></tr>
<tr>
<td>0 points.</td></tr></tbody></table></td>
<td><img src="http://img15.imageshack.us/img15/9809/logovarda.png"></td>
<td>
<table height="298">
<tbody>
<tr>
<td width="60">0 points.</td></tr>
<tr>
<td>0 points.</td></tr></tbody></table></td></tr></tbody></table></center></div></div><!-- Contenu "Onglet Météo"  --><div style="DISPLAY: none" id="meteo"><div class="contenu">
<table align="center">
<tbody>
<tr>
<td class="fondpa1" height="250" width="382"><div class="titrepa1">13 Novembre 2010</div>
<center><div style="TEXT-ALIGN: justify; WIDTH: 365px; FONT-FAMILY: Tahoma, Geneva, sans-serif; HEIGHT: 210px; FONT-SIZE: 12px; OVERFLOW: auto">• Après de longs mois de hiatus le forum est officiellement réouvert même si il reste deux ou trois détails à régler :)<br>• Nous sommes à la recherche de <strong>deux Directrices de Maisons : Aer et Aglareb</strong>, personnages libres à inventer<br>• Nous recherchons des <strong>modérateur(ice)s</strong> pour les parties hors RP, si vous êtes interéssé(e), contacter Angelica Potter par MP<br>• Il reste des places de <strong>Préfêt(e)s</strong> de libre, pour en savoir plus rendez-vous dans ce <a href="http://vardaprotectsirius.virtuaboard.com/adultes-et-eleves-f4/les-prefets-t10.htm">sujet</a><br>• La PA est enfin installée, elle est l'oeuvre d'Abygaël, merci mille fois à elle pour son magnifique travail ♥️ Finalement les rangs sont de nouveaux fonctionnels.</div></center></td>
<td class="fondpa1" height="250" width="382"><div class="titrepa1">titre</div>
<center><div style="TEXT-ALIGN: justify; WIDTH: 365px; FONT-FAMILY: Tahoma, Geneva, sans-serif; HEIGHT: 210px; FONT-SIZE: 12px; OVERFLOW: auto">• news<br>• news<br>• news<br></div></center></td></tr></tbody></table></div></div><!-- Contenu "Onglet Nouveautés"  --><div style="DISPLAY: none" id="nouveautes"><div class="contenu">
<table align="center">
<tbody>
<tr>
<td class="fondpa1" height="250" width="250"><div class="titrepa1">Elève du Mois</div>
<center><div style="TEXT-ALIGN: justify; WIDTH: 240px; FONT-FAMILY: Tahoma, Geneva, sans-serif; HEIGHT: 210px; FONT-SIZE: 12px; OVERFLOW: auto">
<center><img src="http://thumbnails24.imagebam.com/10634/428ba5106331947.jpg"> <a class="lienmenu2" href="LIEN">nom prénom</a><em>maison etc..</em></center></div></center></td>
<td class="fondpa1" height="250" width="250"><div class="titrepa1">Prof du Mois</div>
<center><div style="TEXT-ALIGN: justify; WIDTH: 240px; FONT-FAMILY: Tahoma, Geneva, sans-serif; HEIGHT: 210px; FONT-SIZE: 12px; OVERFLOW: auto">
<center><img src="http://thumbnails24.imagebam.com/10634/428ba5106331947.jpg"> <a class="lienmenu2" href="LIEN">nom prénom</a><em>maison etc..</em></center></div></center></td>
<td class="fondpa1" height="250" width="250"><div class="titrepa1">Habitant du Mois</div>
<center><div style="TEXT-ALIGN: justify; WIDTH: 240px; FONT-FAMILY: Tahoma, Geneva, sans-serif; HEIGHT: 210px; FONT-SIZE: 12px; OVERFLOW: auto">
<center><img src="http://thumbnails24.imagebam.com/10634/428ba5106331947.jpg"> <a class="lienmenu2" href="LIEN">nom prénom</a><em>maison etc..</em></center></div></center></td></tr></tbody></table></div></div></td></tr></tbody></table><a href="http://best-rpg.forumpro.fr/" target="_blank"><img title="Best RPG, le site de référencement d’RPGs" alt="Best RPG, le site de référencement d’RPGs" src="http://i42.tinypic.com/5nk9s2.jpg" border="0"></a>

Ainsi que le CSS :

Code:
onglets{
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 12px;
  background-color: #B5C6CD;
  padding-top: 2px;
  padding-bottom: 2px;
  text-shadow: #ccc 0px 1px 0px;
  color: #FFF;
  opacity:0.9;
  text-transform: uppercase;
  width: 100px;
  text-align: center;
}
  .onglets:hover{  opacity:1.0;}
.contenu{
  border: 2px solid #000;
  width: 765px;
}

.fondpa1{
  background-color: #EBE8F0;
}

.lienmenu{
  text-decoration: none;
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 13px;
  height: 75px;  text-shadow: #ccc 0px 1px 0px;
}

.lienmenu:hover{
  background-color: #F3F1F5;
  padding-bottom: 28px;  padding-top: 29px;

}

.lienmenu2{
  text-decoration: none;
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 15px;
  display:block;  text-shadow: #ccc 0px 1px 0px;
}

.lienmenu2:hover{
  background-color: #F3F1F5;

}

.titrepa1{
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 24px;
  text-transform: uppercase;
  padding-left: 15px;
  letter-spacing: -2px;
  color: #B5C6CD;  text-shadow: #ccc 0px 1px 0px;
}

.titrepa2{
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 18px;
  text-transform: uppercase;
  padding-left: 8px;
  padding-bottom: 5px;
  letter-spacing: -2px;
  color: #B5C6CD;  text-shadow: #ccc 0px 1px 0px;
}

Et si ça peut servir le template overall_header :

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}" xml:lang="{L_LANG_HTML}" {NAMESPACE_FB_LIKE} {NAMESPACE_FB} {NAMESPACE_BBCODE}>
<head>
   <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" />
   <!-- BEGIN switch_compat_meta -->
   <meta http-equiv="X-UA-Compatible" content="IE={switch_compat_meta.VERSION}" />
   <!-- END switch_compat_meta -->
   <!-- BEGIN switch_canonical_url -->
   <link rel="canonical" href="{switch_canonical_url.CANONICAL_URL}" />
   <!-- END switch_canonical_url -->
   {META_FAVICO}
   {META}
   {META_FB_LIKE}
   <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="{JQUERY_PATH}" type="text/javascript"></script>
   <script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script>

   <!-- BEGIN switch_fb_login -->
   <script src="http://connect.facebook.net/{switch_fb_login.FB_LOCAL}/all.js" type="text/javascript"></script>
   <script src="{switch_fb_login.JS_FB_LOGIN}" type="text/javascript"></script>
   <!-- END switch_fb_login -->

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

   <!-- BEGIN switch_ticker_new -->
   <script src="{JS_DIR}jquery/jcarousel/jquery.jcarousel.js" type="text/javascript"></script>
   <script type="text/javascript">//<![CDATA[
      /* Definir le sens de direction en fonction du panneau admin */
      var tickerDirParam = "{switch_ticker.DIRECTION}";
      var slid_vert = false;
      var auto_dir = 'next';
      var h_perso = parseInt({switch_ticker.HEIGHT});

      switch( tickerDirParam )
      {
         case 'top' :
            slid_vert = true;
            break;

         case 'left':
            break;

         case 'bottom':
            slid_vert = true;
            auto_dir = 'prev';
            break;

         case 'right':
            auto_dir = 'prev';
            break;

         default:
            slid_vert = true;
      }

      $(document).ready(function() {
         var w_cont = $('#fa_ticker_container').width();

         if (w_cont > 0)
         {
            $('#fa_ticker_container').width(w_cont);

            /* Affichage de la liste */
            $('#fa_ticker_content').css('display','block');

            /* Calcul des dimensions du conteneur et des ?l?ments */
            var width_max = $('ul#fa_ticker_content').width();
            var width_item = Math.floor(width_max / {switch_ticker.SIZE});
            var height_max = h_perso;

            /* Calcul de la hauteur maximale du contenur en fonction des ?l?ments et de la hauteur personnalis?e dans l'admin */
            $('ul#fa_ticker_content li').each( function () {
               if ($(this).height() > height_max)
               {
                  height_max = $(this).height();
               }
            } );

            /* Redimensionnement des ?l?ments et des images trop larges */
            $('ul#fa_ticker_content li').width(width_item).height(height_max).find('img').each(function () {
               if ($(this).width() > width_item)
               {
               var ratio      = $(this).width() / width_item;
               var new_height = Math.round($(this).height() / ratio);
               $(this).height(new_height).width(width_item);
               }
            });

            /* Redimensionnement et centrage du conteneur en mode vertical */
            if (slid_vert)
            {
               $('ul#fa_ticker_content').width(width_item).height(height_max).css('marginLeft','auto').css('marginRight','auto');
            }

            /* Initialisation du caroussel */
            $('#fa_ticker_content').jcarousel({
                  vertical: slid_vert,
               wrap: 'circular',
               auto: {switch_ticker.STOP_TIME},
               auto_direction: auto_dir,
            scroll: 1,
            size: {switch_ticker.SIZE},
            height_max: height_max,
            animation: {switch_ticker.SPEED}
            });
         }
         else
         {
            $('ul#fa_ticker_content li:not(:first)').css('display','none');
            $('ul#fa_ticker_content li:first').css('list-style','none').css('text-align','center');
         }
      });
   //]]>
   </script>
   <!-- END switch_ticker_new -->

   <script type="text/javascript">//<![CDATA[
   $(document).ready(function(){
      <!-- BEGIN switch_enable_pm_popup -->
         pm = window.open('{U_PRIVATEMSGS_POPUP}', '_faprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');
         pm.focus();
      <!-- END switch_enable_pm_popup -->
      <!-- BEGIN switch_report_popup -->
         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();
      <!-- END switch_report_popup -->
      <!-- BEGIN switch_ticker -->
         ticker_start({switch_ticker.HEIGHT}, {switch_ticker.SPACING}, {switch_ticker.SPEED}, '{switch_ticker.DIRECTION}', {switch_ticker.STOP_TIME});
      <!-- END switch_ticker -->
   });

   <!-- BEGIN switch_login_popup -->
      var logInPopUpLeft, logInPopUpTop, logInPopUpWidth = {LOGIN_POPUP_WIDTH}, logInPopUpHeight = {LOGIN_POPUP_HEIGHT}, logInBackgroundResize = true, logInBackgroundClass = false;
   <!-- END switch_login_popup -->

   <!-- BEGIN switch_login_popup -->
   $(document).ready( function() {
      $(window).resize(function() {
         var windowWidth = document.documentElement.clientWidth;
         var popupWidth = $("#login_popup").width();
         var mypopup = $("#login_popup");

         $("#login_popup").css({
         "left": windowWidth/2 - popupWidth/2
            });
      });
   });
   <!-- END switch_login_popup -->
   //]]>
   </script>
   {GREETING_POPUP}
   <!-- BEGIN switch_ticker_new -->
   <style>
   .jcarousel-skin-tango .jcarousel-item {
      text-align:center;
      width: 10px;
   }

   .jcarousel-skin-tango .jcarousel-item-horizontal {
      margin-right: {switch_ticker.SPACING}px;
   }

   .jcarousel-skin-tango .jcarousel-item-vertical {
      margin-bottom: {switch_ticker.SPACING}px;
   }
   </style>
   <!-- END switch_ticker_new -->
   {HOSTING_JS}
   <!-- BEGIN google_analytics_code -->
   <script type="text/javascript">
   //<![CDATA[
    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', '{G_ANALYTICS_ID}']);
    _gaq.push(['_trackPageview']);

    (function() {
      var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
      ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    })();
   //]]>
   </script>
   <!-- END google_analytics_code -->
</head>
<body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">
 
  <table class="navtop" width="100%" border="0" cellspacing="0" cellpadding="0"><tbody><tr><td valign="top"><center>{GENERATED_NAV_BAR}</center>
</td></tr></tbody></table><br/>
 
   <!-- BEGIN hitskin_preview -->
   <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>
   <!-- END hitskin_preview -->

   <!-- BEGIN switch_login_popup -->
   <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>
   <!-- END switch_login_popup -->

   <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>
                  <!-- BEGIN switch_logo_left -->
                  <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
                  <!-- END switch_logo_left -->
                  <td align="center" width="100%" valign="middle">
                     <!-- BEGIN switch_logo_center -->
                     <a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a>
                     
                     <!-- END switch_logo_center -->
                     <div class="maintitle">{MAIN_SITENAME}</div>
                     
                     <span class="gen">{SITE_DESCRIPTION}<br />&nbsp; </span>
                  </td>
                  <!-- BEGIN switch_logo_right -->
                  <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
                  <!-- END switch_logo_right -->
               </tr>
            </table>


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

            <!-- BEGIN switch_ticker_new -->
            <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">
                           <ul id="fa_ticker_content" class="jcarousel-skin-tango" style="display:none;">
                              <!-- BEGIN ticker_row -->
                              <li>{switch_ticker.ticker_row.ELEMENT}</li>
                              <!-- END ticker_row -->
                           </ul>
                        </div>
                     </td>
                  </tr>
               </table>
            </div>
            <!-- END switch_ticker_new -->

            <!-- BEGIN switch_ticker -->
            <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">
                                 <!-- BEGIN ticker_row -->
                                 <div>{switch_ticker.ticker_row.ELEMENT}</div>
                                 <!-- END ticker_row -->
                              </div>
                           </div>
                        </div>
                     </td>
                  </tr>
               </table>
            </div>
            <!-- END switch_ticker -->

            <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}">
                                 <!-- BEGIN giefmod_index1 -->
                                 {giefmod_index1.MODVAR}
                                    <!-- BEGIN saut -->
                                    <div style="height:{SPACE_ROW}px"></div>
                                    <!-- END saut -->
                                 <!-- END giefmod_index1 -->
                              </div>
                           </td>
                           <td valign="top" width="100%">
<!-- BEGIN html_validation -->
                           </td>
                        </tr>
                     </tbody>
                  </table>
               </div>
            </div>
         </td>
      </tr>
   </table>
</body>
</html>
<!-- END html_validation -->

Comme je l'ai dit plus haut, les codes n'étant pas de moi je n'ai pas le script, il n'est pas d'ailleurs pas enregistré sur le forum.

Merci d'avance à tout ceux qui essaieront de m'aider. Quant à ceux qui trouveront la solution vous aurez ma reconnaissance éternelle ainsi qu'une statue à votre gloire!!!!!

MessageSujet: Onglet dans la PA   Onglet dans la PA EmptyVen 30 Mar 2012, 15:12
Revenir en haut Aller en bas
http://ny-university.superforum.fr/
Thalie
Thalie
{ Membre actif }
{ Membre actif }

Féminin Messages : 317



Onglet dans la PA Empty
Bonsoir !
Je vais essayé de voir ce qu'il se passe.
Mais est ce que tu pourrais me dire comment ca doit être normalement ?

ce sont des page qui défilent toute seule ? ou bien quand on passe sur les onglets ca change de passe ? ou c'est quand on clique.

Merci de m’éclairer un peu sur le fonctionnement cette page, pour que je puisse t'aider au mieux Smile
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptyVen 30 Mar 2012, 15:27
Revenir en haut Aller en bas
http://cssmania.com
Anoobnyme
Anoobnyme
GOD OF COOKIES

Masculin Messages : 1445



Onglet dans la PA Empty
Hep'

Avez-vous apporté des modification concernant le codage de la PA ?
Ensuite avez-vous le site où vous avez trouvé ce système à onglet ?
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptyVen 30 Mar 2012, 15:28
Revenir en haut Aller en bas
Umbre
Umbre
{ Membre }
{ Membre }

Féminin Messages : 21



Onglet dans la PA Empty
Thalie => c'est quand on passait dessus que ça changeait.

Anoobnyme => j'ai rajouté des infos bulles sur la PA mais je ne rien enlevé et je n'ai pas le site d'ou est tiré le code. C'est une amie de la fondatrice qui l'a créé je n'ai que ce que je vous ai donné.
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptyVen 30 Mar 2012, 15:40
Revenir en haut Aller en bas
http://www.yowa.fr.nf/
♠ Yowa ♫
♠ Yowa ♫
{ Membre actif }
{ Membre actif }

Masculin Messages : 349



Onglet dans la PA Empty
Juste comme ça :
Essaye de mettre un point dans la première ligne du CSS (.onglet)

Code:
.onglets{
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 12px;
  background-color: #B5C6CD;
  padding-top: 2px;
  padding-bottom: 2px;
  text-shadow: #ccc 0px 1px 0px;
  color: #FFF;
  opacity:0.9;
  text-transform: uppercase;
  width: 100px;
  text-align: center;
}
  .onglets:hover{  opacity:1.0;}
.contenu{
  border: 2px solid #000;
  width: 765px;
}

.fondpa1{
  background-color: #EBE8F0;
}

.lienmenu{
  text-decoration: none;
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 13px;
  height: 75px;  text-shadow: #ccc 0px 1px 0px;
}

.lienmenu:hover{
  background-color: #F3F1F5;
  padding-bottom: 28px;  padding-top: 29px;

}

.lienmenu2{
  text-decoration: none;
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 15px;
  display:block;  text-shadow: #ccc 0px 1px 0px;
}

.lienmenu2:hover{
  background-color: #F3F1F5;

}

.titrepa1{
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 24px;
  text-transform: uppercase;
  padding-left: 15px;
  letter-spacing: -2px;
  color: #B5C6CD;  text-shadow: #ccc 0px 1px 0px;
}

.titrepa2{
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 18px;
  text-transform: uppercase;
  padding-left: 8px;
  padding-bottom: 5px;
  letter-spacing: -2px;
  color: #B5C6CD;  text-shadow: #ccc 0px 1px 0px;
}
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptyVen 30 Mar 2012, 16:09
Revenir en haut Aller en bas
Umbre
Umbre
{ Membre }
{ Membre }

Féminin Messages : 21



Onglet dans la PA Empty
il y est j'ai du le rater en copiant
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptyVen 30 Mar 2012, 16:11
Revenir en haut Aller en bas
http://www.yowa.fr.nf/
♠ Yowa ♫
♠ Yowa ♫
{ Membre actif }
{ Membre actif }

Masculin Messages : 349



Onglet dans la PA Empty
Ah désolé :/
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptyVen 30 Mar 2012, 16:16
Revenir en haut Aller en bas
http://cssmania.com
Anoobnyme
Anoobnyme
GOD OF COOKIES

Masculin Messages : 1445



Onglet dans la PA Empty
♠ Yowa ♫ a écrit:
Juste comme ça :
Essaye de mettre un point dans la première ligne du CSS (.onglet)

Code:
.onglets{
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 12px;
  background-color: #B5C6CD;
  padding-top: 2px;
  padding-bottom: 2px;
  text-shadow: #ccc 0px 1px 0px;
  color: #FFF;
  opacity:0.9;
  text-transform: uppercase;
  width: 100px;
  text-align: center;
}
  .onglets:hover{  opacity:1.0;}
.contenu{
  border: 2px solid #000;
  width: 765px;
}

.fondpa1{
  background-color: #EBE8F0;
}

.lienmenu{
  text-decoration: none;
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 13px;
  height: 75px;  text-shadow: #ccc 0px 1px 0px;
}

.lienmenu:hover{
  background-color: #F3F1F5;
  padding-bottom: 28px;  padding-top: 29px;

}

.lienmenu2{
  text-decoration: none;
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 15px;
  display:block;  text-shadow: #ccc 0px 1px 0px;
}

.lienmenu2:hover{
  background-color: #F3F1F5;

}

.titrepa1{
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 24px;
  text-transform: uppercase;
  padding-left: 15px;
  letter-spacing: -2px;
  color: #B5C6CD;  text-shadow: #ccc 0px 1px 0px;
}

.titrepa2{
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 18px;
  text-transform: uppercase;
  padding-left: 8px;
  padding-bottom: 5px;
  letter-spacing: -2px;
  color: #B5C6CD;  text-shadow: #ccc 0px 1px 0px;
}

Si il y a un point ce n'est pas pour rien, c'est une <div>
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptyVen 30 Mar 2012, 16:22
Revenir en haut Aller en bas
http://www.yowa.fr.nf/
♠ Yowa ♫
♠ Yowa ♫
{ Membre actif }
{ Membre actif }

Masculin Messages : 349



Onglet dans la PA Empty
Oui, mais il n'y été pas sur le premier post.
Mais comme Umbre la précisé, c'est un erreur de copie Wink
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptyVen 30 Mar 2012, 16:27
Revenir en haut Aller en bas
Espeon
Espeon
Administrateur
Administrateur

Masculin Messages : 1819



Onglet dans la PA Empty
Bonsoir,

Alors techniquement, ce qui devrait faire fonctionner tes onglets, c'est le javascript qui est appelé dans le code suivant :

Code:
   
<td><div class="onglets" onmouseover="javascript:shownavigation()">Index</div></td>
<td><div class="onglets" onmouseover="javascript:showpostesvacants()">Sabliers</div></td>
<td><div class="onglets" onmouseover="javascript:showmeteo()">News</div></td>
<td><div class="onglets" onmouseover="javascript:shownouveautes()">Du Mois</div></td>
<td><div onmouseover="javascript:showstaff()"></div></td>

Or en me rendant sur ton forum et en checkant le code source, je ne parvient pas à retrouver ces fonctions (showmeteo(), shownouveautes(), ...).


Est-ce-que tu vois de quoi je parle ?
Où est-ce-que tu avais placé ces scripts/codes ?
As-tu fais des modifications dernièrement qui pourrait expliquer que cela ne fonctionne plus (suppression par inadvertance, ...) ?
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptyVen 30 Mar 2012, 17:23
Revenir en haut Aller en bas
Umbre
Umbre
{ Membre }
{ Membre }

Féminin Messages : 21



Onglet dans la PA Empty
Je vois oui de quoi tu parles et c'est même la première question que j'ai posé à l'admin, "OU AS TU CACHE LE SCRIPT????"

Le problème comme je l'ai dit c'est que ce n'est pas moi qui ait installé cette PA et ce script, s'il a été mis je ne sais absolument pas où il aurait pu être ni même savoir si je l'ai supprimé sans faire exprès.
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptySam 31 Mar 2012, 06:42
Revenir en haut Aller en bas
Espeon
Espeon
Administrateur
Administrateur

Masculin Messages : 1819



Onglet dans la PA Empty
Ok pas de soucis, est-ce-que tu as un lien vers un exemple qui fonctionne, le tutoriel (si c'était un tutoriel) ?
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptySam 31 Mar 2012, 07:14
Revenir en haut Aller en bas
Umbre
Umbre
{ Membre }
{ Membre }

Féminin Messages : 21



Onglet dans la PA Empty
Voilà un fo' ou la même PA a été installé et qui marche elle.

http://vardaprotectsirius.virtuaboard.com/
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptySam 31 Mar 2012, 07:17
Revenir en haut Aller en bas
Espeon
Espeon
Administrateur
Administrateur

Masculin Messages : 1819



Onglet dans la PA Empty
Le code javascript correspondant est le suivant :

Code:
function shownavigation() { document.getElementById('navigation').style.display='block'; document.getElementById('postesvacants').style.display='none'; document.getElementById('meteo').style.display='none'; document.getElementById('nouveautes').style.display='none'; document.getElementById('staff').style.display='none'; document.getElementById('credits').style.display='none'; } function showpostesvacants() { document.getElementById('navigation').style.display='none'; document.getElementById('postesvacants').style.display='block'; document.getElementById('meteo').style.display='none'; document.getElementById('nouveautes').style.display='none'; document.getElementById('staff').style.display='none'; document.getElementById('credits').style.display='none'; } function showmeteo() { document.getElementById('navigation').style.display='none'; document.getElementById('postesvacants').style.display='none'; document.getElementById('meteo').style.display='block'; document.getElementById('nouveautes').style.display='none'; document.getElementById('staff').style.display='none'; document.getElementById('credits').style.display='none'; } function shownouveautes() { document.getElementById('navigation').style.display='none'; document.getElementById('postesvacants').style.display='none'; document.getElementById('meteo').style.display='none'; document.getElementById('nouveautes').style.display='block'; document.getElementById('staff').style.display='none'; document.getElementById('credits').style.display='none'; } function showstaff() { document.getElementById('navigation').style.display='none'; document.getElementById('postesvacants').style.display='none'; document.getElementById('meteo').style.display='none'; document.getElementById('nouveautes').style.display='none'; document.getElementById('staff').style.display='block'; document.getElementById('credits').style.display='none'; } function showcredits() { document.getElementById('navigation').style.display='none'; document.getElementById('postesvacants').style.display='none'; document.getElementById('meteo').style.display='none'; document.getElementById('nouveautes').style.display='none'; document.getElementById('staff').style.display='none'; document.getElementById('credits').style.display='block'; }


Il faut que tu place ce code dans un fichier javascript (.js) et que tu l'inclue dans ta page html (dans le head de préférence).

As-tu besoin de plus de détails sur comment faire ou tu vois ce que je veux dire ? Wink
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptySam 31 Mar 2012, 07:27
Revenir en haut Aller en bas
Umbre
Umbre
{ Membre }
{ Membre }

Féminin Messages : 21



Onglet dans la PA Empty
Merci beaucoup Espeon ça remarche.

Merci aussi à tous ceux qui ont pris le temps de se pencher sur le problème.
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptySam 31 Mar 2012, 07:41
Revenir en haut Aller en bas
Espeon
Espeon
Administrateur
Administrateur

Masculin Messages : 1819



Onglet dans la PA Empty
Y'a pas de soucis, ravi d'avoir pu t'aider Wink

Problème résolu Smile
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptySam 31 Mar 2012, 07:43
Revenir en haut Aller en bas
Psycho
Psycho
Psychopathe
Psychopathe

Féminin Messages : 3407



Onglet dans la PA Empty
    Hello (:
    Si le problème est résolu, je classe =D
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA EmptySam 31 Mar 2012, 17:03
Revenir en haut Aller en bas
Contenu sponsorisé




Onglet dans la PA Empty
MessageSujet: Re: Onglet dans la PA   Onglet dans la PA Empty
Revenir en haut Aller en bas
 

Onglet dans la PA

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

 Sujets similaires

-
» [résolu]Intégrer un menu à onglet dans un menu à onglet
» Décalage dans une présentation en onglet
» Problème liens dans onglet
» Changement du texte dans l'onglet .
» Probleme de cellule dans l'onglet PA (et oui encore moi >.<)

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
CSSActif :: De la théorie à la pratique :: Aide CSS & xHTML :: Problèmes résolus-

Partenaires Or


← Page précédente   ↑ Aller en haut Copyright © CSSActif 2009 - 2013 Tous droits réservés
Créer un forum | ©phpBB | Forum gratuit d'entraide | Signaler un abus | Forum gratuit