微信小程序可拖拽视频播放案例

如图所示

使用原生小程序组件 movable-area movable-view 注意movable-view必须在area内

官方组件地址

wxml

    <movable-area class="movableArea"><movable-view class="movableView" out-of-bounds="false" x="10" y="10" scale direction="all"><view class="movableAreaMask"><video id="myVideo" src="**" autoplay="{{videoAutoPlay}}" binderror="videoErrorCallback" controls></video></view></movable-view></movable-area>

css

.movableArea {pointer-events: none;width: 100%;height: 100%;z-index: 999;position: absolute;left: 0px;top: 0px;
}.movableView {width: 720rpx;height: 300rpx;pointer-events: auto;
}.movableAreaMask {background: rgba(0, 0, 0, .25);border-radius: 20rpx;box-sizing: border-box;padding: 10rpx;
}