123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110 |
- @using WeApp.Helpers
- <!-- Page Loader -->
- <style>
- .preloader {
- position: fixed;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- overflow: hidden;
- background: #49a9ee;
- z-index: 9999;
- transition: opacity .65s;
- }
- .cs-loader {
- position: absolute;
- top: 0;
- left: 0;
- height: 100%;
- width: 100%;
- }
- .cs-loader-inner {
- transform: translateY(-50%);
- top: 50%;
- position: absolute;
- width: 100%;
- color: #fff;
- text-align: center;
- }
- .cs-loader-inner label {
- font-size: 20px;
- opacity: 0;
- display: inline-block
- }
- .cs-loader-inner label:nth-child(6) {
- animation: lol 3s infinite ease-in-out
- }
- .cs-loader-inner label:nth-child(5) {
- animation: lol 3s .1s infinite ease-in-out
- }
- .cs-loader-inner label:nth-child(4) {
- animation: lol 3s .2s infinite ease-in-out
- }
- .cs-loader-inner label:nth-child(3) {
- animation: lol 3s .3s infinite ease-in-out
- }
- .cs-loader-inner label:nth-child(2) {
- animation: lol 3s .4s infinite ease-in-out;
- }
- .cs-loader-inner label:nth-child(1) {
- animation: lol 3s .5s infinite ease-in-out
- }
- @@keyframes lol {
- 0% {
- opacity: 0;
- transform: translateX(-300px)
- }
- 33% {
- opacity: 1;
- transform: translateX(0)
- }
- 66% {
- opacity: 1;
- transform: translateX(0)
- }
- 100% {
- opacity: 0;
- transform: translateX(300px)
- }
- }
- </style>
- <div class="preloader">
- <div class="cs-loader">
- <div class="cs-loader-inner">
- <div style="font-size: 20px;">
- <div>@(L("PleaseWait"))</div>
- </div>
- <label> ●</label>
- <label> ●</label>
- <label> ●</label>
- <label> ●</label>
- <label> ●</label>
- <label> ●</label>
- </div>
- </div>
- </div>
- <!-- /.Page Loader -->
- @using (Html.BeginScripts())
- {
- <!-- Page Loader -->
- <script>
- $(function () {
- setTimeout(function () { $('.preloader').fadeOut(600); }, 50);
- });
- </script>
- <!-- /.Page Loader -->
- }
|