用户自定义 Tooltip

将图片隐藏

首先打开AxureCustomTooltip.rp 然后打开 Custom Tooltip 页面。

一般地，我们想让 Tooltip 隐藏起来，所以在 Style 选项板中选中 Hidden 选项。

使用 OnMouseEnter 来显示面板

选中 UX Man 图片然后双击 interactions 选项板中的 OnMouseEnter 选项。

添加显示动作

在事例编辑器中，选中 Show 然后检查 Tooltip 的图片。

在更多选项中选中 Treat as Flyout

在 More Options 的下拉列表中选中 Treat as Flyout。

预览原型然后测试。

温馨提示

下载编程狮App，免费阅读超1000+编程语言教程

取消

确定

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }

w3cschool 编程狮，随时随地学编程

用户自定义 Tooltip