工具位置
Image Removed
画面效果
Image Removed
Image Added
方法
- pkfoldingpanelpknavigation.setData(objectname,data),设置所有选项的json数据。
- 示例:pkfoldingpanel示例:pknavigation.setData("panel1",
[{"title
"name": "目录1",
"grade":"1",
"id":"面板11",
"contenticon":"面板1子内容fa\tfa-fire"
}, {
"name": "目录2",
"spread"1,"image":"page/up/menu1.jpg"}],children:[]}); - 需要能够指定:缺省时展开哪一个级别的面板
专有事件
- grade":"1",
"id":"2",
"icon":"fa\tfa-list-ul",
"children": [{
"name": "二级目录A",
"grade":"2",
"id":"4"
},
{
"name": "二级目录B",
"grade":"2",
"id":"5",
"children": [{
"name": "三级目录A",
"grade":"3",
"id":"6"
},
{
"name": "三级目录B",
"grade":"3",
"id":"7"
},
{
"name": "三级目录C",
"grade":"3",
"id":"8"
},
{
"name": "三级目录D",
"grade":"3",
"id":"9"
},
]
}
]
}, {
"name": "目录3",
"grade":"1",
"id":"3",
"icon":"fa\tfa-bolt"
}]) - 一级菜单可以配置左侧icon图标,需要配置icon字段,value具体参考awesome文档http://www.fontawesome.com.cn/icons-ui/,空格请用”\t“代替
Image Added
Image Added
- pknavigation.setStyle(objectname,data) 设置控件样式
- 示例:pknavigation.setStyle('panel1',{
main:{
bgColor:'#0e144f',
color:'#FFF',
iconColor:'#FFF',
textAlign:'center',
height:'50px'
},
firstClassMenu:{
bgColor:'#1d1056',
bgActiveColor:'#1d1056',
hoverColor:'#1d1056',
fontSize:"14px"
},
twoLevelMenu:{
bgColor:'#1d1056;',
bgActiveColor:'#1d1056',
hoverColor:'#1d1056',
fontSize:"12px"
},
threeLevelMenu:{
bgColor:'#000235',
bgActiveColor:'#1d1056',
hoverColor:'#1d1056',
fontSize:"12px"
}
}) - main 主体区域
- bgColor 背景色
- color 文字颜色
- iconColor 图标颜色
- textAlign 文字对齐方式
- height 行高
- firstClassMenu 一级菜单
- bgColor 背景色
- bgActiveColor 选中状态背景色
- hoverColor 鼠标移入状态背景色
- fontSize 文字大小
- twoLevelMenu 二级菜单
- bgColor 背景色
- bgActiveColor 选中状态背景色
- hoverColor 鼠标移入状态背景色
- fontSize 文字大小
- threeLevelMenu 三级菜单
- bgColor 背景色
- bgActiveColor 选中状态背景色
- hoverColor 鼠标移入状态背景色
- fontSize 文字大小
专有事件
- onClick事件。当状态发生改变时,触发onClick事件。参数:objectname,value。示例:value:{ "name": "目录3","grade":"1","id":"3"} 其他属性根据setData时设定哪些就返回哪些
- 其中value:返回的是选中节点的信息数组,至少包括id和name,其他属性根据setData时设定哪些就返回哪些onClick事件。当状态发生改变时,触发onChange事件。参数:objectname,value。

专有动画关联
专有属性配置对话框
{"serverDuration": 153, "requestCorrelationId": "09b7d4371ae64b7f"}