精选圈子榜单优站
苹果综合
苹果综合
技术
53关注
一起探讨苹果系列产品、软件使用。

Axure 教程,如何在 Axure 中使用 JavaScript 实现浏览器全屏模式?


欢迎观看 Axure 教程,小编带大家学习 Axure 的基本工具和使用技巧,了解如何在 Axure 中使用 JavaScript 实现浏览器全屏模式。

在设计大屏模板时,需要使用浏览器全屏模式来展示模板。通常需要通过键盘上的F11来切换浏览器全屏模式。 但是,很多用户并不理解通过F11可以实现全面屏,给产品设计沟通带来不便。

现在让我们学习如何使用 JavaScript 实现浏览器全屏模式。

什么是 JavaScript?

JavaScript 是一种脚本语言。 通常浏览器使用它来实现交互效果。 在 Axure 生成的 HTML 原型中,交互效果是通过 JavaScript 代码实现的。 Axure 还提供了引用 JavaScript 代码的方法。

小部件设置

1. 设计一张卡片并将其创建为动态面板,然后固定到浏览器,中心和中间。

2.使用按钮链接创建一个动态面板并将其命名为「进入/退出全屏模式」。状态 1 的按钮文本是进入全屏模式, 状态 2 的按钮文本是退出全屏模式。



点击「进入/退出全屏模式」动态面板状态1的进入全屏模式按钮设置点击,「打开链接」-「链接到外部URL」-在「fx输入」中输入以下代码:

javascript: 函数 requestFullScreen(element) { var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullScreen; if (requestMethod) { requestMethod.call(element); }  else if (typeof window.ActiveXObject !== "undefined") { var wscript = new ActiveXObject("WScript.Shell"); if (wscript !== null) { wscript.SendKeys("{F11}"); } } };  requestFullScreen(document.documentElement);

点击「进入/退出全屏模式」动态面板状态2的「退出全屏模式」按钮设置点击事件,「打开链接」-「链接到外部URL」-在「fx输入」中输入以下代码:   

javascript: 函数 exitFull() { var exitMethod = document.exitFullscreen || 文档.mozCancelFullScreen || document.webkitExitFullscreen || document.webkitExitFullscreen; if (exitMethod) { exitMethod.call(document); } else if (typeof window.ActiveXObject !== "undefined") { var wscript = new ActiveXObject("WScript.Shell"); if (wscript !== null) { wscript.SendKeys("{F11}"); } } }; 退出全();

这样就完成了所有的设置。

以上就是在 Axure 中使用 JavaScript 实现浏览器全屏模式的方法。需要 Axure 软件的朋友可在本站下载,关注本站,学习Mac软件使用方法!

Axure RP 9 for Mac(原型设计软件)


  • 若文章侵犯了您的权益,请联系我们进行处理。

  • 2022-09-05
  • 440阅读
评论