© 2017 Pblog.TK Nhận Thiết Kế Wap/Web Giá Rẻ. Inbox - 01226209308 !!

Code loading sặc sỡ cho ai thích màu mè

Đăng Cách đây 8 tháng bởi Poker |

code loadingnày mình k thích lắm vì nó sặc sỡ quá cứ share lên thôi ai thích thì dùng ạ

code loading đẹp

đemo /demo/loading23

code
Copy Code
<style> .wrapper { width: 100%; height: 100%; } .wrapper { position: relative; background: #e7f0f7; } .progressbar { display: block; position: absolute; z-index: 9; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 400px; height: 30px; } .progressbar::before, .progressbar::after { content: ''; display: block; position: absolute; z-index: 99; top: 0; left: 0; width: 100%; height: 100%; border-radius: 15px; background-image: -webkit-linear-gradient(0deg, #e91e63 0%, #e91e63 20%, #03a9f4 20%, #03a9f4 40%, #8bc34a 40%, #8bc34a 60%, #ffeb3b 60%, #ffeb3b 80%, #ff5722 80%, #ff5722 100%); background-image: linear-gradient(90deg, #e91e63 0%, #e91e63 20%, #03a9f4 20%, #03a9f4 40%, #8bc34a 40%, #8bc34a 60%, #ffeb3b 60%, #ffeb3b 80%, #ff5722 80%, #ff5722 100%); background-position: 0 0; background-repeat: repeat-x; -webkit-animation: movebar 5s linear infinite; animation: movebar 5s linear infinite; } .progressbar::before { box-shadow: 0 6px 10px 0 rgba(0,0,0,0.1); } .progressbar::after { z-index: 9; top: 6px; -webkit-filter: blur(16px); filter: blur(16px); opacity: 0.7; } .stylization { position: absolute; z-index: 999; height: 4px; width: 90%; left: 5%; top: 6px; opacity: 0.3; } .stylization::before, .stylization::after { content: ''; display: block; position: absolute; height: 4px; top: 0; border-radius: 2px; } .stylization::before { background: #fff; left: 0; right: 10px; } .stylization::after { width: 6px; background: #fff; right: 0; } @-webkit-keyframes movebar { from { background-position: 0 0; } to { background-position: 400px 0; } } @keyframes movebar { from { background-position: 0 0; } to { background-position: 400px 0; } } </style> <script type="text/javascript" src="hottp://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script> <script type="text/javascript">window.onload = detectarCarga; function detectarCarga() { document.getElementById("Zenload").style.display="none"; }</script> <div class="ntc" id="Zenload"> <b><font style="font-size: 8pt;" color="#ff00cc" face="Verdana"> <div class="wrapper"> <div class="progressbar"> <div class="stylization"></div> </div> </div> <script language="JavaScript"> function toggleDisplay(id) { document.getElementById(id).style.visibility = "visible"; if(document.getElementById(id).style.display == "none" ) { document.getElementById(id).style.display = ""; } else { document.getElementById(id).style.display = "none"; } } </script>

Bình Luận Bài Viết

Cùng Chuyên Mục