Jam Digital DeadPool


DeadPool... Superhero kocak kreasi Marvell Comics, superhero ini memiliki kelebihan bisa menyembuhkan dirinya secara cepat apabila terluka ringan ataupun terluka berat. Proses penyembuhan luka yang spesial ini didapat karena mutasi genetika akibat eksperimen terlarang yang dilakukan oleh Dr.Francis. Ok sob, cukup sekian narasi singkatnya sekarang kita lanjutkan ke pembahasan utama, yaitu Widget Blog Jam dengan karakter unik Superhero DeadPool.

Widget jam DeadPool dibuat dengan sedikit modifikasi JQuery dan kode CSS3, hasilnya seperti yang terlihat pada contoh di atas. Ok sob... widget ini yang pasti keren bangetz apabila dipasang diblognya... Buat yang berminat langsung ke TKP aja deh...

Ohh yaa source code Jam Digital DeadPool ini saya buka jadi silakan buat yang suka coding script blog untuk di modif lagi scriptnya supaya tambah keren Jam Digital DeadPool ini dan jangan lupa di info biar saya review hasilnya dan saya muat link artikelnya di postingan artikel ini. Lumayan bisa nambah Backlink gratis...

Penting !!! ada baiknya sobat blogger mem-backup terlebih dahulu template blog sobat untuk menghindari  hal-hal yang tidak diinginkan dalam menerapkan widget ini.

