contextmenu标签说明—krpano教程

领主 krpano标签 0 喜欢 (0)

contextmenu标签：设置自定义的右键菜单，系统默认菜单（领主截图如下图）包括全屏选项、视角转换选项、当前浏览器渲染方式（flash或html5），用户可以删除或修改系统默认菜单选项，自定义分割线，自定义选项超链接。最底部的当前浏览器渲染方式（flash或html5）必须显示，无法修改。如果没取得右键授权的krpano软件，右键信息顶部还会包含“about krpano.....”这样的商业信息项。领主特别提醒，有些学员认为手机上没有右键信息，然而右键信息在手机同样生效，除非浏览器禁止了，否则长按手机屏幕右键，同样会出现右键菜单。

<contextmenu fullscreen="false"           是否显示全屏项
             native="false"               是否试用原生项目菜单，设置为true禁止自定义菜单
             customstyle=""               调用自定义的右键菜单样式
             versioninfo="true"           是否显示版本信息
             enterfs="Fullscreen"         设置自动全屏项目
             exitfs="Exit Fullscreen"	  设置退出全屏项目
             >
    <item name="域图新视界"          自定义项目名称，可定义公司或网站名称
          caption="域图新视界"             显示的标题
          enabled="true"	    是否点击生效
          visible="true"            是否可见
          separator="false"         是否显示分隔条
          showif=""		    showif="view.vlookatrange GE 180" 本item只在该条件情况下显示	
          onclick="openurl('http://victu360.com',_blank)"             点击后执行自定义动作,可用openurl动作跳转到指定网址
          />

</contextmenu>

<contextmenu fullscreen="false" 是否显示全屏项

native="false" 是否试用原生项目菜单，设置为true禁止自定义菜单

customstyle="" 调用自定义的右键菜单样式

versioninfo="true" 是否显示版本信息

enterfs="Fullscreen" 设置自动全屏项目

exitfs="Exit Fullscreen" 设置退出全屏项目

<item name="域图新视界" 自定义项目名称，可定义公司或网站名称

caption="域图新视界" 显示的标题

enabled="true" 是否点击生效

visible="true" 是否可见

separator="false" 是否显示分隔条

showif="" showif="view.vlookatrange GE 180" 本item只在该条件情况下显示

onclick="openurl('http://victu360.com',_blank)" 点击后执行自定义动作,可用openurl动作跳转到指定网址

</contextmenu>

自定义customstyle样式：

customstyle="font|fontsize|lineheight|backgroundcolor|textcolor|disabled-textcolor|borderwidth|bordercolor|borderradius|shadow-x-offset|shadow-y-offset|shadow-blur-range|shadow-color|innerborder|innerbordercolor|padding-top|padding-bottom|seperator-margin|seperator-color|seperator-second-line-color|item-padding|item-borderwidth|item-bordercolor|item-borderradius|item-margin|item-hover-backgroundcolor|item-hover-bordercolor|item-hover-textcolor|item-text-left-margin|item-text-right-margin"

样式参数说明：

font - 字体，可填'default'.
fontsize - 字体大小，可填'default'.
lineheight - 文字行高，可填'default'.
backgroundcolor - 背景颜色与透明度 - 格式: 0xAARRGGBB.
textcolor - 选项的文字颜色.
disabled-textcolor - 非可选项文字颜色.
borderwidth - 边框宽度.
bordercolor - 边框颜色.
borderradius - 边框圆角的弧度.
shadow-x-offset - 阴影X坐标偏移量.
shadow-y-offset - 阴影y坐标偏移量.
shadow-blur-range - 阴影模糊范围.
shadow-color - 阴影颜色和透明度 - 格式: 0xAARRGGBB.
innerborder - 内边框宽度.
innerbordercolor - 内边框颜色.
padding-top - 顶部填充距离.
padding-bottom - 选项底部填充距离.
seperator-margin - 分割线上下边距.
seperator-color - 分割线颜色.
seperator-second-line-color - 次分割线颜色.
item-padding - 选项内填充距离.
item-borderwidth - 选项内边框宽度.
item-bordercolor - 选项内边框颜色.
item-borderradius - 选项内边框圆角弧度.
item-margin - 选项的边距.
item-hover-backgroundcolor - 鼠标移上或点击后选项颜色.
item-hover-bordercolor - 鼠标移上或点击后选项边框颜色.
item-hover-textcolor - 鼠标移上或点击后选项文字颜色.
item-text-left-margin - 选项文字的左边距.
item-text-right-margin - 选项文字的右边距.

