Đưa Skin mới vào diễn đàn sử dụng ! Nếu quá trình sử dụng diễn đàn xảy ra lỗi, xin vui lòng liên hệ Admin để báo lỗi ! Cảm ơn !

You are not connected. Please login or register

[Javascript] AJAX Loading

  • Please log in to post a topic
  • huyhoang1997

    huyhoang1997

    Group: Moderagerator

    Hiện đang:
    Bài viết : 670
    Points : 896
    Birthday : 14/06/1997
    Thanks : 64
    Đến từ : Ninh Thuận

    Moderagerator
    Xem lý lịch thành viên

    Moderagerator
    Bài viết thứ :1

    Đăng vào:on 27/6/2016, 09:26

    Moderagerator

    Demo:

    màu đen:

    màu xanh:

    Hướng dẫn:

    Javascript:

    Code:
          jQuery(function() {
                  jQuery('body').prepend('<div id="ajax_loading" style=""><img src="http://i58.servimg.com/u/f58/17/89/00/23/ajax_l10.gif" alt="Loading..."></div>');
                  jQuery('a').click(function() {
                      jQuery('#ajax_loading').slideDown();
                      setTimeout('load()', 1000);
                  });
                });
                function load() {
                  jQuery('#ajax_loading').slideUp('1000');
                }
                setTimeout('load()', 1000);

    CSS

    Màu đen:
    Code:
    #ajax_loading {
                background: url("http://i38.servimg.com/u/f38/18/83/30/50/imagee15.png") repeat-x scroll 0px 0px transparent;
                border: 1px solid #000000;
                border-radius: 0px 0px 5px 5px;
                box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.2), 0px -1px 0px rgba(255, 255, 255, 0.2) inset;
                color: rgb(255, 255, 255);
                left: 46%;
                padding: 5px 0px 8px;
                position: fixed;
                text-align: center;
                top: 0px;
                width: 8%;
                z-index: 999;
            }

    Màu xanh:
    Code:
          #ajax_loading {
                background: url("http://i58.servimg.com/u/f58/17/89/00/23/ajaxlo10.png") repeat-x scroll 0px 0px transparent;
                border: 1px solid rgb(123, 166, 13);
                border-radius: 0px 0px 5px 5px;
                box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.2), 0px -1px 0px rgba(255, 255, 255, 0.2) inset;
                color: rgb(255, 255, 255);
                left: 46%;
                padding: 5px 0px 8px;
                position: fixed;
                text-align: center;
                top: 0px;
                width: 8%;
                z-index: 999;
            }
    P/s: - Tạo javascript chọn Placement: In all the pages
          - CSS: chọn 1 trong 2 CSS mà bạn muốn thực hiện và quăng vào CSS Stylesheet
    Nguồn: help.forumotion

    #1 - Posted on 27/6/2016, 09:26
    Xem lý lịch thành viên

    Đang kiểm tra dữ liệu...

    Bạn phải điền đầy đủ thông tin đăng ký.

    Số ký tự phải từ 3 trở lên
    Hãy chọn tài khoản khác
    Có thể dùng tài khoản này
    Không sử dụng địa chỉ này
    E-mail sẽ được kiểm sau
    Số ký tự phải từ 3 trở lên
    Trùng tên đăng nhập
    Chưa đúng
    Chính xác

    Free forum | © PunBB | Free forum support | Liên hệ | Report an abuse | Sosblogs
    YOUR BANNER HERE
    728x90