【親測有效】支持橫豎屏 微信小程序video禁止進度條拖動,微信小程序遮罩進度條,

背景:部分課程禁止客戶拖動視頻進度條直至播放結束

紅色是遮罩區域遮罩區域

測試遮罩效果

實際遮罩效果(有一個很淺的陰影區域)

在這里插入圖片描述

實現代碼

.wxml文件

<video enable-progress-gesture="false" ><cover-view  class="cover"></cover-view></video>

.wxss文件

.cover{position: absolute;bottom: 0;z-index: 998;height: 20%;background-color: red;left: 10%;background-color: rgba(255, 255, 255, 0.007);width: 80%;
}

background-color: red;是為了方便調試的時候使用可刪除
.cover中的width可調整大概位置在70-80之間

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/212620.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/212620.shtml
英文地址,請注明出處:http://en.pswp.cn/news/212620.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

基于深度學習的yolov7植物病蟲害識別及防治系統

歡迎大家點贊、收藏、關注、評論啦 &#xff0c;由于篇幅有限&#xff0c;只展示了部分核心代碼。 文章目錄 一項目簡介簡介YOLOv7 系統特性工作流程 二、功能三、系統四. 總結 一項目簡介 # YOLOv7植物病蟲害識別及防治系統介紹 簡介 該系統基于深度學習技術&#xff0c;采…

Seata配置

參考教程 seata 分布式事務的環境搭建與使用 Seata 1.4.0 nacos配置和使用&#xff0c;超詳細 Seata 1.4.2 的安裝 Nacos的配置和使用 官網下載地址 本文以v1.4.1為例 1.數據庫及表的創建 創建seata數據庫&#xff0c;創建以下表&#xff08;右鍵連接-》新建數據庫seata-》…

kubeadm搭建1.20.7版本k8s

資源 服務器名稱ip地址服務master1&#xff08;2C/4G&#xff0c;cpu核心數要求大于2&#xff09;192.168.100.10docker、kubeadm、kubelet、kubectl、flannelnode01&#xff08;2C/2G&#xff09;192.168.100.30docker、kubeadm、kubelet、kubectl、flannelnode02&#xff08…

windows系統proteus中Ardunio Mega 2560和虛擬機上Ubuntu系統CuteCom進行串口通信

在文章利用proteus實現串口助手和arduino Mega 2560的串口通信-CSDN博客 中&#xff0c;實現了windows系統的proteus中Ardunio Mega 2560和SSCOM通過虛擬串口進行通信。虛擬串口的連接示意圖如下圖所示。 在文章windows系統和虛擬機上ubuntu系統通過虛擬串口進行通信-CSDN博客…

3DMAX關于顯示驅動問題的解決方法大全

3DMAX與顯卡驅動有關的問題主要有以下幾種情況&#xff1a; 1.3DMAX啟動彈出這樣的界面&#xff1a; 2.主工具欄按鈕不顯示&#xff0c;或者鼠標移上去才顯示&#xff08;刷新問題&#xff09;。 3&#xff0e;視口菜單不顯示或顯示不全。 問題分析&#xff1a; 首先&#x…

安全基礎從0開始

文章目錄 常見名詞小實戰 網站搭建小實戰抓包模擬器狀態碼返回值網站搭建WEB應用安全漏洞 數據包&封包&信息收集**參考點** 常見名詞 前后端&#xff0c;POC/EXP&#xff0c;Payload/Shellcode&#xff0c;后門/Webshell&#xff0c;木馬/病毒&#xff0c; 反彈&…

ReactNative0.73發布,架構升級與更好的調試體驗

這次更新包含了多種提升開發體驗的改進&#xff0c;包括&#xff1a; 更流暢的調試體驗: 通過 Hermes 引擎調試支持、控制臺日志歷史記錄和實驗性調試器&#xff0c;讓調試過程更加高效順暢。穩定的符號鏈接支持: 簡化您的開發工作流程&#xff0c;輕松將文件或目錄鏈接到其他…

react表單-受控

react - 表單組件 受控組件 表單項中的值&#xff08;value/checked&#xff09;受到類組件state中數據來控制&#xff0c;同時還需要綁定一個onChange事件來完成對state中數據的修改 import React, { Component } from react;class AppInput extends Component {// 設置受控組…

基于ssm應急資源管理系統論文

摘 要 現代經濟快節奏發展以及不斷完善升級的信息化技術&#xff0c;讓傳統數據信息的管理升級為軟件存儲&#xff0c;歸納&#xff0c;集中處理數據信息的管理方式。本應急資源管理系統就是在這樣的大環境下誕生&#xff0c;其可以幫助管理者在短時間內處理完畢龐大的數據信息…

