18 January 2014

RECENT POS WIDGET THUMBNAIL TOOLTIP

RECENT POS WIDGET THUMBNAIL TOOLTIP
     setelah kemarin saya share UBAH BACKGROUND DENGAN STYLE SWITCHER kali ini moonroemoort akan share RECENT POS WIDGET THUMBNAIL TOOLTIP
    monggo di ikuti ..
    • masuk dashboard
    • klik tata letak > tambah gadget
    • pilih html/javascript
    • masukan kode dibawah ini
    <style type="text/css">
    #post-gallery {
      width:304px;
      margin:0px auto;
      font:normal 11px Arial,Sans-Serif;
      color:#494848;
      padding:8px;
      background-color:#17B986;
      -webkit-box-shadow:0px 10px 30px rgba(0, 0, 0, 0.4);
      -moz-box-shadow:0px 10px 30px rgba(0, 0, 0, 0.4);
      box-shadow:0px 10px 30px rgba(0, 0, 0, 0.4);
      -webkit-border-radius:4px;
      -moz-border-radius:4px;
      border-radius:4px;
    }
    #post-gallery h2 {
      font:20px Arial,Sans-Serif;
      color:white;
      text-shadow:0px 3px 2px black;
      text-transform:uppercase;
      margin:2px 2px 2px;
      padding:7px 14px;
      background-color:#48D;
      text-align: center;
    }
    #post-gallery .rp-item {
      float:left;
      display:inline;
      position:relative;
      margin:2px;
      padding:0px 0px;
      background:#fff url('http://softglad.at.ua/images/loading.gif') no-repeat 50% 50%;
      width:72px;
      height:72px;
    }
    #post-gallery .rp-item img {
      width:72px;
      height:72px;
      border:none !important;
      margin:0px 0px !important;
      padding:0px 0px !important;
      background:transparent !important;
      display:none;
    }
    #post-gallery .rp-item .rp-child {
      position:relative;
      top:10%!important;
      left:10%!important;
      z-index:1000;
      width:200px;
      background-color:white;
      border-top:5px solid #FA7C19;
      -webkit-box-shadow:5px 5px 10px rgba(0, 0, 0, 0.7);
      -moz-box-shadow:5px 5px 10px rgba(0, 0, 0, 0.7);
      box-shadow:5px 5px 10px rgba(0, 0, 0, 0.7);
      padding:10px 15px;
      overflow:hidden;
      word-wrap:break-word;
      display:none;
      opacity: 0.9;
    }
    #post-gallery .rp-item .rp-child h4 {
      font-size:12px;
      margin:0px 0px 5px;
      color:#FA7C19;
    }
    #post-gallery .rp-item:hover .hidden {display:block;}
    </style>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    var rpTitle     = "Latest Post",       // Widget Title
        numposts    = 20,      // The number of thumbnail / posts to display
        numchar     = 200,      // Number of characters in the description tooltip
        rcFadeSpeed = 600,      // Speed of the effect. fadeIn () tooltip appears
        pBlank      = "http://softglad.at.ua/images/no-img.png",      // Image that show up if the post doesn't have a image
        blogURL     = "http://chenkho.blogspot.com";       // Your Blog Address
    </script>
    <script src="http://softglad.at.ua/widgets/post-gallery.js" type="text/javascript"></script>
    </table><small><a href="http://chenkho.blogspot.com/2014/01/recent-pos-widget-thumbnail-tooltip.html" target="blank">Pasang Widget Ini</a></small>
    •  klik simpan
    KETERANGAN
    • ganti yang di sorot merah dengan link blog agan 

    berkomentarlah sesuka anda
    ===>no link aktiv<===
    NB:Sebelum menyisipkan kode silahkan gunakan tool konversi kode terlebih dahulu untuk menampilkan kode tersebut pada kolom komentar