红枫 发表于 2021-6-6 13:12
我感觉你这样的处理比用按钮效果更好。赞一个！
谢谢您的建议
195400 发表于 2021-6-5 22:07
我认为按钮方案不可取，理由是按钮放在画面上一样是遮挡画面，而放在画面外则整体性就破坏了。
现 ...
在手机上看显示不了菜单。:'(
<script type="text/javascript">
document.write(unescape("%3Cstyle%20type%3D%22text/css%22%3E%0A%09%23playframe%09%7B%0A%09%09width%3A1000px%3Bheight%3Aauto%20%21imprtant%3B%0A%09%09margin%3A100px%20auto%2032px%20-100px%3B%0A%09%09position%3Arelative%3B%0A%09%09background%3Agray%20url%28http%3A//www.hitow.net/data/attachment/album/201603/29/130457ouulphaq9pnpqiu7.jpg%29%200%200%20/%20cover%3B%0A%09%09overflow%3Ahidden%3B%0A%09%09border%3A12px%20brown%20ridge%3B%0A%09%09border-radius%3A12px%3B%0A%09%09min-height%3A320px%3B%0A%09%09font-size%3A24px%3B%0A%09%09font-weight%3Abold%3B%0A%09%7D%0A%3C/style%3E%0A%0A%3Cdiv%20id%3D%22playframe%22%20style%3D%22%22%3E%0A%0A%3C/div%3E%0A%0A%3Cscript%20type%3D%22text/javascript%22%3E%0A%09var%20videoArray%20%3D%20%5B%09//%09%u6B4C%u66F2%u89C6%u9891%u53C2%u6570%u7EC4%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNDQzNTIxNjE4OA%3D%3D.mp4%22%2C%20%22%u300A%u6211%u7684%u4E2D%u56FD%u68A6..%u300B%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNDk2MDY0OTQ1Ng%3D%3D.mp4%22%2C%20%22%u300A%u6211%u4EEC%u8FD9%u4E00%u8F88%u300B---%20%u738B%u4F51%u8D35%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNTE2MDAwMzAzNg%3D%3D.mp4%22%2C%20%22%u300A%u5C71%u8DEF%u5341%u516B%u5F2F%u300B---%20%u674E%u743C%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNDE5NzM3NTQ0OA%3D%3D.mp4%22%2C%20%22%u300A%u6E34%u671B%u300B%20---%20%u6BDB%u963F%u654F%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XMzc2NzU3NjUwMA%3D%3D.mp4%22%2C%20%22%u300A%u9752%u85CF%u9AD8%u539F%u300B%20---%20%u97E9%u7EA2%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNDkzMTE3NDcyMA%3D%3D.mp4%22%2C%20%22%u300A%u53EF%u53EF%u6258%u6D77%u7684%u7267%u7F8A%u4EBA%u300B---%20%u4E9A%u7537%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNDQ2ODQzMjk3Mg%3D%3D.mp4%22%2C%20%22%u300A%u846C%u82B1%u541F%u300B---%20%u9648%u529B%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNTA0Njg3OTM2NA%3D%3D.mp4%22%2C%20%22%u300A%u9001%u4EB2%u300B---%20%u4E9A%u7537%22%5D%2C%20%20%0A%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNDAzNDA3MTc0NA%3D%3D.mp4%22%2C%20%22%u300A%u559C%u6B22%u4F60%u300B---%20%u8FB9%u5DF4%u5FB7%u5409%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XMzQ3MDczOTEwOA%3D%3D.mp4%22%2C%20%22%u300A%u65F6%u95F4%u90FD%u53BB%u54EA%u513F%u4E86%u300B---%20%u59DA%u8D1D%u5A1C%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNDY2NDMzNjczNg%3D%3D.mp4%22%2C%20%22%u300A%u5927%u6D77%u822A%u884C%u9760%u8235%u624B%u300B---%20%u8D3E%u4E16%u9A8F%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNDI5NjM1NDU2MA%3D%3D.mp4%22%2C%20%22%u300A%u6211%u548C%u6211%u7684%u7956%u56FD%u300B---%20%u6BB7%u79C0%u6885%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNDIxNzQ1NDY5Ng%3D%3D.mp4%22%2C%20%22%u300A%u897F%u6D77%u60C5%u6B4C%u300B---%20%u964D%u592E%u5353%u739B%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNTE1MTQ2MTIyMA%3D%3D.mp4%22%2C%20%22%u300A%u5317%u4EAC%u7684%u91D1%u5C71%u4E0A%u300B---%20%u624D%u65E6%u5353%u739B%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNDk2NDk2NTQwMA%3D%3D.mp4%22%2C%20%22%u300A%u5531%u652F%u5C71%u6B4C%u7ED9%u515A%u542C%u300B---%20%u624D%u65E6%u5353%u739B%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XMzUyNzMwMjE4MA%3D%3D.mp4%22%2C%20%22%u300A%u518D%u5531%u5C71%u6B4C%u7ED9%u515A%u542C%u300B---%20%u964D%u592E%u5353%u739B%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNDQ5NTg4MzE0MA%3D%3D.mp4%22%2C%20%22%u300A%u59BB%u5B50%u8F9B%u82E6%u4E86%u300B---%20%u9F9A%u73A5%22%5D%2C%20%20%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNDI0MTIyMjI2MA%3D%3D.mp4%22%2C%20%22%u300A%u59BB%u5B50%u300B---%20%u8C2D%u6676%22%5D%2C%20%20%0A//%09%09%5B%22https%3A//vd2.bdstatic.com/mda-jjiv8b6bz3y9mn2y/sc/mda-jjiv8b6bz3y9mn2y.mp4%22%2C%20%22%u300A%u90A3%u4E00%u5929%u300B---%20%u964D%u592E%u5353%u739B%22%5D%2C%0A%0A%09%09%5B%22http%3A//url.amp3a.com/youku.php/XNTE1NTM1MTU0OA%3D%3D.mp4%22%2C%20%22%u300A%u77E5%u9752%u4E4B%u6B4C%u300B%22%5D%0A%09%5D%3B%0A%09var%09opts%20%3D%09%7B%0A%09%09videoParas%3AvideoArray%2C%0A%09%09frameID%3A%22playframe%22%0A%09%7D%3B%0A%09%0A%09function%20playMP4%28opts%29%09%7B%0A%09%09var%09dFrame%20%3D%20document.getElementById%28opts.frameID%29%3B%0A%09%09//%09%u5EFA%u4E00%u4E2A%20Video%0A%09%09var%20player%20%3D%20document.createElement%28%27video%27%29%3B%0A%09%09player.style.width%20%3D%20%22100%25%22%3B%0A%09%09player.controls%20%3D%20true%3B%0A%09%09player.autoplay%20%3D%20true%3B%0A%09%09dFrame.appendChild%28player%29%3B%0A%09%09%0A%09%09//%20%u5EFA%u4E00%u4E2A%u83DC%u5355%u5217%u8868%0A%09%09var%20divObj%20%3D%20document.createElement%28%27div%27%29%3B%0A%09%09divObj.style.width%20%3D%20%27400px%27%3B%0A%09%09divObj.style.height%20%3D%20%27200px%27%3B%0A%09%09divObj.style.position%20%3D%20%27absolute%27%3B%0A%09%09divObj.style.left%20%3D%20%2730px%27%3B%0A%09%09divObj.style.top%20%3D%20%2720px%27%3B%0A%09%09divObj.style.overflowY%20%3D%20%27auto%27%3B%0A%09%09divObj.style.overflowX%20%3D%20%27hidden%27%3B%0A%09%09divObj.style.visibility%20%3D%20%27hidden%27%3B%0A%09%09divObj.style.scrollbarWidth%20%3D%20%27thin%27%3B%0A%09%09%0A%09%09var%20olObj%20%3D%20document.createElement%28%27ol%27%29%3B%0A%09%09olObj.style.width%20%3D%20%27100%25%27%3B%0A%09%09olObj.height%20%3D%20%27100%25%27%3B%0A%09%09olObj.style.color%20%3D%20%27blue%27%3B%0A%09%09olObj.style.cursor%20%3D%20%27pointer%27%3B%0A%09%09%0A%09%09%0A%09%09//%09%u521D%u59CB%u5316%u83DC%u5355%u9879%0A%09%09var%20items%20%3D%20new%20Array%28%29%3B%0A%09%09for%28i%20%3D%200%20%3B%20i%20%3C%20opts.videoParas.length%3B%20i++%29%09%7B%0A%09%09%09oli%20%3D%20document.createElement%28%27li%27%29%3B%0A%09%09%09oTxt%20%3D%20document.createTextNode%28opts.videoParas%5Bi%5D%5B1%5D%29%3B%0A%09%09%09oli.appendChild%28oTxt%29%3B%0A%09%09%09olObj.appendChild%28oli%29%3B%0A%09%09%09items%5Bi%5D%20%3D%20oli%3B%0A%09%09%7D%0A%09%09%0A%09%09divObj.appendChild%28olObj%29%3B%0A%09%09dFrame.appendChild%28divObj%29%3B%0A%09%09//%0A%09%09dFrame.addEventListener%28%27touchstart%27%2Cfunction%28%29%7B%0A%09%09%09divObj.style.visibility%20%3D%20%27visible%27%3B%0A%09%09%7D%29%3B%0A%09%09dFrame.onmouseover%20%3D%20function%28%29%09%7B%0A%09%09%09divObj.style.visibility%20%3D%20%27visible%27%3B%0A%09%09%7D%0A%09%09%0A%09%09dFrame.addEventListener%28%27gesturechange%27%2Cfunction%28%29%7B%0A%09%09%09divObj.style.visibility%20%3D%20%27hidden%27%3B%0A%09%09%7D%29%3B%0A%09%09%0A%09%09dFrame.onmouseout%20%3D%20function%28%29%09%7B%0A%09%09%09divObj.style.visibility%20%3D%20%27hidden%27%3B%0A%09%09%7D%0A%09%09%09%09%0A%09%09//%09%u4E00%u66F2%u64AD%u653E%u5B8C%u7684%u4E8B%u4EF6%u5904%u7406%0A%09%09player.onended%20%3D%20function%28%29%09%7B%0A%09%09%09items%5BcurIdx%5D.style.color%20%3D%20%27blue%27%3B%0A%09%09%09player.pause%28%29%3B%0A%09%09%09curIdx++%3B%0A%09%09%09if%28curIdx%20%3E%3D%20items.length%29%20curIdx%20%3D%200%3B%0A%09%09%09player.src%20%3D%20opts.videoParas%5BcurIdx%5D%5B0%5D%3B%0A%09%09%09items%5BcurIdx%5D.style.color%20%3D%20%27red%27%3B%0A%09%09%09player.play%28%29%3B%0A%09%09%7D%0A%09%09//%09%u6BCF%u4E2A%u83DC%u5355%u9879%u6DFB%u52A0%u70B9%u51FB%u4E8B%u4EF6%u5904%u7406%0A%09%09for%28n%20%3D%200%3B%20n%20%3C%20items.length%3B%20n++%29%09%7B%0A%09%09%09items%5Bn%5D.onclick%20%3D%20function%28%29%09%7B%0A%09%09%09%09player.pause%28%29%3B%0A%09%09%09%09items%5BcurIdx%5D.style.color%20%3D%20%27blue%27%3B%0A%09%09%09%09for%28j%20%3D%200%3B%20j%20%3C%20items.length%3B%20j++%29%09%7B%0A%09%09%09%09%09if%28this.innerHTML%20%3D%3D%20opts.videoParas%5Bj%5D%5B1%5D%29%09%7B%0A%09%09%09%09%09%09player.src%20%3D%20opts.videoParas%5Bj%5D%5B0%5D%3B%0A%09%09%09%09%09%09this.style.color%20%3D%20%27red%27%3B%0A%09%09%09%09%09%09curIdx%20%3D%20j%3B%0A%09%09%09%09%09%09break%3B%0A%09%09%09%09%09%7D%0A%09%09%09%09%7D%0A%09%09%09%09player.play%28%29%3B%0A%09%09%09%7D%0A%09%09%7D%0A%0A%09%09//%20%u521D%u59CB%u5316%u64AD%u653E%u53C2%u6570%0A%09%09var%20curIdx%20%3D%200%3B%0A%09%09player.focus%28%29%3B%0A%09%09player.src%20%3D%20opts.videoParas%5BcurIdx%5D%5B0%5D%3B%0A%09%09items%5BcurIdx%5D.style.color%20%3D%20%27red%27%3B%0A%09%09%0A%09%7D%0A%0A%09playMP4%28opts%29%3B%0A%3C/script%3E"));
</script>
华妹 发表于 2021-6-8 22:13
在手机上看显示不了菜单。
1.从没在手机上做过编写代码；
2.33楼添加了手机的触摸事件处理，触摸屏幕就可以打开菜单，但很不容易选择；
3.23楼没有触摸事件处理也可以打开菜单（IOS safari浏览器），手机品牌很多，浏览器种类也不少但没条件测试。
4. 手机屏幕太小，看起来很吃力，手机横着看也还勉强，实际效果23楼似乎还好点。
5.33楼打开菜单用一根手指触摸画面，关闭用两根手指触摸画面。6.23楼打开菜单用一根手指点击画面，关闭在画面外点击。