Cara membuat box twitter melayang


Kita sering menjumpai atau melihat box twitter melayang saat membuka website atau blog orang lain,dan kita pengen tau bagai mana cara memasangnya box itu, trik disini akan membagikan sedikit pengetahuan saya, dengan cara masuk ke dashboard blogger dulu terus kita pilih tata letak dan pilih tambah widget ambil HTML/javascript terus


Copy code dibawah ini dan pastekan disitu
<!-- TW melayang tombol close --!>
<style type='text/css'>
#kotak-facebook {
      position:fixed !important;
      position:absolute; /* IE6 */
      bottom:-1000px;
      right:38%;
      margin:0px 0px 0px -182px;
      width:290px;
      height:auto;
      padding:16px;
       -webkit-box-shadow: 0px 0px 7px #222;
      -moz-box-shadow: 0px 0px 7px #222;
      box-shadow: 0px 0px 7px #222;  background-color:#FFFFFF; font:normal 1em Cambria,Georgia,Serif;
      color:#111;
    -webkit-border-top-left-radius: 20px;
    -webkit-border-bottom-right-radius: 20px;
    -moz-border-radius-topleft: 20px;
    -moz-border-radius-bottomright: 20px;
    border-top-left-radius: 20px;
    border-bottom-right-radius: 20px;}
    #kotak-facebook a.close {
      position:absolute;
      top:-10px;
      right:-10px;
      background:#333;
      font:bold 16px Arial,Sans-Serif;
      text-decoration:none;
      line-height:22px;
      width:22px;
      text-align:center;
      color:#fff;
      border:2px solid #fff;
      -webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
      -moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
      box-shadow:0px 1px 2px rgba(0,0,0,0.4);
      -webkit-border-radius:10px;
      -moz-border-radius:10px;
      border-radius:10px;
      cursor:pointer;
    }
</style>
    <script type='text/javascript'>
    $(window).bind("load", function() {
         // animasikan nilai top saat halaman telah selesai dimuat
         $('#kotak-facebook').animate({bottom:"50px"}, 1000);
        // hilangkan kotak pesan saat tombol (x) di klik
         $('a.close').click(function() {
             $(this).parent().fadeOut();
         return false;
         });
    });
    </script>
    <div id='kotak-facebook'>
<p style=" margin-right:10px;  font-size:15px; color:#000000;">Twit dari Asep suhenda. Please <blink>Follow Me !!!</blink> </p>
<!-- Mulai --!>

<iframe name="fbfanIFrame_0" allowtransparency="true" src="http://s.moopz.com/connect.html?user=counter_excell" class="@counter_excell" style="width: 290px; height: 250px; border-style: none;" frameborder="0" scrolling="no"></iframe><script type="text/javascript">fanbox_init("@counter_excell");</script>

<!-- Selesai --!><a class='close' href='#'>&times;</a>
<p style=" float:right;  margin-right:35px;  font-size:10px;" >Powered By <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://regibrader-free.blogspot.com/search/label/Widget%20Blog">Blogger Widget</a> and <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://regibrader-free.blogspot.com/2013/05/cara-membuat-widget-follow-me-box_12.html">Get This Widget</a></p>
    </div>

Sebelum di save Ganti dulu yang titandai dengan warna merah nama yang ada di box nanti dan nama akun twitter kamu. nah baru disave,gampang kan..?
Itulah cara membuat box twitter melayang semoga bermanfaat untuk klien semua trimakasih.

0 komentar:

Posting Komentar

Copyright © 2014 Counter exceLL All Right Reserved