Code Hoa Rơi theo Chuột

Đoạn javascript dưới đây sẽ tạo hiệu ứng hoa rơi khi bạn di chuyển chuột, khi di chuyển đến đâu, sẽ có những bông hoa li ti theo đó, tạo cho Website thêm sinh động bớt nhàm chán

Cách 1: Thêm đoạn code dưới đây vào Website của bạn:

Các bài viết liên quan

Top 7 trang web tốt nhất để học lập trình Web

24/09/2021

Cách tạo Web Server trên VPS bằng Hostvn Script

12/08/2021

Script xóa bạn bè đã bị khóa trên Facebook

08/08/2021

Script tự động khởi động Nginx, Mariadb, PHP khi Web lỗi 502 Bad Gateway

18/07/2021

<script type="text/javascript" src="https://anonyviet.com/resource/mouse/mousehoa.js?v=4640385"></script>

Cách 2:

 Bước 1: Thêm đoạn Code dưới đây vào Website của bạn

<script type="text/javascript" src="mousehoa.js?v=4640385"></script>

 Bước 2: Bạn dùng Notepad tạo 1 File với tên “mousehoa.js” với nội dung dưới đây. Đặt chung với File “mousehoa.js” chung thư mục các file của trang Web bạn

$(document).on('mousemove', function(e) {
	function function_name(argument) {
		// body...
	}
	var xMouse = e.pageX;
	var yMouse = e.pageY;
	if (Math.random() < 0.1) {
		setTimeout(function() {
			var l = document.createElement("DIV");
			var size = (Math.floor(Math.random() * (30 - 10)) + 10);
			l.style.width = size + "px";
			l.style.height = size + "px";
			l.style.backgroundImage = "url(https://anonyviet.com/resource/mouse/hoaroi.png)";
			var bg_pos = (Math.floor(Math.random() * 4));
			l.style.backgroundPosition = "0px -"+(size*bg_pos)+"px";
			l.style.backgroundSize = size + "px "+4*size+"px"
			l.style.position = "absolute";
			l.style.left = (xMouse) + "px";
			l.style.top = (yMouse + 10) + "px";
			l.style.zIndex = 9999;
			l.style.display = 'none';
			document.body.appendChild(l);
			$(l).fadeIn(100);
			var stop = false;
			var hoaroi = function() {
				if (!stop) {
					setTimeout(function() {
						window.requestAnimationFrame(hoaroi);
					}, 20);
					l.style.top = (parseInt($(l).css('top'), 10) + 1) + "px";
					if ((parseInt($(l).css('top'), 10)) % 10 == 0) {
						if (Math.random() < 0.5) {
							l.style.left = (parseInt($(l).css('left'), 10) + 1) + "px";
						} else {
							l.style.left = (parseInt($(l).css('left'), 10) - 1) + "px";
						}
					}
				}
			}
			window.requestAnimationFrame(hoaroi);
			$(l).fadeOut((Math.floor(Math.random() * (2500 - 1000)) + 1000), function() {
				$(l).remove();
				stop = true;
			});
		}, 50);
	}
});