font - 字体，可填'default'.

fontsize - 字体大小，可填'default'.

lineheight - 文字行高，可填'default'.

backgroundcolor - 背景颜色与透明度 - 格式: 0xAARRGGBB.

textcolor - 选项的文字颜色.

disabled-textcolor - 非可选项文字颜色.

borderwidth - 边框宽度.

bordercolor - 边框颜色.

borderradius - 边框圆角的弧度.

shadow-x-offset - 阴影X坐标偏移量.

shadow-y-offset - 阴影y坐标偏移量.

shadow-blur-range - 阴影模糊范围.

shadow-color - 阴影颜色和透明度 - 格式: 0xAARRGGBB.

innerborder - 内边框宽度.

innerbordercolor - 内边框颜色.

padding-top - 顶部填充距离.

padding-bottom - 选项底部填充距离.

seperator-margin - 分割线上下边距.

seperator-color - 分割线颜色.

seperator-second-line-color - 次分割线颜色.

item-padding - 选项内填充距离.

item-borderwidth - 选项内边框宽度.

item-bordercolor - 选项内边框颜色.

item-borderradius - 选项内边框圆角弧度.

item-margin - 选项的边距.

item-hover-backgroundcolor - 鼠标移上或点击后选项颜色.

item-hover-bordercolor - 鼠标移上或点击后选项边框颜色.

item-hover-textcolor - 鼠标移上或点击后选项文字颜色.

item-text-left-margin - 选项文字的左边距.

item-text-right-margin - 选项文字的右边距.

默认样式，在不同设备浏览器会默认选择不同组合，您可以自己修改default内样式，也可以重新定义新的样式

1、默认linux\iOS\Android

<contextmenu customstyle="default|default|150%|0xFFFFFF|0x000000|0xBBBBBB|1|0xBBBBBB|0|2|2|8|0x66000000|0|0|2|2|5|0xE0E0E0|none|4|0|0|0|3|0xEEEEEE|0|0|18|12" />

1	<contextmenu customstyle="default\|default\|150%\|0xFFFFFF\|0x000000\|0xBBBBBB\|1\|0xBBBBBB\|0\|2\|2\|8\|0x66000000\|0\|0\|2\|2\|5\|0xE0E0E0\|none\|4\|0\|0\|0\|3\|0xEEEEEE\|0\|0\|18\|12" />

2、默认osx

<contextmenu customstyle="default|14|default|0xFFFFFF|0x000000|0xBBBBBB|0|0|5|2|2|8|0x66000000|0|0|1|4|5|0xEEEEEE|none|1|0|0|0|3|0xEEEEEE|0|0|20|12" />

1	<contextmenu customstyle="default\|14\|default\|0xFFFFFF\|0x000000\|0xBBBBBB\|0\|0\|5\|2\|2\|8\|0x66000000\|0\|0\|1\|4\|5\|0xEEEEEE\|none\|1\|0\|0\|0\|3\|0xEEEEEE\|0\|0\|20\|12" />

3、自定义举例

<contextmenu customstyle="Helvetica|16|default|0x55000000|0xFFFFFF|0x555555|1|0xFFFFFF|8|0|0|8|0x44000000|0|0|4|4|6|0x555555|none|4|0|0|0|3|0xEEEEEE|0|0|12|12" />

1	<contextmenu customstyle="Helvetica\|16\|default\|0x55000000\|0xFFFFFF\|0x555555\|1\|0xFFFFFF\|8\|0\|0\|8\|0x44000000\|0\|0\|4\|4\|6\|0x555555\|none\|4\|0\|0\|0\|3\|0xEEEEEE\|0\|0\|12\|12" />

4、仿win7效果

<contextmenu customstyle="default|default|default|0xF0F0F0|0x000000|0xBBBBBB|1|0x979797|0|2|2|2|0x66000000|2|0xf5f5f5|0|4|4|0xE0E0E0|0xFFFFFF|3|1|0xF0F0F0|3|0|0xE8EEF6|0xAECFF7|0|18|12" />

1	<contextmenu customstyle="default\|default\|default\|0xF0F0F0\|0x000000\|0xBBBBBB\|1\|0x979797\|0\|2\|2\|2\|0x66000000\|2\|0xf5f5f5\|0\|4\|4\|0xE0E0E0\|0xFFFFFF\|3\|1\|0xF0F0F0\|3\|0\|0xE8EEF6\|0xAECFF7\|0\|18\|12" />