排序算法之七:歸并排序(遞歸)

基本思想 基本思想&#xff1a; 歸并排序&#xff08;MERGE-SORT&#xff09;是建立在歸并操作上的一種有效的排序算法,該算法是采用分治法&#xff08;Divide and Conquer&#xff09;的一個非常典型的應用。將已有序的子序列合并&#xff0c;得到完全有序的序列&#xff1…

C++:this指針

目錄 前言 成員函數返回this指向的對象本身時&#xff0c;為什是返回引用類型&#xff1f; 成員函數返回this對象本身時&#xff0c;內部通常會通過拷貝構造函數來創建一個臨時對象&#xff1f; 總結 前言 c通過提供特殊的對象指針&#xff0c;this指針 指向被調用的成員函…

openssl 常用命令 pkcs12

openssl pkcs12 openssl pkcs12 官方文檔 1. 描述 The pkcs12 command allows PKCS#12 files (sometimes referred to as PFX files) to be created and parsed. PKCS#12 files are used by several programs including Netscape, MSIE and MS Outlook. pkcs12 命令是用來創…

Nodejs 第二十二章(腳手架)

編寫自己的腳手架 那什么是腳手架&#xff1f; 例如:vue-cli Angular CLI Create React App 編寫自己的腳手架是指創建一個定制化的工具&#xff0c;用于快速生成項目的基礎結構和代碼文件&#xff0c;以及提供一些常用的命令和功能。通過編寫自己的腳手架&#xff0c;你可以…

Linux和Windows環境下如何使用gitee?

1. Linux 1.1 創建遠程倉庫 1.2 安裝git sudo yum install -y git 1.3 克隆遠程倉庫到本地 git clone 地址 1.4 將文件添加到git的暫存區&#xff08;git三板斧之add&#xff09; git add 文件名 # 將指定文件添加到git的暫存區 git add . # 添加新文件和修改過的…

深入理解HTTP狀態碼及其在Web開發中的應用

在Web開發中&#xff0c;我們經常需要與服務器進行交互&#xff0c;以獲取或發送數據。為了實現這一目標&#xff0c;我們使用HTTP協議。HTTP協議是一種無狀態的、應用層的協議&#xff0c;它定義了客戶端和服務器之間的通信方式。在HTTP協議中&#xff0c;有五種常用的HTTP狀態…

Python高級算法——動態規劃

Python中的動態規劃&#xff1a;高級算法解析 動態規劃是一種解決多階段決策問題的數學方法&#xff0c;常用于優化問題。它通過將問題分解為子問題&#xff0c;并在解決這些子問題的基礎上構建全局最優解。在本文中&#xff0c;我們將深入講解Python中的動態規劃&#xff0c;…

vs2017+qt5.14.2遇到的問題

1、在安裝qt插件后&#xff0c;導入pro文件時&#xff0c;報 msvc-version.conf loaded but QMAKE_MSC_VER isn’t set 修改E:\Qt\Qt5.14.2\5.14.2\msvc2017_64\mkspecs\common\msvc-version.conf文件中添加

RabbitMQ學習筆記10 綜合實戰 實現新商家規定時間內上架商品檢查

配置文件&#xff1a; 記住添加這個。 加上這段代碼&#xff0c;可以自動創建隊列和交換機以及綁定關系。 我們看到了我們創建的死信交換機和普通隊列。 我們可以看到我們隊列下面綁定的交換機。 我們創建一個controller包進行測試: 啟動&#xff1a; 過一段時間會變成死信隊列…

elasticsearch|大數據|elasticsearch的api部分實戰操作以及用戶和密碼的管理

一&#xff0c; 前言 本文主要內容是通過elasticsearch的api來進行一些集群的管理和信息查詢工作&#xff0c;以及elasticsearch用戶的增刪改查和密碼的重設以及重置如何操作 接上文&#xff1a;elasticsearch|大數據|elasticsearch低版本集群的部署安裝和安全增強---密碼設…

SSM與SpringBoot面試題總結

什么是spring&#xff1f;談談你對IOC和AOP的理解。 Spring:是一個企業級java應用框架&#xff0c;他的作用主要是簡化軟件的開發以及配置過程&#xff0c;簡化項目部署環境。 Spring的優點: 1、Spring低侵入設計&#xff0c;對業務代碼的污染非常低。 2、Spring的DI機制將…