hiding from both guests/mobile devices

[hrmom26]

hi ok so i have a code for hiding from guests and one for blocking the saybox from mobile devices but they don't seem to work together

one am i doing something wrong here is the codes all together

<script>
if (pb_username == 'Guest') {
document.write('<style>#shoutbox {display: none;}</style>');
}
</script>

<div id="shoutbox"> <style type="text/css" media="handheld">
#sayboxwrapper {
display: none;
}
</style>
<div id="sayboxwrapper">
<center><script type="text/javascript" src="http://saybox.co.uk/output.php?user=hrmom26"></script></center>

</div>


is there a different code to use that does both??

thanks

heather

[Renegade]

You're missing a second </div> at the end of that

If that doesn't fix it I'll rewrite it into one code for you but as I don't have an iphone to test it on it may take a few tries.

[hrmom26]

lol i don't have a iphone either so its a trial and error with my members i posted the code now i have to wait for a ipad or phone user to log in to see if it works thanks so much i really love that you all have this support forum that's why i want to be able to keep the saybox so much if i can fix this issue i'll go premium


thanks so much
heather

[hrmom26]

ok i heard back from my members the hide the saybox from guests code is working but the block mobile users code is not working

[Bobby]

Am I correct in assuming your users are testing this from an iPhone? The problem is that the iPhone won't pick up on the handheld media attribute like it should. In fact, the iPhone registers as a screen media- no different than normal PCs. But the key difference is screen space. The iPhone has 480px of screen space. The lowest desktop resolution in common usage is 1024x768. So to pick up on the iPhone you'll want to impose a screen space restriction. You can do so like this (I ramped up the pixels to account for the possibility of the iPhone's resolution increasing anytime soon):

<div id="shoutbox">
  <center><script type="text/javascript" src="http://saybox.co.uk/output.php?user=hrmom26"></script></center>
</div>


<style type="text/css">
/* <![CDATA[ */

@media handheld
{
  #shoutbox
  {
    display: none;
  }
}

@media only screen and (max-device-width: 800px)
{
  #shoutbox
  {
    display: none;
  }
}
	 
/* ]]> */
</style>

<script type="text/javascript">
// <![CDATA[

if (pb_username == 'Guest')
{
  document.getElementById ('shoutbox').style.display = 'none';
}

// ]]>
</script>

[hrmom26]

i copyed an pasted it to my headers if this works i will be your best friend for life lol

thank you so so so much

[hrmom26]

ok it worked they can't see the saybox but since you seem to really know your stuff do you have a code that would make it so iphone users could see everything normally? the reason i want to block mobile devices from seeing the saybox is because the saybox is huge on the iphone and takes over half the screen so users can not see the rest of the board

thank you!!