04/10/2018, 20:14

Thủ thuật javacript : Tạo hiệu ứng page loading cho trang web

Dưới đây là hướng dẫn các bạn dùng 1 javascript để hiện thông báo nạp trang. Thông báo này rất hữu ích trong trường hợp trang web của bạn khá lớn hoặc tốc độ mạng khá chậm, tao cảm giác dễ chịu và lầm tưởng web bạn load bình thường. Bước 1: Download file này về máy Page Loading. ...

Dưới đây là hướng dẫn các bạn dùng 1 javascript để hiện thông báo nạp trang. Thông báo này rất hữu ích trong trường hợp trang web của bạn khá lớn hoặc tốc độ mạng khá chậm, tao cảm giác dễ chịu và lầm tưởng web bạn load bình thường.

tao hieu ung page loading

Bước 1: Download file này về máy Page Loading.

Bước 2:Mở trang web bạn định đưa hiệu ứng vào. Nếu bạn sử dụng mã nguồn wordpress thì mở file header.php lên, joomla thì vào template mở file index.php.

Bước 3:Đến vị trí tag, bổ sung để được như hình dưới.

1
2
3
 

Bước 4: Ngay sau tag, thêm đoạn code sau:


 

Xem thử sẽ thấy tác dụng.

Chú ý:

  • Trong đoạn code trên, bạn có thể đổi hình khác bang cách chỉnh lại tên “loading.gif”, và chỉnh dòng chữ thông báo (phía trên hình) theo ý bạn.
  • Sẽ có nhìu hình cho bạn chèn vào trong file tôi có một số hình:
  • Nếu muốn xem thử ở local, trang web của bạn phải có dung lượng lớn (chèn thử vài hình có kích thước file thật lớn vào là được).
  • Khi xem thử từ lần thứ 2 trở đi, có thể bạn không xem được hiệu ứng, vì browser lấy từ cache ra, nên hiện rất nhanh. Hãy xóa cache trước khi xem thử.
  • Hay nhất là sau khi chèn xong. Upload trang và các hình lên host của bạn để test.
Nguồn bcdonline

Tạo hiệu ứng page loading cho trang web, 10.0 out of 10 based on 1 rating

Tags: javacripts code nạp trang page loading thu thuat javacript

Chuyên Mục: Javascript

Bài viết được đăng bởi webmaster

0