Slide user information

DailyTeens at 13h43
08
Jan
2012
So I'm using PunBB, and I want to add a javascript code or something like that, with wich you can hide user information. By making a simple click on a button wich is placed by the username in topics. ( Something like the sign on the left of the forum. So just to let you know I'm using a customized viewtopic_body template.
Link to my forum : blink-design.forumotion.in
Reply
1 !_NICK_!, on 10/01/2012 at 02h23
What you said seems to me like a Statement. Would you tell us your question?
2 Codyy, on 10/01/2012 at 02h27
I understand what you're trying to say, after reading it 5 times. Razz


This will help you: /t78898-show-hide-widgets-script
3 DailyTeens, on 12/01/2012 at 22h06
All I wanted to tell you is that I want to hide and show that information under your avatar.
4 Codyy, on 13/01/2012 at 00h23
Okay, you need to be much more specific in your posts when asking for help. We have no clue what to help you with, any other way.

You'll need to wait for someone who knows the script to do that.
5 Rideem3, on 13/01/2012 at 00h47
I'll write a quick code up for you Wink

Edit:
Okay, first go to Admin Panel -> Modules -> Javascript Codes Management

Create new and click "In the topics" only!
Now paste:
Code:
jQuery(function() {
jQuery('.pun .postmain .user-basic-info').after('<input type="button" value="Hide Stats" onclick="hidestats()" style="cursor: pointer;" id="hidestats" /><input type="button" value="Show Stats" onclick="showstats()" style="display: none; cursor: pointer;" id="showstats" />');
});

function hidestats() {
jQuery('.pun .postmain .user-info').hide('slow');
document.getElementById('hidestats').style.display = "none";
document.getElementById('showstats').style.display = "block";
}

function showstats() {
jQuery('.pun .postmain .user-info').show('slow');
document.getElementById('showstats').style.display = "none";
document.getElementById('hidestats').style.display = "block";
}


And click save!
6 DailyTeens, on 13/01/2012 at 21h02
It works Smile thank you.
I just want to replace the button with ordinary text Smile)
But txn Very Happy
7 Rideem3, on 13/01/2012 at 21h19
For text, replace the .after with:
Code:
.after('<a onlick="hidestats()" href="#">Hide Stats</a><a href="#" onlick="showstats()" style="display: none;">Show Stats</a>');
8 APE, on 13/01/2012 at 21h23
will this work for other forums aswell ?
9 DailyTeens, on 13/01/2012 at 21h39
Yes It will Smile
BTW If I choose to hide stats on the first post then I gotta show It from the first one too, on the button from the other members that posted there It just won't hide/show.
10 APE, on 13/01/2012 at 21h47
i added that code to my site and it dont work :Sad
11 Rideem3, on 13/01/2012 at 22h25
No, the code I have only works for punBB Wink
12 DailyTeens, on 14/01/2012 at 11h56
BTW If I choose to hide stats on the first post then I gotta show It from the first one too, on the button from the other members that posted there It just won't hide/show.
13 LGforum, on 14/01/2012 at 15h10
Rideem3 that would be a VERY long way and uneccessary way of doing that.

It can be done with a simple template edit.

So find this in your view_topic template:
Code:


      <div class="user-info">
         {postrow.displayed.ONLINE_IMG}
            <!-- BEGIN profile_field -->
               {postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
            <!-- END profile_field -->
               {postrow.displayed.POSTER_RPG}
      </div>


And right above it put this:
Code:

 <div>
    <div onclick="jQuery(this.parentNode.nextSibling).slideToggle();jQuery('.togglestats').toggle();" class="togglestats">Show Stats</div>
      <div onclick="jQuery(this.parentNode.nextSibling).slideToggle();jQuery('.togglestats').toggle();" class="togglestats"style="display:none">Hide Stats</div>
  </div>


And your done. This will toggle the information under each member individually.

Where it says 'Hide Stats' and 'Show Stats' you can replace with your images.
14 xiaomah01, on 14/01/2012 at 16h17
LGforum wrote:

And your done. This will toggle the information under each member individually.

Where it says 'Hide Stats' and 'Show Stats' you can replace with your images.


good job LG Very good
15 Rideem3, on 14/01/2012 at 16h37
LGforum wrote:Rideem3 that would be a VERY long way and uneccessary way of doing that.

It can be done with a simple template edit.

So find this in your view_topic template:
Code:


      <div class="user-info">
         {postrow.displayed.ONLINE_IMG}
            <!-- BEGIN profile_field -->
               {postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
            <!-- END profile_field -->
               {postrow.displayed.POSTER_RPG}
      </div>


And right above it put this:
Code:

 <div>
    <div onclick="jQuery(this.parentNode.nextSibling).slideToggle();jQuery('.togglestats').toggle();" class="togglestats">Show Stats</div>
      <div onclick="jQuery(this.parentNode.nextSibling).slideToggle();jQuery('.togglestats').toggle();" class="togglestats"style="display:none">Hide Stats</div>
  </div>


And your done. This will toggle the information under each member individually.

Where it says 'Hide Stats' and 'Show Stats' you can replace with your images.


Haha I just wrote a quick code Razz
Your code is better and more efficient Smile
16 DailyTeens, on 14/01/2012 at 20h53
Thanks, you can lock this topic now Smile
17 Nera., on 14/01/2012 at 21h01
Topic Solved & Locked
Similar topics
How can I center user information in posts?
*Hope this is in the right forum. How can I center the user information (name, avatar, rank, post count, etc) in the posts in my forum? They're currently all aligned to the left. If it helps, my forum is here http://mibbamag.niceboards.org/ and my
Purge old content Data
Well, after 6 days, Media Companion has finished scraping my movies (I have 4TB, about 5000 files). I am running the latest release of XMBC on a softmodded xbox. The original xbox scrape of my files returned some errors. Similarly named movies
[Solved] Slide bar and scrolling text.
Hello, I have this code Code: <div style='width:200px; height:360px; background:url(http://i55.tinypic.com/117v2b7.png); padding-top: 60px; padding-left:15px;'><div style='text-align:justify; width:
Replies 1 to 17 on 17 for "Slide user information"
Reply
See also
more_less
Informations

17 Replies For the topic :
"Slide user information"

This topic has been viewed 1034 times.

Last message :
08/01/2012 at 13h43 by "DailyTeens"