Dành cho bạn nào thích nghịch jQuery. Hiệu ứng có sử dụng http://gsgd.co.uk/sandbox/jquery/easing/ lưu ý phải gắn jQuery thì mới chạy nhé https://jquery.com/
Thuộc tính CSS text-decoration:blink tạo chữ nhấp nháy không sử dụng được trong trình duyệt IE7,IE8. Để tạo chữ nhấp nháy chạy trên trình duyệt IE, các bạn tham khảo đoạn code jquery sau:
Các bạn Copy đoạn code sau lưu vào file index.html:
<html>
<head>
//code
<script src="http://sieuthiwebsitedep.com/templates/nicewebmarket/js/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.blink').each(function() {
var elem = $(this);
setInterval(function() {
if (elem.css('visibility') == 'hidden') {
elem.css('visibility', 'visible');
} else {
elem.css('visibility', 'hidden');
}
}, 800);
});
});
</script>
</head>
<body>
<div class="hotline">HOTLINE: <h6 class="blink">0974 347 843</h6> - SUPPORT <h6 class="blink">24/24h</h6></div>
</body>
</html>
XEM THÊM ==> Hướng dẫn cài đặt chi tiết
Nguồn: Sharecode.vn
HƯỚNG DẪN SỬ DỤNG PLUGIN ANIMATION EFFECTS (Ví dụ)
Để sử dụng plugin này, đầu tiên chúng ta cần thêm thư viện jQuery và plugin vào website:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="textEffect.jquery.js"></script>
Tạo một đoạn văn bản nho nhỏ với id=”demo1″
<p id="demo1"> Random Effects Example </p>
Gọi plugin đó cho id demo1
<script>
jQuery(document).ready(function($) {
$('#demo1').textEffect();
});
</script>
Tùy chọn hiệu ứng cho đoạn text
<script>
jQuery(document).ready(function($) {
$('#demo1').textEffect({
effect: 'jumble', // the type of the text aniamtion. fade, glow, jumble, slide, dropdown and random (default)
effectSpeed: 150, // the speed in ms at which new letters begin to animate.
completionSpeed: 6000, // the speed in ms of the text aniamtion.
jumbleColor: '#7f7f7f' // the color of the jumbled letters.
});
});
</script>
Bạn có thể thay đổi các tham số. Nếu bạn có ý tưởng kết hợp plugin này với những đoạn text trên website của bạn một cách hợp lý, chắc chắn website của bạn sẽ cực kỳ ấn tượng. Chúc bạn thành công!