The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

How to show/hide who is online?

3 posters

Go down

Solved How to show/hide who is online?

Post by iamthestreets 17/1/2012, 21:12

How can I add a show/hide button for "who is online?" section?


Last edited by iamthestreets on 17/1/2012, 22:47; edited 1 time in total
avatar
iamthestreets
Forumember

Posts : 114
Reputation : 1
Language : English

http://www.mystreetlife.forumotion.com/

Back to top Go down

Solved Re: How to show/hide who is online?

Post by iamthestreets 17/1/2012, 21:51

Rideem3 wrote:Do you want to automatically hide it, and then have a button to show it?

Or do you want to show it a add a button that will hide it?

Automatically hide it, and then have a button to show it.
avatar
iamthestreets
Forumember

Posts : 114
Reputation : 1
Language : English

http://www.mystreetlife.forumotion.com/

Back to top Go down

Solved Re: How to show/hide who is online?

Post by LGforum 17/1/2012, 22:21

This:

Code:

<script type="text/javascript">
  function showstats() {
  $(document).ready(function() {
  $('.hiddenstat').show('slow');
  });
  document.getElementById('showS').style.display = "none";
  document.getElementById('hideS').style.display = "inline-block";
  }
 
  function hidestats() {
  $(document).ready(function() {
  $('.hiddenstat').hide('slow');
  });
  document.getElementById('showS').style.display = "inline-block";
  document.getElementById('hideS').style.display = "none";
  }
</script>

Can be shortened to this:

Code:

<script type="text/javascript">
function togglestats() {
  var x=document.getElementById('showS').style.display = "none";
  if (x.style.display!='none') {
    $('.hiddenstat').show('slow');
    x.style.display = "none";
    document.getElementById('hideS').style.display = "inline-block";
 } else {
    $('.hiddenstat').hide('slow');
    x.style.display = "inline-block";
    document.getElementById('hideS').style.display = "none";
}
</script>

Which would mean changing this:
Code:

<input type="button" value="Show Statistics" onclick="showstats()" id="showS"/><input style="display: none;" type="button" value="Hide Statistics" onclick="hidestats()" id="hideS" /></span>
      <!-- END switch_viewonline_link -->

to this:
Code:

<input type="button" value="Show Statistics" onclick="togglestats()" id="showS"/><input style="display: none;" type="button" value="Hide Statistics" onclick="togglestats()" id="hideS" /></span>
      <!-- END switch_viewonline_link -->

less code = better Wink
A toggling function is better than having two seperate function. Also, you don't need to start a jQuery function within a Javascript function as this function does not require the DOM to be loaded. (well it does, but it will only execute on click ... so it doesn't)
LGforum
LGforum
Hyperactive

Male Posts : 2265
Reputation : 264
Language : English
Location : UK

Back to top Go down

Solved Re: How to show/hide who is online?

Post by iamthestreets 17/1/2012, 22:27

This is what it shows:
How to show/hide who is online? Show_b10

This is what it shows when I click the button:
How to show/hide who is online? Hide_b10

All it does is change the text of the button.

The second code LGForum gave me doesn't do anything and it takes away the who is online? text.
How to show/hide who is online? Lgforu10

I like the first code better but its not working 100%, but i will use either one if it show the who is online? text


Last edited by iamthestreets on 17/1/2012, 22:29; edited 1 time in total
avatar
iamthestreets
Forumember

Posts : 114
Reputation : 1
Language : English

http://www.mystreetlife.forumotion.com/

Back to top Go down

Solved Re: How to show/hide who is online?

Post by LGforum 17/1/2012, 22:30

iamthestreets wrote:This is what it shows:

The second code LGForum gave me doesn't do anything and it takes away the who is online?

Lol woops. Thats because there was a slight silly error in it. It should have been this:

Code:

       
        <script type="text/javascript">
        function togglestats() {
          var x=document.getElementById('showS');
          if (x.style.display!='none') {
            $('.hiddenstat').show('slow');
            x.style.display = "none";
            document.getElementById('hideS').style.display = "inline-block";
        } else {
            $('.hiddenstat').hide('slow');
            x.style.display = "inline-block";
            document.getElementById('hideS').style.display = "none";
        }}
        </script>

EDIT: this code above now works perfectly.


Last edited by LGforum on 17/1/2012, 22:32; edited 1 time in total
LGforum
LGforum
Hyperactive

Male Posts : 2265
Reputation : 264
Language : English
Location : UK

Back to top Go down

Solved Re: How to show/hide who is online?

Post by iamthestreets 17/1/2012, 22:32

Rideem3 wrote:Actually, the reason why it's displaying the birthday is because it's displayed as a PHP variable. For some reason I can't give it the class I gave the others. Wink

That I don't mind showing, but when i click the button to show statistics it does nothing.
(if you could hide the birthday info that would be cool too)
avatar
iamthestreets
Forumember

Posts : 114
Reputation : 1
Language : English

http://www.mystreetlife.forumotion.com/

Back to top Go down

Solved Re: How to show/hide who is online?

Post by iamthestreets 17/1/2012, 22:34

LGforum wrote:
iamthestreets wrote:This is what it shows:

The second code LGForum gave me doesn't do anything and it takes away the who is online?

Lol woops. Thats because there was a slight silly error in it. It should have been this:

Code:

       
        <script type="text/javascript">
        function togglestats() {
          var x=document.getElementById('showS');
          if (x.style.display!='none') {
            $('.hiddenstat').show('slow');
            x.style.display = "none";
            document.getElementById('hideS').style.display = "inline-block";
        } else {
            $('.hiddenstat').hide('slow');
            x.style.display = "inline-block";
            document.getElementById('hideS').style.display = "none";
        }}
        </script>

EDIT: this code above now works perfectly.

Thanks it worked, but is there any way to put the "Who is Online?" text back?

This it what it shows as now:
How to show/hide who is online? Lgforu10

Can it show like this:
How to show/hide who is online? Show_b10

And is there any way possible to remove the birthday info?
avatar
iamthestreets
Forumember

Posts : 114
Reputation : 1
Language : English

http://www.mystreetlife.forumotion.com/

Back to top Go down

Solved Re: How to show/hide who is online?

Post by LGforum 17/1/2012, 22:39

You can remove the birthday info by adding this in the CSS:
Code:

.hiddenstat+tr{display:none;}

To toggle it with the rest of the stuff add this to the script:
Code:

$( $('.hiddenstat')[1].nextSibling ).toggle();

underneath where it says:
function togglestat() {


Last edited by LGforum on 17/1/2012, 22:42; edited 1 time in total
LGforum
LGforum
Hyperactive

Male Posts : 2265
Reputation : 264
Language : English
Location : UK

Back to top Go down

Solved Re: How to show/hide who is online?

Post by iamthestreets 17/1/2012, 22:41

iamthestreets wrote:
LGforum wrote:
iamthestreets wrote:This is what it shows:

The second code LGForum gave me doesn't do anything and it takes away the who is online?

Lol woops. Thats because there was a slight silly error in it. It should have been this:

Code:

       
        <script type="text/javascript">
        function togglestats() {
          var x=document.getElementById('showS');
          if (x.style.display!='none') {
            $('.hiddenstat').show('slow');
            x.style.display = "none";
            document.getElementById('hideS').style.display = "inline-block";
        } else {
            $('.hiddenstat').hide('slow');
            x.style.display = "inline-block";
            document.getElementById('hideS').style.display = "none";
        }}
        </script>

EDIT: this code above now works perfectly.

Thanks it worked, but is there any way to put the "Who is Online?" text back?

This it what it shows as now:
How to show/hide who is online? Lgforu10

Can it show like this:
How to show/hide who is online? Show_b10

And is there any way possible to remove the birthday info?

I figured this out.
avatar
iamthestreets
Forumember

Posts : 114
Reputation : 1
Language : English

http://www.mystreetlife.forumotion.com/

Back to top Go down

Solved Re: How to show/hide who is online?

Post by iamthestreets 17/1/2012, 22:43

LGforum wrote:You can remove the birthday info by adding this in the CSS:
Code:

.hiddenstat+tr{display:none;}

Perfect! Thanks! You guys are awesome and thanks for the quick responses.
avatar
iamthestreets
Forumember

Posts : 114
Reputation : 1
Language : English

http://www.mystreetlife.forumotion.com/

Back to top Go down

Solved Re: How to show/hide who is online?

Post by Nera. 17/1/2012, 22:48

Topic Solved & Locked
Nera.
Nera.
Energetic

Female Posts : 7078
Reputation : 2017
Language : English
Location : -

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum