HTML5技术

webix datatable 列头加tooltip - 说我

字号+ 作者:H5之家 来源:H5之家 2016-11-20 14:00 我要评论( )

webix的表格,头部没有tooltip的属性支持 onmousemove只监听了数据部分,对列头没有监听。官网上演示的是在header属性上写个span 加个title的属性,但是样式不好看。然后我就直接参照写了个。用的是监听加载完成后的事件。用于加载后确定列的情况。 1、效果

webix的表格,头部没有tooltip的属性支持 onmousemove只监听了数据部分,对列头没有监听。官网上演示的是在header属性上写个span 加个title的属性,但是样式不好看。然后我就直接参照写了个。用的是监听加载完成后的事件。用于加载后确定列的情况。

1、效果如下

 

代码如下,拷贝到html文件下直接执行科看到效果

Loading data in the 'select' editor webix.ready(function () { webix.ui({ view: , on: { onAfterRender: function () { .config.columns; ) { webix.ui({ view: , template: , height: 100 }) (e) { t.hide(); clearTimeout(this.timeout); t.value = this.firstChild.textContent; (value) { t.show({value: t.value}, {x: e.clientX + 3, y: e.clientY}) }, 500); }); (e) { clearTimeout(this.timeout); t.hide(); }) } } }, tooltip: true, type: , columns: [ {id: }, {id: }, { id: , header: }, {id: } ], data: [ {id: }, {id: } ] }); });

红色部分为列头tooltip的代码

凑150 个字-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • webix icon 图标 - 说我

    webix icon 图标 - 说我

    2016-11-15 18:00

网友点评