Home »

Hook.js - Pull to refresh website như iOS

12 thg 9, 2013

"Pull to refresh" tạm dịch là "Kéo để làm mới" là một chức năng rất hay trên các thiết bị iOS. Hôm nay, mình giới thiệu một plugin nhỏ để tạo hiệu ứng này trên website. Plugin này mang tên Hook.js dung lượng chỉ khoảng 25KB.

Do dung lượng nhỏ nên plugin này không làm ảnh hưởng đến tốc độ load của website. Các bạn yên tâm nhé.
Hook.js - Pull to refresh website như iOS
Để áp dụng hiệu ứng này, các bạn đưa 3 đoạn script và đặt trong thẻ <head>
?
1
2
3
<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
<link rel="stylesheet" href="/hook/hook.css" type="text/css" />
<script src="/hook/hook.js" type="text/javascript"></script>

HTML

Tiếp theo chèn đoạn mã HTML trong thẻ <body>
?
1
2
3
4
5
6
<div id="hook">
<div id="loader">
<div class="spinner"></div>
</div>
<span id="hook-text">Reloading...</span>
</div>

Hook.js - Pull to refresh website như iOS
Tags:

Comments[ 0 ]


Đăng nhận xét