fuliyefly 2019-11-19 17:05 采纳率: 0%
浏览 787

如何屏蔽微信播放视频右上角上名字为全屏的按钮

微信X5内核浏览器打开视频,已经把视频video标签设置好了 可以屏蔽自动全屏和一系列的相关显示。 但现在安卓上打开只有右上角有个名字为全屏的按钮 ,ios上没有 ,请问有没有什么方法可以屏蔽右上角的全屏这个按钮?

  • 写回答

1条回答 默认 最新

  • usp1994 2023-04-06 13:38
    关注

    微信X5内核浏览器在 Android 平台上的视频播放器控件默认会显示一个全屏按钮,但这个按钮并不能通过标准的 HTML5 video 标签的属性来控制。如果你希望在微信X5内核浏览器中屏蔽这个全屏按钮,你可以尝试以下两种方法:

    1. 使用微信JS-SDK提供的接口:wx.hideMenuItems,该接口可以用于隐藏微信右上角的菜单项,包括全屏按钮。你可以在视频播放页面的 JS 代码中加入以下代码:
    wx.ready(function() {
      wx.hideMenuItems({
        menuList: ['menuItem:exposeArticle', 'menuItem:setFont', 'menuItem:dayMode', 'menuItem:nightMode',
                   'menuItem:refresh', 'menuItem:profile', 'menuItem:addContact', 'menuItem:share:appMessage',
                   'menuItem:share:timeline', 'menuItem:share:qq', 'menuItem:share:weiboApp',
                   'menuItem:favorite', 'menuItem:share:facebook', 'menuItem:share:QZone',
                   'menuItem:editTag', 'menuItem:delete', 'menuItem:originPage', 'menuItem:readMode',
                   'menuItem:openWithQQBrowser', 'menuItem:openWithSafari', 'menuItem:share:email',
                   'menuItem:share:brand'
                  ]
      });
    });
    

    上述代码中,我们使用了 wx.hideMenuItems 接口隐藏了右上角的所有菜单项,包括全屏按钮。

    需要注意的是,使用 wx.hideMenuItems 需要在微信JS-SDK初始化后调用,且该方法只能在微信浏览器中使用,如果你需要在其他浏览器中使用,需要使用其他方法。

    1. 使用 CSS 样式控制:你可以使用 CSS 样式来控制全屏按钮的显示,例如通过 display: none 来隐藏按钮。具体来说,你可以在样式表中加入以下代码:
    x5-video-player video::-webkit-media-controls-fullscreen-button {
      display: none !important;
    }
    

    上述代码中,我们使用了 ::-webkit-media-controls-fullscreen-button 伪元素来选择全屏按钮,然后通过 display: none 将其隐藏。

    需要注意的是,这种方法只能隐藏全屏按钮,但用户仍然可以通过其他手段(如系统手势)全屏播放视频。

    评论

报告相同问题?

悬赏问题

  • ¥15 关于#wireshark#的问题:并且能够给数据做标注,如这个流量是在看视频或者是在转账
  • ¥90 请问,这个视频播放软件的名称,用过的朋友请给答案,上方..avi是啥意思?是看短剧还是播放本地视频?
  • ¥15 运筹优化,gurobi,python
  • ¥15 基于python的电影系统推荐
  • ¥20 springmvc重定向和返回json
  • ¥15 数学建模——参会安排怎么做
  • ¥15 电脑键盘实现触摸功能
  • ¥25 matlab无法将表达式转换为双数组怎么解决?
  • ¥15 单片机汇编语言相关程序
  • ¥20 家用射频美容仪技术规格