Profil suivant le défilement du sujet

par Kalyta Mar 17 Aoû 2021 - 18:06

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : https://testpourddc.forumactif.com/

Description du problème

Bonjour ^^

Je suis tombée sur ce tutoriel qui, si j'ai bien compris, permet au profil des messages de suivre la souris (comme sur ce forum pour donner un point de comparaison).

Hélas je n'arrive pas à appliquer le javascript sur le template, je ne vois pas où mettre les balises exactement. Je vous met le template ci-dessous, si besoin ^^

template viewtopic_body:

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(){ if(typeof(_atc) == "undefined") { _atc = { }; } }); var hiddenMsgLabel = { visible:'{JS_HIDE_HIDDEN_MESSAGE}', hidden:'{JS_SHOW_HIDDEN_MESSAGE}' }; showHiddenMessage = function(id) { try { var regId = parseInt(id, 10); if( isNaN(regId) ) { regId = 0; } if( regId > 0) { $('.post--' + id).toggle(0, function() { if( $(this).is(":visible") ) { $('#hidden-title--' + id).html(hiddenMsgLabel.visible); } else { $('#hidden-title--' + id).html(hiddenMsgLabel.hidden); } }); } } catch(e) { } return false; }; //]]> </script> <div class="nouveau_repondre">  <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>   <a href="{U_POST_REPLY_TOPIC}"> <img src="{REPLY_IMG}" id="i_reply" alt="{L_POST_REPLY_TOPIC}" align="middle" border="0" /> </a>  </div> <div class="fil_ariane"> <a class="nav" href="{U_INDEX}"> <span> {L_INDEX} </span> </a>  {NAV_CAT_DESC_SECOND} <div class="pagination_affichage_sujet">  {PAGINATION}  </div> </div> <table class="affichage_sujets" width="100%" border="0" cellspacing="1" cellpadding="0" > <tr> <td class="header_sujet" colspan="2" height="28"> <h1> {TOPIC_TITLE} </h1> </td> </tr> {POLL_DISPLAY}   <tr> <td class="postdetails {postrow.hidden.ROW_CLASS}" colspan="2" align="center">{postrow.hidden.MESSAGE}</td> </tr>   <div class="profil_coulissant"> <tr><td colspan="2"><div class="as_infos"> {L_POST_SUBJECT}: {postrow.displayed.POST_SUBJECT} {postrow.displayed.POST_DATE} </div></td></tr> <tr class="post post--{postrow.displayed.U_POST_ID}" id="p{postrow.displayed.U_POST_ID}" style="{postrow.displayed.DISPLAYABLE_STATE}"> <td {postrow.displayed.THANK_BGCOLOR} valign="top" class="as_profil"> <div class="as_profil_content"> <a name="{postrow.displayed.U_POST_ID}" style="position: relative; top: -30px; width: 1px;" id="{postrow.displayed.U_POST_ID}"></a> <div class="as_pseudo"> {postrow.displayed.POSTER_NAME} </div> <div class="as_rang"> {postrow.displayed.POSTER_RANK} </div> <div class="as_avatar"> {postrow.displayed.POSTER_AVATAR} </div> <div class="as_contenu_profil">  {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}  {postrow.displayed.POSTER_RPG} </div> </div> <div class="as_options"> {postrow.displayed.QUOTE_IMG} {postrow.displayed.EDIT_IMG} {postrow.displayed.DELETE_IMG} </div> </td> <td {postrow.displayed.THANK_BGCOLOR} valign="top" width="100%" height="28"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td colspan="2">  <div class="vote gensmall">  <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}">+</a></div>   <div class="vote-bar" title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}">  <div class="vote-bar-plus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;"></div>   <div class="vote-bar-minus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div>  </div>   <div title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}" class="vote-no-bar">----</div>   <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}">-</a></div>  </div>  <div class="postbody"> <div class="content_message">{postrow.displayed.MESSAGE}</div>  <dl class="attachbox"> <dt>{postrow.displayed.switch_attachments.L_ATTACHMENTS}</dt> <dd>  <dl class="file"> <dt> <img src="{postrow.displayed.switch_attachments.switch_post_attachments.U_IMG}" alt="" />  <a class="postlink" href="{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.U_ATTACHMENT}">{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT}</a> {postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT_DEL}   {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT} {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT_DEL}  </dt>  <dd> <em>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_comment.ATTACHMENT_COMMENT}</em> </dd>   <dd> <em><strong>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.TEXT_NO_DL}</strong></em> </dd>  <dd>({postrow.displayed.switch_attachments.switch_post_attachments.FILE_SIZE}) {postrow.displayed.switch_attachments.switch_post_attachments.NB_DL}</dd> </dl>  </dd> </dl>  <div class="clear"></div>  <div class="signature_div"> {postrow.displayed.SIGNATURE} </div>  </div> <span class="gensmall">{postrow.displayed.EDITED_MESSAGE}</span> </td> </tr> </table> </td> </tr> <tr class="post--{postrow.displayed.U_POST_ID}" style="{postrow.displayed.DISPLAYABLE_STATE}"> </tr>  </table> <table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">  </div>    <tr align="center"> <td colspan="2" height="28"> <span class="genmed">{no_post.L_NO_POST}</span> </td> </tr>  </table>    <table id="forum_rules" class="forumline" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin: 1px 0px 1px 0px"> <tbody> <tr> <td class="catBottom"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td valign="top"> <div class="cattitle"> {L_FORUM_RULES}</div> </td> </tr> </tbody> </table> </td> </tr> <tr> <td class="row1 clearfix"> <table> <tr>  <td class="logo"> <img src="{RULE_IMG_URL}" alt="" /> </td>  <td class="rules postbody"> {RULE_MSG} </td> </tr> </table> </td> </tr> </tbody> </table>  <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td colspan="2" align="center" style="padding:0px">  <a name="quickreply"></a> {QUICK_REPLY_FORM}<br />  </td> </tr> </table> <div class="fil_ariane"> <a class="nav" href="{U_INDEX}"> <span> {L_INDEX} </span> </a>  {NAV_CAT_DESC_SECOND} <div class="pagination_affichage_sujet">  {PAGINATION}  </div> </div> <div class="nouveau_repondre">  <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>   <a href="{U_POST_REPLY_TOPIC}"> <img src="{REPLY_IMG}" alt="{L_POST_REPLY_TOPIC}" align="middle" border="0" /> </a>  </div> <div class="as_options_sujet">   {S_WATCH_TOPIC}   <div class="as_moderer"> {S_AUTH_LIST} </div> </div> <table> <tr>  <td align="center"> <span class="gensmall">{moderation_panel.U_YOUR_PERSONAL_MODERATE}</span> </td> <td align="center" width="250"> <span class="gensmall"> </span> </td>  </tr> </table>  <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="{SECURE_ID_NAME}" value="{SECURE_ID_VALUE}" /> <span class="gen">{L_MOD_TOOLS}<br />{S_SELECT_MOD} <input class="liteoption" type="submit" value="{L_GO}" /></span> </form> </td> </tr> </table>   <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>  <script src="//s7.addthis.com/js/300/addthis_widget.js#pubid=forumotion" type="text/javascript"></script>

