jQuery左右键上下文菜单特效代码下载

jQuery左右键上下文菜单特效代码下载

1. 引入CSS

<link rel="stylesheet" type="text/css" href="css/normalize.css" />
<link rel="stylesheet" href="http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
<link rel="stylesheet" type="text/css" href="css/zzsc.css">
<link rel="stylesheet" href="dist/basicContext.min.css">
<link rel="stylesheet" href="dist/themes/default.min.css">

2. 引入JS

<script src="dist/basicContext.min.js"></script>

3. HTML代码

	<div class="htmleaf-container">
		<header class="htmleaf-header">
			<div class="zzsc center">
			  <a href="index.html" class="current">default</a>
			  <a href="index2.html">position</a>
			  <a href="index3.html">scroll</a>
			  <a href="index4.html">closeFunction</a>
			  <a href="index5.html">customPosition</a>
			  <a href="index6.html">jQuery</a>
			</div>
		</header>
		<div class="htmleaf-content">
			<a href="#" class="click">鼠标左键点击我</a>
			<a href="#" class="context">鼠标右键点击我</a>
			<a href="#" class="touchend">Touch me! (移动手机有效)</a>
		</div>
	</div>
	<script>
		var onClick = function(e) {
			var clicked = function() { alert('Item clicked!') }
			var items = [
				{ title: 'Add Sites', icon: 'ion-plus-round', fn: clicked },
				{ title: 'Reset Login', icon: 'ion-person', fn: clicked },
				{ title: 'Help', icon: 'ion-help-buoy', fn: clicked },
				{ title: 'Disabled', icon: 'ion-minus-circled', fn: clicked, disabled: true },
				{ title: 'Invisible', icon: 'ion-eye-disabled', fn: clicked, visible: false },
				{ },
				{ title: 'Logout', icon: 'ion-log-out', fn: clicked }
			]
			basicContext.show(items, e)
		}
		document.addEventListener('DOMContentLoaded', function() {
			document.querySelector('a.click').addEventListener('click', onClick)
			document.querySelector('a.context').addEventListener('contextmenu', onClick)
			document.querySelector('a.touchend').addEventListener('touchend', onClick)
		})
	</script>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
</div>

用户评论

18素材网

一个让开发更高效的素材分享平台,用于快速开发强大的Web界面。


官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:864918708
Css3+Html5讨论群
群号:864918708

加群请备注:从官网了解到