[ChiNa]

Originally Posted by [B

bzcomputers[/b];2361805]I had a couple people using touchscreens (iPads, tablets, etc.) saying they had issues getting it to close. It will slide out on touch but there is no way to close it ........

Originally Posted by [B

CharlieDelta[/b];2361989]+1. I have had the same complaints.

Update for, CharlieDelta and bzcomputers:

So I am back, and I forgot to tell, that I updated the Facebook Slidebox tutorial to a much better and easier tutorial! There are 2 METHODS! Method 1 is the new Tutorial, and METHOD 2 the old one which I think you both are still using!
The NEW Method 1, has only 1 TEMPLATE EDIT. And I can only hope for it works for you, I have added an extra FIELD called the JAVASCRIPT "NO CONFLICT" variable, Now its upto you if you wanna try the new method and see if it works for the people with the IPad problem!

First of all REMOVE all the codes used from the old FACEBOOK TUTORIAL! The codes should be in 3 template. In your Headinclude + Additional.css + header template. If you dont remember how, then take a look at "METHOD 2". And use it to remove the codes..

Step 1: Here is the NEW CODE and new METHOD to add the facebook slider! Add the whole code thar you see below in your header template, Add it BELOW EVERYTHING ELSE IN YOUR HEADER, And DO NOT SAVE IT YET.

============================
ADD THE CODE BELOW IN HEADER:
============================

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript">
jQuery.noConflict();
jQuery(function (){
jQuery(".s_likebox").hover(function(){
jQuery(".s_likebox").stop(true, false).animate({right:"0"},"medium");
},function(){
jQuery(".s_likebox").stop(true, false).animate({right:"-250"},"medium");
},500);
return false;
});
</script>
<script>
jQuery.noConflict();
</script>
<style type="text/css">
.s_likebox {
float:right;
width:288px;
height:345px;
background: url(images/fbslide.png) no-repeat !important;
display:block;
right:-250px;
padding:0;
position:fixed;
top: 130px;
z-index:1002;
border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
}
div.likeboxwrap {
margin-top:2px;
margin-left:-5px;
background: #fff;
width:238px;
height:325px;
overflow:hidden;
border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
}
div.likeboxwrap iframe {margin:-1px}
</style>

</style><div class="s_likebox"><div style="color: rgb(255, 255, 255); padding: 8px 5px 0pt 50px;"><span><div class='likeboxwrap'>PUT YOUR IFRAME CODE HERE</div> </span></div></div>

============================
After adding, move on to STEP 2, without SAVE!
============================

Step 2: We are still in your HEADER template, and you havnt saved it yet! Now if you take a look ABOVE in the code you just added in your header, you will see the BLUE TEXT saying PUT YOUR IFRAME CODE HERE! Add your FACEBOOK IFRAME code instead of the text PUT YOUR IFRAME CODE HERE! Exactly as you did in my first Tutorial! After you added that, make sure that your fbslide.png image is in your "images" folder! Then your CODE is done in the header. HIT SAVE to save your HEADER!

NOW WE ARE DONE!
Try now use the IPAD to see if it still have the conflict! And from now on, if anything use always this METHOD, or my METHOD 1 ! Good luck, and waiting for an update!