Merci beaucoup pour votre aide Smile

par Neptunia Mar 17 Aoû 2021 - 18:27

Bonjour Kalyta, et bienvenue sur le Forum des Forums Forumactif

Non testé, mais essayez avec ce code javascript actif sur les sujets en lieu et place de celui de no_way

Code:: $(window).scroll(function(){ var yW=$(window).scrollTop(),pC=$("div.as_profil_content"),c=false,lt=$("#fa_toolbar").length&&30-Math.abs(parseInt($("#fa_toolbar").css('margin-top'))); var dC=pC.map(function(i,e){ var e=$(e),diffY=(yW+lt)-e.parent().offset().top,o={el:e,hM:e.parent().height()-e.height(),dY:diffY}; e.css({"margin-top":0}); !c?(c=o):o.dY>=0&&o.dY<c.dY?(c=o):null; }); c.el.css({"margin-top":Math.max(0,Math.min(c.hM,c.dY))}) });

Edité à 18:39 !
Le script se base sur la toolbar, hors cette dernière n'est pas activée sur votre forum. Pas certaine que ça fonctionne du coup.

par Kalyta Mar 17 Aoû 2021 - 19:12

Merci Neptunia pour cette réponse rapide ^^

J'ai activé la toolbar dans module > toolbar. Le profil ne défile pas, par contre j'ai un effet "vibration" quand je remonte la page en partant du bas.