Ma demande
Bonjour à vous !
Alors voilà, je suis actuellement sur un projet de forum avec un graphiste, et faute de mieux, je suis le codeuriiiiish ? plus ou moins ! ><
Et donc j'ai une difficultée pour arriver à un résultat demandé : j'ai suivi ce tutoriel afin de me rapprocher de sa demande (des catégories qui ne s'affichent qu'une seule à la fois, cliquables par onglets) et ça j'ai réussi, rien de bien compliqué :)
Par contre où ça se corse c'est que à la place de genre "onglet1", "onglet2" ou "onglet3" je voudrais mettre des images, à chaque fois différentes ! Et donc c'est là que je bute. J'ai cherché dans le HTML, dans le CSS et dans le Javascript, rien n'a l'air de faire référence à chacun des liens séparés, c'est uniquement groupé... Donc ça signifie qu'il faut que j'écrive du code et je ne sais pas par où commence rpour atteindre mon résultat Est-ce que vous pourriez m'aider ou au moins m'expliquer comment faire pour remplacer ces onglets textuels par des images s'il vous plaît ? Merci d'avance ! ^^
Alors voilà, je suis actuellement sur un projet de forum avec un graphiste, et faute de mieux, je suis le codeuriiiiish ? plus ou moins ! ><
Et donc j'ai une difficultée pour arriver à un résultat demandé : j'ai suivi ce tutoriel afin de me rapprocher de sa demande (des catégories qui ne s'affichent qu'une seule à la fois, cliquables par onglets) et ça j'ai réussi, rien de bien compliqué :)
Par contre où ça se corse c'est que à la place de genre "onglet1", "onglet2" ou "onglet3" je voudrais mettre des images, à chaque fois différentes ! Et donc c'est là que je bute. J'ai cherché dans le HTML, dans le CSS et dans le Javascript, rien n'a l'air de faire référence à chacun des liens séparés, c'est uniquement groupé... Donc ça signifie qu'il faut que j'écrive du code et je ne sais pas par où commence rpour atteindre mon résultat Est-ce que vous pourriez m'aider ou au moins m'expliquer comment faire pour remplacer ces onglets textuels par des images s'il vous plaît ? Merci d'avance ! ^^
Schéma(s) et Eléments
Schémas : Taupe secret !
Tailles des éléments : moins de 800px mais indifférent, je ferai les règlages moi-même !
Effets voulus : NOPE ! Juste qu'on me fasse une ligne de code dans le HTML pour mettre une image à la place de "administration", "hors-jeu" et "le roleplay", merci ^^
Version de votre forum : PHPBB2
Tailles des éléments : moins de 800px mais indifférent, je ferai les règlages moi-même !
Effets voulus : NOPE ! Juste qu'on me fasse une ligne de code dans le HTML pour mettre une image à la place de "administration", "hors-jeu" et "le roleplay", merci ^^
Version de votre forum : PHPBB2
Ressources
Le Index_box :
et le javascript (pas indenté, désolééééééééééé ):
- Spoiler:
- Code:
<link href="https://fonts.googleapis.com/css?family=Acme|Six+Caps" rel="stylesheet">
<div id="conteneur_ongletsvo"><table><tr><td class="ongletvo"><div>Administration</div></td><td class="ongletvo">Le Roleplay</div></td><td class="ongletvo">Hors-jeu</div></td></tr></table></div><div id="conteneur_categoriesvo"><!-- BEGIN catrow --><!-- BEGIN tablehead --><div class="categorievo">
<div class="forumline2">
<div class="categorie_titre">{catrow.tablehead.L_FORUM}</div>
<!-- END tablehead -->
<!-- BEGIN forumrow -->
<div class="forum_bloc">
<div class="forum_left">
<div class="sous_forum">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div>
<div class="forum_description">{catrow.forumrow.FORUM_DESC}</div>
</div>
<div class="forum_stats"><span class="stats1">{catrow.forumrow.TOPICS}</span>sujets
<br />
<span class="stats1">{catrow.forumrow.POSTS}</span>messages</div>
<div class="forum_right">
<span class="forum_name"><a href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></span>
<span class="last_mess">{catrow.forumrow.LAST_POST}</span>
</div>
<div class="forum_icone"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /></div>
</div>
<!-- END forumrow -->
<!-- BEGIN catfoot -->
<!-- END catfoot -->
<!-- BEGIN tablefoot -->
</div></div><!-- END tablefoot --><!-- END catrow --></div>
et le javascript (pas indenté, désolééééééééééé ):
- Spoiler:
- Code:
$('document').ready(function(){if($('.categorievo').size()>1){$('#conteneur_ongletsvo').css('display','block');$('#conteneur_ongletsvo .ongletvo').click(function(){change_categorie($('.ongletvo','#conteneur_ongletsvo').index(this))});$('.ongletvo:eq(0)').click()}});function change_categorie(index){if($('.categorievo:eq('+index+')').size()!=0){$('.categorievo').css('display','none');$('.categorievo:eq('+index+')').fadeIn(500);$('.ongletvo.actif').removeClass('actif');$('.ongletvo:eq('+index+')').addClass('actif')}else alert('Vous ne pouvez pas accÃder à cette catÃgorie')}
Autres précisions ?
J'ai juste besoin d'une modification au HTML pour pouvoir insérer mes images ^^ Tout ce qui est modification du code, je gère ! Par contre la création je sais pas faire U_U, d'où ma demande, alors ne vous embêttez surtout pas à faire du CSS ou autre ^^ J'ai juste besoin d'être mis dans la bonne voie Merci encore !
Dernière édition par Lone wanderer le Sam 8 Sep 2018 - 22:56, édité 1 fois