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! |
| [résolu] Profil en onglets | |
| jamie.
{ Membre }
Messages : 17
| Bonjour, bonsoir En tentant de mettre mon profil en onglet (profil de base et feuille personnage séparés donc), un petit souci a pointé le bout de son nez. Le code ne fonctionne que sur la fiche du premier posteur. La raison ? L'ID ! Ir un id n'est utilisé qu'une seule fois sur une page, donc ici sur le premier posteur et non les autres. Mais voilà, j'ai tenté d'autres codes et le seul que j'ai réussi à faire fonctionner (à moitié) et bien c'est celui-ci ! un petite alternative à l'id ? souci en image- Spoiler:
CODE SOUS HIDE la partie concernée de mon template viewtopic_bodyle css concernéet enfin, le javascriptVoilà, voilà Si besoin de renseignements supplémentaires n'hésitez surtout pas <3 Un très grand merci d'avance et bon courage |
Dernière édition par jamie. le Sam 04 Mai 2013, 05:43, édité 1 fois | |
| | | 'Christa
Lostmindy
Messages : 2856
| Bonjour, Sauf erreur de ma part, il existe un tutoriel sur le forum des forums permettant d'avoir un profil en onglets, il en a d'ailleurs été question récemment sur CSSActif... *fait une recherche* Ah, voilà, dans ce sujet. Méthode alternative possible, donc. Il y a également un code à copier coller à jour sur CSSActif qui n'utilise pas la vieille méthode pas optimisée que tu emploies, en particulier il ne dépend pas des identifiants |
Dernière édition par 'Christa le Lun 07 Juin 2021, 10:19, édité 1 fois | |
| | | jamie.
{ Membre }
Messages : 17
| Bonjour, J'essaie de ce pas, je prendrais le temps de mieux chercher la prochaine fois. Merci beaucoup | | |
| | | jamie.
{ Membre }
Messages : 17
| Encore moi ^^' (désolée du double post) J'ai tenté le tutoriel que tu m'as donc donné; en vain. Les onglets ne fonctionnent même pas :l | | |
| | | 'Christa
Lostmindy
Messages : 2856
| Les doubles posts étant interdits, pense à éditer ton message la prochaine fois ^^'
Pour pouvoir t'aider, j'ai besoin du lien de ton forum et des codes que tu as mis en place, je n'ai pas de boule de cristal opérationnelle en stock XD | | |
| | | jamie.
{ Membre }
Messages : 17
| ah mince j'avais pas remarqué les boutons, c'est perturbant que ce soit en bas xD le lien : http://staypositive.forumactif.com/t29-regles-du-forum template view_topic - Code:
-
<script type="text/javascript"> //<![CDATA[ var multiquote_img_off = '{JS_MULTIQUOTE_IMG_OFF}', multiquote_img_on = '{JS_MULTIQUOTE_IMG_ON}', _atr = '{JS_DIR}addthis/', _ati = '{PATH_IMG_FA}addthis/'{ADDTHIS_LANG}, addthis_localize = { share_caption: "{L_SHARE_CAPTION}", email: "{L_EMAIL}", email_caption: "{L_EMAIL_CAPTION}", favorites: "{L_SHARE_BOOKMARKS}", print: "{L_PRINT}", more: "{L_MORE}" }; $(function(){ _atc.cwait = 0; $('.addthis_button').mouseup(function(){ if ($('#at15s').css('display') == 'block') { addthis_close(); addthis_close(); } }); }); //]]> </script>
<table width="100%" border="0" cellspacing="2" cellpadding="0"> <tr> <td align="left" valign="middle" nowrap="nowrap"> <span class="nav"> <!-- BEGIN switch_user_authpost --> <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" id="{POST_IMG_ID}one" alt="{L_POST_NEW_TOPIC}" align="middle" border="0" /></a> <!-- END switch_user_authpost --> <!-- BEGIN switch_user_authreply --> <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" id="i_reply" alt="{L_POST_REPLY_TOPIC}" align="middle" border="0" /></a> <!-- END switch_user_authreply --> </span> </td> <td class="nav" valign="middle" width="100%"><span class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_SEP}<a class="nav" href="{U_ALBUM}">{L_ALBUM}</a>{NAV_CAT_DESC_SECOND}</span></td> <td align="center" valign="bottom" nowrap="nowrap" width="100%"> <span class="gensmall bold"> <a class="addthis_button" href="http://www.addthis.com/bookmark.php?v=250&pub=forumotion">{L_SHARE}</a> | <script type="text/javascript"> //<![CDATA[ insert_plus_menu('f{FORUM_ID}&t={TOPIC_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES}); //]]> </script> </span> </td> </tr> </table>
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0"> <tr align="center"> <td class="catHead" colspan="3" height="28"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="9%" class="noprint"> </td> <td align="center" nowrap="nowrap" class="t-title"><h1 class="cattitle"> {TOPIC_TITLE}</h1></td> <td align="center" nowrap="nowrap" width="9%" class="browse-arrows"><a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a> <a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a> <a href="#bottom">{L_GOTO_DOWN}</a> </td> </tr> </table> </td> </tr> <!-- BEGIN topicpagination --> <tr> <td class="row1 pagination" colspan="2" align="center" valign="top"><span class="gensmall">{PAGINATION}</span></td> </tr> <!-- END topicpagination --> {POLL_DISPLAY} <!-- BEGIN postrow --> <!-- BEGIN displayed --> <tr class="post post--{postrow.displayed.U_POST_ID}" id="p{postrow.displayed.U_POST_ID}" style="{postrow.displayed.DISPLAYABLE_STATE}"> <td class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="150"> <span class="postdetails poster-profile"> <div class="profilentour"> {postrow.displayed.POSTER_AVATAR}<br /> <center><span class="name"><a name="{postrow.displayed.U_POST_ID}"></a><strong><span style="font-family: 'Times New Roman'; font-size: 22px; font-weight: bold; font-style: italic; margin-bottom:4px;">{postrow.displayed.POSTER_NAME}</span></strong></span></center> <center><div class="rank" style="padding-top: -8px;">{postrow.displayed.POSTER_RANK}</div></center> </div> <br /> <div class="systab"> <div> <span>Profil</span> <div class="profilentour"><!-- BEGIN profile_field --> <span id="delf2" class="profile_field">{postrow.displayed.profile_field.LABEL}</span> {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR} <script type="text/javascript"> jQuery('#delf2').html(jQuery('#delf2').html().replace(/: /g,'— ')).removeAttr('id'); </script> <!-- END profile_field --></div> </div> <div> <span>Petit plus</span> <div class="profilentour"><div align="left"><div class="profilmasque" onClick="this.firstChild.src=(this.firstChild.src=='https://2img.net/h/oi50.tinypic.com/2j0fp0p.png')?'https://2img.net/h/oi46.tinypic.com/qri3iq.png':'https://2img.net/h/oi50.tinypic.com/2j0fp0p.png';this.lastChild.style.display=(this.firstChild.src=='https://2img.net/h/oi50.tinypic.com/2j0fp0p.png')?'none':'block';" style="text-align: center; padding: 3px;"><input type="image" src="https://2img.net/h/oi50.tinypic.com/2j0fp0p.png"/><div style="display: none; text-align: center;"><span id="rpgone">{postrow.displayed.POSTER_RPG}</span> <script type="text/javascript">jQuery('#rpgone').html(jQuery('#rpgone').html().replace('Feuille de personnage','')).removeAttr('id')</script></div></div></div></div> </div>
</div> </span> <img src="https://2img.net/i/fa/vide.gif" alt="" style="width:150px;height:1px" /> </td> <td class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="100%" height="28" colspan="2"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td><span class="postdetails"><img src="{postrow.displayed.MINI_POST_IMG}" alt="{postrow.displayed.L_MINI_POST_ALT}" title="{postrow.displayed.L_MINI_POST_ALT}" border="0" />{L_POST_SUBJECT}: {postrow.displayed.POST_SUBJECT} <img src="{postrow.displayed.MINI_TIME_IMG}" alt="" border="0" />{postrow.displayed.POST_DATE}</span></td> <td valign="top" nowrap="nowrap" class="post-options"> {postrow.displayed.THANK_IMG} {postrow.displayed.MULTIQUOTE_IMG} {postrow.displayed.QUOTE_IMG} {postrow.displayed.EDIT_IMG} {postrow.displayed.DELETE_IMG} {postrow.displayed.IP_IMG} {postrow.displayed.REPORT_IMG} </td> </tr> <tr> <td colspan="2" class="hr"> <hr /> </td> </tr> <tr> <td colspan="2"> <!-- BEGIN switch_vote_active --> <div class="vote gensmall"> <!-- BEGIN switch_vote --> <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}">+</a></div> <!-- END switch_vote -->
<!-- BEGIN switch_bar --> <div class="vote-bar" title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}"> <!-- BEGIN switch_vote_plus --> <div class="vote-bar-plus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;"></div> <!-- END switch_vote_plus -->
<!-- BEGIN switch_vote_minus --> <div class="vote-bar-minus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div> <!-- END switch_vote_minus --> </div> <!-- END switch_bar -->
<!-- BEGIN switch_no_bar --> <div title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}" class="vote-no-bar">----</div> <!-- END switch_no_bar -->
<!-- BEGIN switch_vote --> <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}">-</a></div> <!-- END switch_vote --> </div> <!-- END switch_vote_active -->
<div class="message_contenu">
{postrow.displayed.MESSAGE}
<div class="signature_div"> {postrow.displayed.SIGNATURE} </div> </div> <span class="gensmall">{postrow.displayed.EDITED_MESSAGE}</span> </td> </tr> </table> </td> </tr> <tr> <td class="{postrow.displayed.ROW_CLASS} browse-arrows"{postrow.displayed.THANK_BGCOLOR} align="center" valign="middle" width="150"> <a href="#top">{L_BACK_TO_TOP}</a> <a href="#bottom">{L_GOTO_DOWN}</a> </td> <td class="{postrow.displayed.ROW_CLASS} messaging gensmall"{postrow.displayed.THANK_BGCOLOR} width="100%" height="28"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td valign="middle"> {postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG}<!-- BEGIN contact_field --> {postrow.displayed.contact_field.CONTENT}<!-- END contact_field --> {postrow.displayed.ONLINE_IMG} </td> </tr> </table> </td> </tr> <!-- BEGIN first_post_br --> </table> <br /> <table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0"> <tr> <th class="thLeft" nowrap="nowrap" width="150px" height="26">{L_AUTHOR}</th> <th class="thRight" nowrap="nowrap" colspan="2">{L_MESSAGE}</th> </tr> <!-- END first_post_br --> <!-- END displayed --> <!-- BEGIN hidden --> <tr> <td class="postdetails {postrow.hidden.ROW_CLASS}" colspan="2" align="center">{postrow.hidden.MESSAGE}</td> </tr> <!-- END hidden --> <!-- END postrow --> <!-- BEGIN no_post --> <tr align="center"> <td class="row1" colspan="3" height="28"> <span class="genmed">{no_post.L_NO_POST}</span> </td> </tr> <!-- END no_post --> <tr align="right"> <td class="catBottom" colspan="3" height="28"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="9%" class="noprint"> </td> <td align="center" nowrap="nowrap" class="t-title"><a name="bottomtitle"></a><h1 class="cattitle">{TOPIC_TITLE}</h1></td> <td align="right" nowrap="nowrap" width="9%" class="browse-arrows"><a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a> <a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a> <a href="#top">{L_BACK_TO_TOP}</a> </td> </tr> </table> </td> </tr> </table>
<table class="forumline noprint" width="100%" border="0" cellspacing="1" cellpadding="0"> <tr> <td class="row2" valign="top" {COLSPAN_PAGINATION} width="150"><span class="gensmall">{PAGE_NUMBER}</span></td> <!-- BEGIN topicpagination --> <td class="row1" align="right" valign="top" ><span class="gensmall">{PAGINATION}</span></td> <!-- END topicpagination --> </tr> <!-- BEGIN switch_user_logged_in --> <!-- BEGIN watchtopic --> <tr> <td class="row2" colspan="2" align="right" valign="top"><span class="gensmall">{S_WATCH_TOPIC}</span></td> </tr> <!-- END watchtopic --> <!-- END switch_user_logged_in --> <tr> <td class="row2" colspan="2" align="center" style="padding:0px"> <!-- BEGIN switch_user_logged_in --> <a name="quickreply"></a> {QUICK_REPLY_FORM}<br /> <!-- END switch_user_logged_in --> </td> </tr> <tr> <td style="margin:0; padding: 0;" colspan="2"> <table border="0" cellpadding="0" width="100%" cellspacing="0" id="info_open" style="display:''"> <tbody> <!-- BEGIN show_permissions --> <tr> <td class="row2" valign="top" width="25%"><span class="gensmall">{L_TABS_PERMISSIONS}</span></td> <td class="row1" valign="top" width="75%"><span class="gensmall">{S_AUTH_LIST}</span></td> </tr> <!-- END show_permissions --> <tr> <td class="catBottom" colspan="2" height="28"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td valign="middle" width="100%"><span class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_SEP}<a class="nav" href="{U_ALBUM}">{L_ALBUM}</a>{NAV_CAT_DESC_SECOND}</span></td> <!-- BEGIN show_permissions --> <td align="right" valign="middle"><span class="gensmall"><a href="javascript:ShowHideLayer('info_open','info_close');"><img src="{TABS_LESS_IMG}" alt="-" align="middle" border="0" /></a></span></td> <!-- END show_permissions --> </tr> </table> </td> </tr> </tbody> </table> </td> </tr> <tr> <td style="margin:0; padding: 0;" colspan="2"> <table border="0" cellpadding="0" cellspacing="0" width="100%" id="info_close" style="display:none;"> <tbody> <tr> <td class="catBottom" colspan="2" height="28"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td valign="middle" width="100%"><span class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_SEP}<a class="nav" href="{U_ALBUM}">{L_ALBUM}</a>{NAV_CAT_DESC_SECOND}</span></td> <td align="right" valign="middle"><span class="gensmall"><a href="javascript:ShowHideLayer('info_open','info_close');"><img src="{TABS_MORE_IMG}" alt="+" align="middle" border="0" /></a></span></td> </tr> </table> </td> </tr> </tbody> </table> </td> </tr> </table>
<form action="{S_JUMPBOX_ACTION}" method="get" name="jumpbox" onsubmit="if(document.jumpbox.f.value == -1){return false;}"> <table class="noprint" width="100%" border="0" cellspacing="2" cellpadding="0" align="center"> <tr> <td align="left" valign="middle" nowrap="nowrap" {WIDTH_GALLERY}> <span class="nav"> <!-- BEGIN switch_user_authpost --> <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" id="{POST_IMG_ID}Newtopic" alt="{L_POST_NEW_TOPIC}" align="middle" border="0" /></a> <!-- END switch_user_authpost --> <!-- BEGIN switch_user_authreply --> <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" alt="{L_POST_REPLY_TOPIC}" align="middle" border="0" /></a> <!-- END switch_user_authreply --> </span> </td> <!-- BEGIN viewtopic_bottom --> <td align="right" nowrap="nowrap"><span class="gensmall">{L_JUMP_TO}: {S_JUMPBOX_SELECT} <input class="liteoption" type="submit" value="{L_GO}" /></span></td> <!-- END viewtopic_bottom --> <!-- BEGIN moderation_panel --> <td align="center"> <span class="gensmall">{moderation_panel.U_YOUR_PERSONAL_MODERATE}</span> </td> <td align="center" width="250"> <span class="gensmall"> </span> </td> <!-- END moderation_panel --> </tr> </table> </form>
<!-- BEGIN viewtopic_bottom --> <table class="noprint" width="100%" border="0" cellspacing="2" cellpadding="0" align="center"> <tr> <td colspan="2" align="left" valign="top" nowrap="nowrap"><br />{S_TOPIC_ADMIN}<br /> <form name="action" method="get" action="{S_FORM_MOD_ACTION}"> <input type="hidden" name="t" value="{TOPIC_ID}" /> <input type="hidden" name="sid" value="{S_SID}" /> <span class="gen">{L_MOD_TOOLS}<br />{S_SELECT_MOD} <input class="liteoption" type="submit" value="{L_GO}" /></span> </form> </td> </tr> </table> <!-- END viewtopic_bottom -->
<!-- BEGIN switch_image_resize --> <script type="text/javascript"> //<![CDATA[ $(resize_images({ 'selector' : '.postbody', 'max_width' : {switch_image_resize.IMG_RESIZE_WIDTH}, 'max_height' : {switch_image_resize.IMG_RESIZE_HEIGHT} })); //]]> </script> <!-- END switch_image_resize -->
<script type="text/javascript" src="{JS_DIR}addthis/addthis_widget.js?pub=forumotion"></script> css - Code:
-
/* ONGLETS */ /* .systab .tab => les onglet */ .systab .tab { display:inline-block; padding:3px; cursor:pointer; background-color: #f3f3f3; border: 1px solid #c0c0c0; letter-spacing: -1px; padding-bottom: 3px; padding-top: px; margin-top: 2px; cursor: pointer;} /* .systab .tab:hover => les onglets survolés */ .systab .tab:hover { background: #b8efa1; color: #487f31; border-color: #487f31;} /* .systab .tab.selected => les onglets sélectionnés */ .systab .tab.selected{ color: #ccc; background: #333;} /* .systab .contents => les conteneurs des contenus associés aux onglets */ .systab .contents { background-color: transparent; margin-top:-1px; padding:5px; display:none; text-align: justify; font-size: 11px; font-family: DejaVu Sans; } /* style des onglets si ils sont à gauche ou à droite */ .systab.s_float .tab,.systab.s_float .tab { display: block; margin: 5px; } /* flottement des conteneurs si les onglets sont à gauche où à droite */ .systab.s_float .tabs,.systab.s_float .contents { float: left;} et enfin JS - Code:
-
$(function () { var d = function () { if ($(this).is(".selected")) return; var a = $(this).closest(".systab"); a.find(".selected").removeClass("selected").filter(".content")[a.is(".s_slide") ? "slideUp" : a.is(".s_fade") ? "fadeOut" : "hide"](+((a.attr("class") || "").match(/^[sS]*(?:^|s)s_trans([0-9]+)(?:s|$)[sS]*$/) || ["", 500])[1]); $(this).addClass("selected").data("content").addClass("selected").stop(!0, !0)[a.is(".s_slide") ? "slideDown" : a.is(".s_fade") ? "fadeIn" : "show"](+((a.attr("class") || "").match(/^[sS]*(?:^|s)s_trans([0-9]+)(?:s|$)[sS]*$/) || ["", 500])[1]) }; $("div.systab").each(function () { var a = $("> div", this).detach(), c = [], b; $(this).html('<div class="' + ($(this).is(".s_bottom") ? "contents" : "tabs") + '"></div><div class="' + ($(this).is(".s_bottom") ? "tabs" : "contents") + '"></div>'); $(a).each(function () { b = $(this).children(":first"); b.is("span") ? (c = $(c).add($(b).addClass("tab").data("content", $(this))), $(this).addClass("content").data("tab", b)) : $(this).remove() }); $("> div.tabs", this).append(c); $("> div.contents", this).append(a); b = $(".content:first,.content.selected", this).last(); $(b).addClass("selected").siblings().hide(); $(b).data("tab").addClass("selected") }).on("click", ".tab", d).filter(".s_hover").on("mouseenter", ".tab", d) }); Merci beaucoup de t'occuper de mon cas ^^ | | |
| | | 'Christa
Lostmindy
Messages : 2856
| Hum, c'est peut-être à cause du div avec profilentour ? Retire ça et essaie d'utiliser un code aussi "basique" que possible, pour voir ? | | |
| | | jamie.
{ Membre }
Messages : 17
| Toujours pas :l Du coup je reposte comme j'en ai profité pour retirer le afficher/masquer - Code:
-
<div class="systab"> <div> <span>Profil</span> <!-- BEGIN profile_field --> <span id="delf2" class="profile_field">{postrow.displayed.profile_field.LABEL}</span> {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR} <script type="text/javascript"> jQuery('#delf2').html(jQuery('#delf2').html().replace(/: /g,'— ')).removeAttr('id'); </script> <!-- END profile_field --> </div> <div> <span>Petit plus</span> <div align="left">{postrow.displayed.POSTER_RPG}</div> </div> </div> | | |
| | | Espeon
Administrateur
Messages : 1819
| Bonjour Jamie, Ce script me parle tout à fait parce-qu'il me semble l'avoir déjà traité un jour. Et après quelques recherches dans mes souvenirs, voici le problème résolu[ qui mettait en jeu ce script. Concrètement, il est résolu dans mon dernier message de la première page. Je te suggère de regarder le code proposé et de le comparer avec le tien. De même, vérifie que tu place le JS au bon endroit (mais il me semble que oui). J'espère que cela saura te dépanner. Sinon et si tu as des questions / des choses que tu ne comprends pas, n'hésites pas à demander | | |
| | | jamie.
{ Membre }
Messages : 17
| - Code:
-
<div class="systab s_slide"> <div> <span>En profil</span> <div class="postdetailinfo"> <!-- BEGIN profile_field --> {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR} <!-- END profile_field --></div> </div> <div> <span>En +</span> <div class="postdetailinfo"> {postrow.displayed.POSTER_RPG}</div> </div> <div> <span>Contact</span> <div class="postdetailinfo"> <br /> <center>{postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} <br /><br /> {postrow.displayed.EMAIL_IMG} {postrow.displayed.contact_field.CONTENT}<br /><br /></center> </div> </div> </div> est-ce bien l'unique changement me concernant dans ce template ? si oui, et bien... sans résultat :l (j'ai également changé le JS) EDIT: Voici mon template | | |
| | | Espeon
Administrateur
Messages : 1819
| Bon, alors après quelques tests ce n'est pas le script ni la structure qui semble poser problème.
En revanche, pourrais-je avoir ton CSS par hasard ? Je pense qu'il y a quelques propriétés qui ne vont pas de ce côté là pour commencer (un display: none; qui ne devrait pas exister dans .systab .contents ). | | |
| | | jamie.
{ Membre }
Messages : 17
| Les onglets sont toute à la fin | | |
| | | Espeon
Administrateur
Messages : 1819
| Bon alors effectivement comme je viens de le soulever il faudrait supprimer le display: none; qui est contenu dans le sélecteur .systab .contents vu que en gros, ça masquera toujours tes onglets. Mais cela ne résoudra pas le soucis, or en isolant le code HTML/CSS/JS dont tu dispose (et en corrigeant le point ci-dessus), cela fonctionne. Ce qui veut dire que le problème vient d'ailleurs dans ton environnement... C'est donc un peu plus complexe et il faut que j'investigue... Résout déjà ce soucis de CSS pour commencer | | |
| | | jamie.
{ Membre }
Messages : 17
| Fait ! Donc en effet, ça ne fonctionne pas mais on voit le profil haha Aurais-tu besoin d'autres chose ? Tous mes templates modifiés par exemple ? | | |
| | | Melone
{ Modérateur }
Messages : 805
| Bonsoir, Ton problème est-il toujours d'actualité ? Merci de donner une réponse dans un délai de quatre jours sinon ton sujet sera archivé et verrouillé ! Bonne soirée, | | |
| | | jamie.
{ Membre }
Messages : 17
| Bonsoir, oui, mon problème est toujours d'actualité. Merci de la relance et bonne soirée à toi | | |
| | | Melone
{ Modérateur }
Messages : 805
| Bonsoir !
Le problème est-il toujours d'actualité ? Merci de relancer de temps en temps si tu n'obtiens pas de réponse. D'ici quatre jours, si tu ne réponds pas le sujet sera archivé !
Bonne soirée. | | |
| | | jamie.
{ Membre }
Messages : 17
| | | | Espeon
Administrateur
Messages : 1819
| Désolé de ce délai de réponse extrêmement long tout d'abord. Ensuite, j'ai du mal à comprendre pourquoi ce bug existe... Cela doit s'agir d'un problème de timing (bien que je n'en ai pas l'impression) ou bien d'une erreur lors de l'exécution qui empêche le bon déroulement de la fin du script... Je n'ai pas plus investigué mais tu pourrais essayer de remplacer cette partie du JS : - Code:
-
$("div.systab").each(function() { var a = $("> div", this).detach(), c = [], b; $(this).html('<div class="' + ($(this).is(".s_bottom") ? "contents" : "tabs") + '"></div><div class="' + ($(this).is(".s_bottom") ? "tabs" : "contents") + '"></div>'); $(a).each(function() { b = $(this).children(":first"); b.is("span") ? (c = $(c).add($(b).addClass("tab").data("content", $(this))), $(this).addClass("content").data("tab", b)) : $(this).remove() }); $("> div.tabs", this).append(c); $("> div.contents", this).append(a); b = $(".content:first,.content.selected", this).last(); $(b).addClass("selected").siblings().hide(); $(b).data("tab").addClass("selected") }).on("click", ".tab", d).filter(".s_hover").on("mouseenter", ".tab", d) Par ceci : - Code:
-
$("div.systab").each(function() { var a = $("> div", this).detach(), c = [], b; $(this).html('<div class="' + ($(this).is(".s_bottom") ? "contents" : "tabs") + '"></div><div class="' + ($(this).is(".s_bottom") ? "tabs" : "contents") + '"></div>'); $(a).each(function() { b = $(this).children(":first"); b.is("span") ? (c = $(c).add($(b).addClass("tab").data("content", $(this))), $(this).addClass("content").data("tab", b)) : $(this).remove() }); $("> div.tabs", this).append(c); $("> div.contents", this).append(a); b = $(".content:first,.content.selected", this).last(); $(b).addClass("selected").siblings().hide(); $(b).data("tab").addClass("selected") }); $("div.systab").on("click", ".tab", d).filter(".s_hover").on("mouseenter", ".tab", d); Je ne pense pas que ça change grand chose (a priori ça ne devrait pas) mais au stade où l'on en est... | | |
| | | jamie.
{ Membre }
Messages : 17
| Encore et toujours rien.. :l Aucun souci pour l'attente, tu as une vie en dehors ^^ | | |
| | | Espeon
Administrateur
Messages : 1819
| Hmmmm es-tu bien sûr que ton script est bon ? De mon point de vue j'ai une erreur, est-ce-que tu pourrais remplacer ton code actuel par très exactement celui-ci et voir ce que ça donne : - Code:
-
$(function () { var d = function () { if ($(this).is(".selected")) return; var a = $(this).closest(".systab"); a.find(".selected").removeClass("selected").filter(".content")[a.is(".s_slide") ? "slideUp" : a.is(".s_fade") ? "fadeOut" : "hide"](+((a.attr("class") || "").match(/^[sS]*(?:^|s)s_trans([0-9]+)(?:s|$)[sS]*$/) || ["", 500])[1]); $(this).addClass("selected").data("content").addClass("selected").stop(!0, !0)[a.is(".s_slide") ? "slideDown" : a.is(".s_fade") ? "fadeIn" : "show"](+((a.attr("class") || "").match(/^[sS]*(?:^|s)s_trans([0-9]+)(?:s|$)[sS]*$/) || ["", 500])[1]) }; $("div.systab").each(function () { var a = $("> div", this).detach(), c = [], b; $(this).html('<div class="' + ($(this).is(".s_bottom") ? "contents" : "tabs") + '"></div><div class="' + ($(this).is(".s_bottom") ? "tabs" : "contents") + '"></div>'); $(a).each(function () { b = $(this).children(":first"); b.is("span") ? (c = $(c).add($(b).addClass("tab").data("content", $(this))), $(this).addClass("content").data("tab", b)) : $(this).remove() }); $("> div.tabs", this).append(c); $("> div.contents", this).append(a); b = $(".content:first,.content.selected", this).last(); $(b).addClass("selected").siblings().hide(); $(b).data("tab").addClass("selected") }); $("div.systab").on("click", ".tab", d).filter(".s_hover").on("mouseenter", ".tab", d); }); | | |
| | | jamie.
{ Membre }
Messages : 17
| ça fonctionne à merveille ! Merci beaucoup pour ta patience et ton aide | | |
| | | Espeon
Administrateur
Messages : 1819
| De rien, pas de soucis et bonne journée à toi | | |
| | | Melone
{ Modérateur }
Messages : 805
| | | | Contenu sponsorisé
| | | | | [résolu] Profil en onglets | |
|
Sujets similaires | |
|
| Permission de ce forum: | Vous ne pouvez pas répondre aux sujets dans ce forum
| |
| |
| |
|
| Partenaires Or
|