信息发布软件,b2b软件,广告发布软件

标题: 右键JavaScript的特殊用法简简单单才是真方法 [打印本页]

作者: 群发软件    时间: 2017-6-2 23:48
标题: 右键JavaScript的特殊用法简简单单才是真方法
本文实例讲述了Javascript实现的简单右键菜单类。分享给大家供大家参考。具体如下:
这是自己写的一个右键菜单类,屏蔽掉了IE固有的右键菜单,一共有四个参数:第一个是出发显示右键菜单的div的id
第二个是右键菜单这个层的id,根据这个id去创建一个新的层,menuList是菜单项的列表,对应了点击一个菜单项后触发的函数,classList是菜单的class名称,以及菜单项对应的class名称,包含了鼠标滑过时的class。
运行效果截图如下:
右键JavaScript的特殊用法简简单单才是真方法 b2b软件
在线演示地址如下:


在一般的网页中,IE浏览器的默认右键菜单是一成不变的固定模式,大部分网友浏览网页时对它的利用率不高。对专业的网页设计师来说,如果能将右键菜单设计成个性化的内容该多好呀。

  试想一下,用户在你的网站上一点右键,就是你精心组织的“链接”、“发信”,甚至包含了缤纷的交互式Flash动画!如图1——别流口水了,下面咱们就解解馋,看看如何制作吧。

右键JavaScript的特殊用法简简单单才是真方法 b2b软件

图1

  右键菜单的改造,我有两种途径(其实,本质是一样的,都是JavaScript的东西)。

  第一种方法是较早的,把下列源代码复制到网页中HTML文件中即可。




  其效果如下图2:

右键JavaScript的特殊用法简简单单才是真方法 b2b软件

图2

  第二种方法是利用Dreamweaver的一个插件——Right_Click_Menu_Builder,可以在www.macromedia.com下载得到。安装后,可在Dreamweaver的“Command”菜单的下面找到“Right Click Menu Builder”命令。

  点击该命令,便出现了一个如图3所示的设置框。主要有两部分内容:“Menu”和“Styles”。

右键JavaScript的特殊用法简简单单才是真方法 b2b软件

图3

  Menu是设置功能的,超级链接、发信链接都在这里设置,在这里最多可以设10项连接。此选择框中“Menu Text”是你右键中将显示的文字(换成中文吧);在“URL”中写入相应的链接路径;“Target”决定是否是新窗口或是用现在的窗口展示链接的内容,填入“Blank”就是在新窗口显示,和Dreamweaver的“Target”设置是一样的。

  那怎样加入Flash呢?是这样做的:在网页中加一个“Table”,它的“W”宽建议设为:“100%”,这样会方便你下面添加的各种元素的定位。好,在该“Table”中插入Flash的SWF文件,位置设成“居中”(主要是方便定位,当然具体问题具体分析,自己多尝试一下会有心得的)。

  小技巧:Flash动画不妨做成有交互链接的那种,为什么呢?这样你就可以加任意数量的超级链接。插件自身有最多10条的限制,用了Flash可就全解决啦!


效果:

右键JavaScript的特殊用法简简单单才是真方法 b2b软件

JavaScript实现右键菜单的方式很多,思路也各有千秋,在介绍代码之前先简单介绍一下我的右键对象思路。

1、 一个右键对象包含多个右键块。

2、 任何一个页面或控件都能且最多只能挂一个右键块。

3、 每个右键块拥有多级右键项。

4、 采用pupop方式。

下面分对象介绍源码:

公共部分:

/**
* <p>标题: BinaryStar右键菜单JS模型</p>
* <p>功能描述: 模拟右键菜单的功能。</p>
* <p>实现方法: 一个右键菜单对象由多个右键菜单块组成。每个需要右键功能的对象直接关联一个菜单块,
*  同时一个菜单块可以配多个对象关联。
* 每个菜单块包含多个菜单项。每个菜单项可能包含多个子菜单项。
* <p>作者: BinaryStar原创B/S框架</p>
* <p>版本: 0.1</p>
* <p>创建日期: 2005-12-21</p>
*/

/**
* <p>标题: BSRightItemArea</p>
* <p>功能描述: 右键菜单块。</p>
* <p>作者: BinaryStar原创B/S框架</p>
* <p>版本: 0.1</p>
* <p>创建日期: 2005-12-21</p>
*/



作者: 武器    时间: 2017-6-18 15:59
店家服务很细心,服务周到,系统功能齐全,赞一个
作者: meili1    时间: 2017-6-20 21:03
很牛,服务一流,态度更一流,好评!!!
作者: meilifc001    时间: 2017-6-22 10:26
编辑文字和活动都得靠自己想!!小白如我,只能做出这个效果。慢慢的去摸索!!??
作者: beiao    时间: 2017-6-23 01:57
很实用,用着很好。辛苦了两天,有技术小哥专业的指导,总算完成了
作者: xbaobeit    时间: 2017-6-29 10:14
好,功能也很强大,平台已经弄完,不过最近事太忙,还没事时间完善内容,整理好后补发图片.
作者: znl001    时间: 2017-6-29 18:55
蛋,一点都不笨!哈哈哈




欢迎光临 信息发布软件,b2b软件,广告发布软件 (http://postbbs.com/) Powered by Discuz! X3.2