Merci à vic_le_faucheur pour son tuto et sa disponibilité à aider encore.Allons y Tiffa.
Le JS est bien où il est, mais nécessite une petite modification pour permettre d'avoir dans le menu également le lien de tout l'index, et surtout toutes les catégories par défaut.
Si ce n'est pas ce que tu désires, tu ne touche pas au JS.
Repère et supprime juste cette ligne du JS :
- Code:
$('.onglet:eq(0)').click();
Passons maintenant au template
index_box dans lequel nous allons juste couper le bloc ses onglets pour le coller dans l'
overall_header (afin que le menu se retrouve sur toutes les pages).
Repère et coupe (Ctrl+X) de l'index_box :
- Code:
<div id="conteneur_onglets">
<div class="onglet">Général</div>
<div class="onglet">La Chine</div>
<div class="onglet">La Corée du Sud</div>
<div class="onglet">Le Japon</div>
<div class="onglet">Autres</div>
<div class="onglet">Zone privilégié</div>
</div>
Colle ce bloc dans l'overall_header après la balise >body< ainsi
- Code:
<div id="startonglets">
<div id="conteneur_onglets">
<div class="onglet"><a href="url_index">Tout</a></div>
<div class="onglet"><a href="url_général">Général</a></div>
<div class="onglet"><a href="url_chine">La Chine</a></div>
<div class="onglet"><a href="url_japon">Le Japon</a></div>
<div class="onglet"><a href="url_CdS">La Corée du Sud</a></div>
<div class="onglet"><a href="url_Autres">Autres</a></div>
<div class="onglet"><a href="url_ZP">Zone privilégiée</a></div>
</div>
</div>
<!-- BEGIN hitskin_preview -->
Dans ce nouveau bloc, tu peux constater que nous avons ajouter un conteneur qui contient celui des liens liens vers les catégories.
Mais nous avons aussi ajouter un onglet pour l'accueil dans sa totalité puisqu'une catégorie est une page à elle-seule et ce sera utile dans les autres pages d'une telle ou telle catégories (ouh lala, l'explication).
Sur l'accueil c'est le script qui agit avec un fondu-enchainé lors du changement (sauf pour le lien de l'index), et dans une catégorie c'est le clic.
Tu as aussi la possibilité de supprimer les div et placer les "
class" directement dans la balise-url avec le code du saut de ligne:
- Code:
<a class="index" href="url_index">Tout</a><br />
Le CSS, je te laisse le personnaliser comme tu le souhaites, je reste à disposition en cas de question:
- Spoiler:
/* CSS pour le conteneur des catégories */
#conteneur_categories
{
}
/* CSS pour les catégories */
.categorie
{
}
/* CSS pour le conteneur des onglets */
#conteneur_onglets
{
display: none;
}
/* CSS pour les onglets */
.onglet
{
cursor: pointer;
}
#startonglets {
position: fixed;
top: 170px;
left: 1px;
width: 7px;
height: 130px;
overflow: hidden;
border: 3px groove #000;
border-left: none;
padding: 3px;
cursor: pointer;
z-index: 999;
}
#startonglets:hover {
display; block;
width: 170px;
height: 170px;
text-align: center;
text-shadow: 0px 1px 0 black;
border: 7px ridge #A92C10;
background: orange;
box-shadow: 8px 8px 16px gray;
-moz-box-shadow: 8px 8px 16px #444;
-webkit-box-shadow: 8px 8px 16px #444;
-o-box-shadow: 8px 8px 16px #444;
-htm-box-shadow: 8px 8px 16px #444;
padding: 7px 3px 7px;
-moz-border-radius:13px;
-webkit-border-radius: 13px;
-o-border-radius: 13px;
border-radius: 13px;
padding: 7px;
-o-transition: 1.7s ease;
-webkit-transition: 1.7s ease;
-moz-transition: 1.7s ease;
-htm-transition: 1.7s ease;
transition: 1.7s ease;
cursor: pointer;
z-index: 999;
}
Le CSS de Vic_le_faucheur <
Attention de bien ajouté dans le template overall_header une catégorie que tu ajouterais ou de la supprimer aussi là le cas contraire.
EDIT : A!ie, aïe, pas la tête le staff !!! Je voulais supprimer mon précédent post, mais j'ai envoyé trop vite.
:boulet:
Vous pouvez supprimer le précédent message sans autre. Merci et