Cara Pemasangan :
  • Login ke blog sobat...

  • Klik "More Options" selector box kemudian klik "Tata Letak" setelah itu pilih "Add Widget" dan pilih "HTML / Javascript", seperti gambar di bawah ini.





  • Copy-paste kode di bawah ini dan taruh di kotak gadget blog. Silakan sesuaikan beberapa parameter kode tersebut agar sesuai dengan tema blog sobat.
    <script>
    if(typeof(jQuery) == 'undefined'){
    document.write("<scr" + "ipt type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'></scr" + "ipt>");}
    </script>
    <link href="https://fonts.googleapis.com/css?family=Rationale" rel="stylesheet" type="text/css" />
    <style type="text/css">
    .clock{background: rgba(76,76,76,1);background: -moz-linear-gradient(top, rgba(76,76,76,1) 0%, rgba(89,89,89,1) 12%, rgba(102,102,102,1) 25%, rgba(71,71,71,1) 39%, rgba(44,44,44,1) 50%, rgba(0,0,0,1) 51%, rgba(17,17,17,1) 60%, rgba(43,43,43,1) 76%, rgba(28,28,28,1) 91%, rgba(19,19,19,1) 100%);background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(76,76,76,1)), color-stop(12%, rgba(89,89,89,1)), color-stop(25%, rgba(102,102,102,1)), color-stop(39%, rgba(71,71,71,1)), color-stop(50%, rgba(44,44,44,1)), color-stop(51%, rgba(0,0,0,1)), color-stop(60%, rgba(17,17,17,1)), color-stop(76%, rgba(43,43,43,1)), color-stop(91%, rgba(28,28,28,1)), color-stop(100%, rgba(19,19,19,1)));background: -webkit-linear-gradient(top, rgba(76,76,76,1) 0%, rgba(89,89,89,1) 12%, rgba(102,102,102,1) 25%, rgba(71,71,71,1) 39%, rgba(44,44,44,1) 50%, rgba(0,0,0,1) 51%, rgba(17,17,17,1) 60%, rgba(43,43,43,1) 76%, rgba(28,28,28,1) 91%, rgba(19,19,19,1) 100%);background: -o-linear-gradient(top, rgba(76,76,76,1) 0%, rgba(89,89,89,1) 12%, rgba(102,102,102,1) 25%, rgba(71,71,71,1) 39%, rgba(44,44,44,1) 50%, rgba(0,0,0,1) 51%, rgba(17,17,17,1) 60%, rgba(43,43,43,1) 76%, rgba(28,28,28,1) 91%, rgba(19,19,19,1) 100%);background: -ms-linear-gradient(top, rgba(76,76,76,1) 0%, rgba(89,89,89,1) 12%, rgba(102,102,102,1) 25%, rgba(71,71,71,1) 39%, rgba(44,44,44,1) 50%, rgba(0,0,0,1) 51%, rgba(17,17,17,1) 60%, rgba(43,43,43,1) 76%, rgba(28,28,28,1) 91%, rgba(19,19,19,1) 100%);background: linear-gradient(to bottom, rgba(76,76,76,1) 0%, rgba(89,89,89,1) 12%, rgba(102,102,102,1) 25%, rgba(71,71,71,1) 39%, rgba(44,44,44,1) 50%, rgba(0,0,0,1) 51%, rgba(17,17,17,1) 60%, rgba(43,43,43,1) 76%, rgba(28,28,28,1) 91%, rgba(19,19,19,1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313', GradientType=0 );z-index:+9999999;width: 200px;height:43px; margin: 0 auto; padding: 4px 2px 2px 2px; color: #fff; position: fixed; top: -43px; left: 50%; margin-left: -100px; border-radius: 0 0 12px 12px;}#Date{color: #fff; text-decoration: none; font-family: 'Arial', Helvetica, sans-serif; font-size: 12px; text-align: center; text-shadow: 0 0 5px #FF0000;}.clock ul{margin: 0 auto; padding: 0px; list-style: none; text-align: center;}.clock ul li{color: #fff; display: inline; font-size: 20px;font-weight: bold; text-align: center; font-family: 'Rationale',Arial, Helvetica, sans-serif; text-shadow: 0 0 5px #FF0000;}#point{position: relative; -moz-animation: mymove 1s ease infinite; -webkit-animation: mymove 1s ease infinite; padding-left: 10px; padding-right: 10px;}@-webkit-keyframes mymove{0%{opacity: 1.0; text-shadow: 0 0 20px #FF0000;}50%{opacity: 0; text-shadow: none;}100%{opacity: 1.0; text-shadow: 0 0 20px #00c6ff;}}@-moz-keyframes mymove{0%{opacity: 1.0; text-shadow: 0 0 20px #FF0000;}50%{opacity: 0; text-shadow: none;}100%{opacity: 1.0; text-shadow: 0 0 20px #FF0000;}}
    </style>
    <script type="text/javascript">
    $(document).ready(function() {
    var monthNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
    var dayNames = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]
    var newDate = new Date();
    newDate.setDate(newDate.getDate());
    $('#Date').html(dayNames[newDate.getDay()] + " " + newDate.getDate() + ' ' + monthNames[newDate.getMonth()] + ' ' + newDate.getFullYear());
    setInterval(function() {
    var seconds = new Date().getSeconds();
    $("#sec").html((seconds < 10 ? "0" : "") + seconds);
    }, 1000);
    setInterval(function() {
    var minutes = new Date().getMinutes();
    $("#min").html((minutes < 10 ? "0" : "") + minutes);
    }, 1000);
    setInterval(function() {
    var hours = new Date().getHours();
    $("#hours").html((hours < 10 ? "0" : "") + hours);
    }, 1000);
    });
    </script>
    <script>
    $(document).ready(function(){
    $("#imgClock").animate({top: "26px"});
    $(".clock").animate({top: "-20px"});
    });
    function clockHover(){
    $(".clock").animate({top: "0px"});
    $("#imgClock").animate({top: "46px"});
    }
    function clockOut(){
    $(".clock").animate({top: "-20px"});
    $("#imgClock").animate({top: "26px"});
    }
    </script>
    <div class="clock">
    <div id="Date"></div>
    <ul>
    <li id="hours"> </li>
    <li id="point">:</li>
    <li id="min"> </li>
    <li id="point">:</li>
    <li id="sec"> </li>
    </ul>
    </div>
    <div onmouseover="clockHover()" onmouseout="clockOut()" id="imgClock" style="position:fixed;top:0px;left:50%;margin-left:-46px;z-index:+9999999999;margin-top:0px;">
    <a href="http://monosbit.blogspot.com" target="blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiemFuMI1T48QxvVcaYz54D2QKnW91_hdSWNlh7pW6g7NoRtrOIMhJv9bfZGjxxurK7SeHR5uUQ2ppCTOGu3HYUqNKC0GfCcMWw7r1sxNjsxxaJ79aTtX-18lTa1regf77zWvnUAIPN_SIc/s1600/deadpool.png" border="0"/></a>
    </div>

  • Klik "Save" dan lihat hasilnya...
Oke sobat monosbit jangan lupa meninggalkan jejak komentarnya yaa... biar postingan berikutnya semakin unik dan menarik.. happy blogging...

.: Semoga Bermanfaat :.
  • :
  • :

0 Response to "Jam Digital DeadPool"

Post a Comment

Popular Post

loading...