这里有新鲜出炉的 Javascript 教程,程序狗速度看过来!
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
鼠标右键大家都经常操作,但是鼠标的内容是不是符合大家的 "口味"?这篇文章就是教大家如何定制自己专属鼠标右键, 需要的朋友可以参考下
在 web 端,通常是不需要右键菜单,各个浏览器也有自己的右键菜单。但是对于一些特殊的网页,是需要右键菜单来增加用户体验的,比如百度音乐,QQ 邮箱,相信大家都在 Web 端使用过右键菜单了,现在来分享一下如何实现,比较简单。
运行代码:
- window.onload = function() {
- document.oncontextmenu = block;
- document.body.onmouseup = function(event) {
- if (!event) event = window.event;
- if (event.button == 2) {
- var x = event.pageX || event.clientX;
- var y = event.pageY || event.clientY;
- document.getElementById("contextMenu").style.left = x "px";
- document.getElementById("contextMenu").style.top = y "px";
- document.getElementById("contextMenu").style.display = "block";
- }
- }
- //阻止事件冒泡
- document.getElementById("contextMenu").onclick = function(event) {
- event.stopPropagation();
- }
- //点击其他地方隐藏
- document.onclick = function() {
- document.getElementById("contextMenu").style.display = "none";
- }
- for (var i = 0; i < getElementsByClassName("contextMenuItem").length; i ) {
- getElementsByClassName("contextMenuItem")[i].onclick = function(event) {
- event = event ? event : window.event
- var target = event.srcElement ? event.srcElement : event.targe;
- document.getElementById("contextMenu").style.display = "none";
- //alert("您点击了: " target.innerhtml);
- }
- }
- }
- function block(event) {
- if (window.event) {
- event = window.event;
- event.returnValue = false;
- } else event.preventDefault();
- }
- //兼容IE不支持getElementsByClassName
- function getElementsByClassName(className, root, tagName) {
- if (root) {
- root = typeof root == "string" ? document.getElementById(root) : root;
- } else {
- root = document.body;
- }
- tagName = tagName || "*";
- if (document.getElementsByClassName) {
- return root.getElementsByClassName(className);
- } else {
- var tag = root.getElementsByTagName(tagName);
- var tagAll = [];
- for (var i = 0; i < tag.length; i ) {
- for (var j = 0, n = tag[i].className.split(' '); j < n.length; j ) {
- if (n[j] == className) {
- tagAll.push(tag[i]);
- break;
- }
- }
- }
- return tagAll;
- }
- }
效果图:
来源: http://www.phperz.com/article/17/0416/270153.html