1. Hướng dẫn tạo jQuery right click context menu
  2. Hướng dẫn kỹ thuật nhỏ về AJAX
  3. Hướng dẫn phân trang bằng Ajax
  4. Hướng dẫn tạo Menu xổ bằng Jquery đơn giãn
  5. JQuery CSS Image Slider
  6. Tìm kiếm bằng Ajax
  7. Multiple Image Upload using Ajax with Laravel 5.8

Hướng dẫn tạo jQuery right click context menu

min read

Trong Ví dụ này sẽ hướng chỉ cho các bạn tạo một Context menu. khi các bạn click chuột phải vào một biểu tượng nào đó. sẽ Show ra một menu như (COPY,PASE,CUT,...) khi bạn tạo thành công được Context-Menu sẽ làm cho bạn thuận tiện hơn khi bạn muốn làm một việc gì đó trên trang web của bạn.

 

code css

.test	
{ 	width: 300px;
	height:300px;
	margin: 0px auto;
	background-color:green;
	border: 1px solid #fsdfds;
}

code html

<div class="test box menu-1">
<strong>right click me</strong>	
</div>

code js

$(function () {
	$.contextMenu({
		selector: '.test',
		build: function ($trigger, e) {
			console.log(e);
			return {
				callback: function (key, options) {
					var m = "clicked: " + key;
					console.log(m);
				},
				items: items	
			};
		}
	});	
	var items = {
			"edit": {
				name: "Edit",
				icon: "edit"
			},
			"cut": {
				name: "Cut",
				icon: "cut"
			},
			"copy": {
				name: "Copy",
				icon: "copy"
			},
			"paste": {
				name: "Paste",
				icon: "paste"
			},
			"delete": {
				name: "Delete",
				icon: "delete"
			},
			"sep1": "---------",
			"quit": {
				name: "Quit",
				icon: "quit"
			}	
	};
});

Download:https://mega.co.nz/#!SANxHL5I!deiNdTUQvDalZrk5dcXhG0vs0nJQfQDFkKX8OQL42TE

x

Ủng hộ tôi bằng cách click vào quảng cáo. Để tôi có kinh phí tiếp tục phát triển Website!(Support me by clicking on the ad. Let me have the money to continue developing the Website!)