Messenger

Ważne wartości


<style>
.fb-page iframe {
	border: none;
    visibility: visible;
    width: 300px;
    height: 300px;
    border-radius: 9pt;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 3pt 12pt;
    display: inline;
    padding: 0px;
    position: fixed;
    z-index: 2147483647;
}
.msg_icon:hover {
  animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}

@keyframes shake {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }
  
  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(-4px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}
</style>


<script src="js/jquery-3.1.1.min.js" type="text/javascript"></script>
<script>
      window.fbAsyncInit = function() {
        FB.init({
          appId      : '95100348886',
          xfbml      : true,
          version    : 'v2.6'
        });
      };

      (function(d, s, id){
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) {return;}
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/pl_PL/sdk.js";     // tutaj ustawiamy język
        fjs.parentNode.insertBefore(js, fjs);
      }(document, 'script', 'facebook-jssdk'));
    </script>
	<script>
$(document).ready(function(){
    $(".msg_icon").click(function(){
        $(".fb-page").slideToggle(700);
    });
});
</script>


<div class="fb-page" 
         data-href="https://www.facebook.com/TWOJE_ID_STRONY/"    
         data-tabs="messages" 
         data-width="400" 
         data-height="300" 
         data-small-header="true"
		 style="display:none;position: fixed;right: 70px;bottom:100px;">
      <div class="fb-xfbml-parse-ignore">
        <blockquote></blockquote>
      </div>
    </div>


<div style="cursor: pointer; outline: none;position:fixed;right:40px;bottom:40px;"><img src="MessengerIcon.png" height="60" width="60" alt="" class="msg_icon"></div>