- 公众号内嵌 iframe 腾讯视频,ios端有全屏按钮可全屏,安卓端无法看到全屏按钮,无法全屏播放?
公众号内嵌 iframe 腾讯视频,ios端有全屏按钮可全屏,安卓端无法看到全屏按钮,无法全屏播放。在开发者工具内,发现只有安卓端全屏代码按钮代码中会多“txp_none”类。苹果端没有。具体请看以下代码 苹果端: [图片] <div class="txp_right_controls"> <button class="txp_btn txp_btn_playrate txp_none" aria-label="倍速"> <div class="txp_label">倍速</div> </button> <button class="txp_btn txp_btn_definition" data-status="false" aria-label="清晰度"> <div class="txp_label">720P</div> </button> <button class="txp_btn txp_btn_fullscreen" data-status="false" aria-label="全屏"> <svg class="txp_icon txp_icon_fullscreen" viewBox="0 0 24 24"> <use class="txp_svg_fullscreen" xlink:href="#txp_svg_fullscreen"></use> <use class="txp_svg_fullscreen_true" xlink:href="#txp_svg_fullscreen_true"></use> </svg> </button> <button class="txp_btn txp_btn_fullscreen txp_none txp_btn_fake" data-status="false" aria-label="伪全屏"> <svg class="txp_icon txp_icon_fullscreen" viewBox="0 0 24 24"> <use class="txp_svg_fullscreen" xlink:href="#txp_svg_fullscreen"></use> <use class="txp_svg_fullscreen_true" xlink:href="#txp_svg_fullscreen_true"></use> </svg> </button> </div> 安卓端: [图片] <div class="txp_right_controls"> <button class="txp_btn txp_btn_playrate txp_none" aria-label="倍速"> <div class="txp_label">倍速</div> </button> <button class="txp_btn txp_btn_definition" data-status="false" aria-label="清晰度"> <div class="txp_label">720P</div> </button> <button class="txp_btn txp_btn_fullscreen txp_none" data-status="false" aria-label="全屏"> <svg class="txp_icon txp_icon_fullscreen" viewBox="0 0 24 24"> <use class="txp_svg_fullscreen" xlink:href="#txp_svg_fullscreen"></use> <use class="txp_svg_fullscreen_true" xlink:href="#txp_svg_fullscreen_true"></use> </svg> </button> <button class="txp_btn txp_btn_fullscreen txp_none txp_btn_fake" data-status="false" aria-label="伪全屏"> <svg class="txp_icon txp_icon_fullscreen" viewBox="0 0 24 24"> <use class="txp_svg_fullscreen" xlink:href="#txp_svg_fullscreen"></use> <use class="txp_svg_fullscreen_true" xlink:href="#txp_svg_fullscreen_true"></use> </svg> </button> </div> 希望能解决这个问题
2022-10-21 - 微信公众号嵌入的 iframe 腾讯视频,在安卓微信上无法全屏播放,没有全屏播放按钮
微信公众号嵌入的 iframe 腾讯视频,在安卓微信上无法全屏播放,没有全屏播放按钮。苹果端正常。在微信开发者工具上,发现了全屏代码按钮代码中只有在安卓设备中多了“txp_none”这个类,导致的无法显示全屏按钮。以下是苹果设备与安卓设备的代码: 苹果端: <div class="txp_right_controls"> <button class="txp_btn txp_btn_playrate txp_none" aria-label="倍速"> <div class="txp_label">倍速</div> </button> <button class="txp_btn txp_btn_definition" data-status="false" aria-label="清晰度"> <div class="txp_label">720P</div> </button> <button class="txp_btn txp_btn_fullscreen" data-status="false" aria-label="全屏"> <svg class="txp_icon txp_icon_fullscreen" viewBox="0 0 24 24"> <use class="txp_svg_fullscreen" xlink:href="#txp_svg_fullscreen"></use> <use class="txp_svg_fullscreen_true" xlink:href="#txp_svg_fullscreen_true"></use> </svg> </button> <button class="txp_btn txp_btn_fullscreen txp_none txp_btn_fake" data-status="false" aria-label="伪全屏"> <svg class="txp_icon txp_icon_fullscreen" viewBox="0 0 24 24"> <use class="txp_svg_fullscreen" xlink:href="#txp_svg_fullscreen"></use> <use class="txp_svg_fullscreen_true" xlink:href="#txp_svg_fullscreen_true"></use> </svg> </button> </div> 安卓端: [图片] <div class="txp_right_controls"> <button class="txp_btn txp_btn_playrate txp_none" aria-label="倍速"> <div class="txp_label">倍速</div> </button> <button class="txp_btn txp_btn_definition" data-status="false" aria-label="清晰度"> <div class="txp_label">720P</div> </button> <button class="txp_btn txp_btn_fullscreen txp_none" data-status="false" aria-label="全屏"> <svg class="txp_icon txp_icon_fullscreen" viewBox="0 0 24 24"> <use class="txp_svg_fullscreen" xlink:href="#txp_svg_fullscreen"></use> <use class="txp_svg_fullscreen_true" xlink:href="#txp_svg_fullscreen_true"></use> </svg> </button> <button class="txp_btn txp_btn_fullscreen txp_none txp_btn_fake" data-status="false" aria-label="伪全屏"> <svg class="txp_icon txp_icon_fullscreen" viewBox="0 0 24 24"> <use class="txp_svg_fullscreen" xlink:href="#txp_svg_fullscreen"></use> <use class="txp_svg_fullscreen_true" xlink:href="#txp_svg_fullscreen_true"></use> </svg> </button> </div> 希望能够解决这个问题
2022-10-21