AiChat.Wap.Sh
Trang chủ | TWIG | Xtscript | Templates | Xtgem | Ads
Đăng Nhập | Đăng Ký
HomeXtgem VNShare Code
Tìm kiếm | Lượt xem: 131

▼ Code Random Và Hiệu Ứng Chữ Rơi 3D Bằng Css3

* KenTN  (Member) [Off]
83 60
*   Cách đây 1 năm
Giới thiệu:
Code sử dụng jQuery và thêm twist vào rotator để random chữ ngẫu nhiên
bằng cách thả ngẫu nhiên các chữ cái của mỗi phần nội dung ra khỏi tầm nhìn trước khi hiển thị nội dung tiếp theo.Chữ hoạt động tốt trên các tiêu đề ngắn gọn, với từng nội dung gói đơn giản trong thẻ "li" trên trang.
Code hoạt động tốt trong tất cả các trình duyệt hiện đại của FF, Chrome, IE10 + vv..., nếu là IE8 / 9,thì nó quay ngược lại một vòng hiệu ứng cơ bản không có hiệu ứng hình ảnh động.
DEMO Click
Đầu tiên đặt code này lên header hoặc nơi bạn muốn có hiệu ứng chữ tại đó
<link rel="stylesheet" type="text/css" href="http://zcode.mobie.in/demo/font/font.css" />

<link href='http://fonts.googleapis.com/css?family=Orbitron:400,700,900' rel='stylesheet' type='text/css'>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script src="http://zcode.mobie.in/demo/font/jquery.lettering-0.6.1.min.js"></script>

<script src="http://zcode.mobie.in/demo/font/fttor.js">

/* =====================================
code hiệu ứng chữ thả ngẫu nhiên bằng css3 được share tại http://zcode.mobie.in
===================================== */

</script>

<script>


jQuery(function(){ // on DOM load

$('#headline').fallingtextrotator({
pause: 3000,
cycles: 2,
ontextchange:function(msgindex, msg, eachchar){
//console.log(msgindex, msg, eachchar)
}
})
})

</script>


Và tiếp theo là thẻ này tại nơi muốn hiển thị
<ul id="headline" class="ft-hieuung" style="height:2em">
<li>Zcode.Mobie.In</li>
<li>Wapmaster Xtgem</li>
<li>Chia Sẻ Mã Nguồn</li>
<li>Cảm Ơn Đã Ghé Thăm!</li>
</ul>


Để thay đổi thời gian chuyển chữ bạn tìm dòng này
jQuery(function(){ // on DOM load

$('#headline').fallingtextrotator({
pause: 3000,
cycles: 2,
ontextchange:function(msgindex, msg, eachchar){
//console.log(msgindex, msg, eachchar)

Và thay đổi pause: 3000 bằng số thời gian bạn muốn, 3000 bằng 3 giây.
Code không có gì đb nhưng nếu copy cho xin 1 link đến zcode.mobie.in nhé
[Like=2] Duy_Doanh , Gà Con
* Otamegane  (Member) [Off]
38 8
*   Cách đây 1 năm
Đù... chơi luôn jQuer luôn
[Like=1] KenTN
* Phuocboyfa  (Member) [Off]
121 36
*   Cách đây 1 năm
hay vãi :)
[Like=1] KenTN
* KenTN  (Member) [Off]
83 60
*   Cách đây 1 năm
thấy hay nên share chơi thôi. :')
▲ Tổng số: 4
- Share:
BBCode:

Link: