modificación de codigo, js

[jafp_pe]

Código:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript">
jQuery.noConflict();
jQuery(function (){
jQuery(".slide_likebox").hover(function(){
jQuery(".slide_likebox").stop(true, false).animate({left:"0"},"medium");
},function(){
jQuery(".slide_likebox").stop(true, false).animate({left:"-765"},"medium");
},500);
return false;
});

</script>

<style> .slide_likebox {float:left;width:800px;height:520px;background: url(http://i.imgur.com/W52Z7.gif) no-repeat !important;display:block;left:-765px;padding:0;position:fixed;top: 70px;z-index:1002;} div.likeboxwrap {margin:4px;width:728px;height:486px;background-color:#fff;overflow:hidden;} div.likeboxwrap iframe {margin:-1px} </style> <div class="slide_likebox"> <div style="color: rgb(255, 255, 255); padding: 8px 5px 0pt 10px;"> <span> <div class='likeboxwrap'> <iframe width="728" height="486" frameborder="0" wmode="transparent" marginwidth="0" marginheight="0" scrolling="no" src="http://www.trucosdestardoll.com/chat.html"></iframe> </div> </span> </div> </div>

que puedo hacer? para que el char se abra al ahcer clic y se cierre al hacer clic en el boton o en el fondo.