Sedikit Info Seputar
Membuat Notification Bar Dengan Background Animasi Warna
Terbaru 2017
- Hay gaes kali ini team Android Media, kali ini akan membahas artikel dengan judul Membuat Notification Bar Dengan Background Animasi Warna, kami selaku Team Android Media telah mempersiapkan artikel ini untuk sobat sobat yang menyukai Android Media. semoga isi postingan tentang
Artikel Tutorial Blogspot, yang saya posting kali ini dapat dipahami dengan mudah serta memberi manfa'at bagi kalian semua, walaupun tidak sempurna setidaknya artikel kami memberi sedikit informasi kepada kalian semua. ok langsung simak aja sob
Judul:
Berbagi Info Seputar
Membuat Notification Bar Dengan Background Animasi Warna
Terbaru
link: Membuat Notification Bar Dengan Background Animasi Warna
Berbagi Membuat Notification Bar Dengan Background Animasi Warna Terbaru dan Terlengkap 2017
Step 2 > Copy kode CSS di bawah ini, lalu paste tepat diatas atau sebelum ]]></b:skin> atau </style>
@keyframes color {height:50px;
0% { background: #33CCCC; }
20% { background: #33CC36; }
40% { background: #B8CC33; }
60% { background: #FCCA00; }
80% { background: #33CC36; }
100% { background: #33CCCC; }
}
#welcome_bar{width:auto;height:auto;display:block;text-align:center;line-padding:8px 20px;color:#fff;position:relative;margin:0 auto;font-weight:normal
background:#33CCCC;
animation: color 9s infinite linear;
text-align: center;
padding: 2em;
}
#welcome_bar a{background:#3B81DE;color:#fff;padding:0 6px;border:1px solid transparent;border-radius:4px;font-weight:bold;}
#close_welcome_bar {display:inline-block;cursor:pointer;padding:0 4px;position:absolute;top:0px;right:5px;font-weight:bold;font-size:18px}
Step 3 > Copy kode HTML di bawah ini, setelah itu paste tepat di bawah atau setelah tag <body>
<div id='welcome_bar'>
Domain TLD Gratis Dari com, silahkan klik <a href='#' title='Unduh Update'>di sini</a>
<span data-target='#welcome_bar' id='close_welcome_bar'>×</span>
</div>
Step 4 > Setelah itu simpan kode javascript di bawah ini tepat diatas atau sebelum tag </body>
<script type='text/javascript'>
//<![CDATA[
var button=document.querySelector("#close_welcome_bar");button.addEventListener("click",function(){var t=document.querySelector(button.getAttribute("data-target"));t.style.display="none"==t.style.display?"block":"none"});
//]]>
</script>
Step 5 > Simpan Template dan lihat hasilnya.....