求方案:抖音直播搜索页实现九宫格布局 + 自动播放 + 悬浮控制

查看 14|回复 0
作者:kyoyo123   
各位大佬好,想请教一个关于抖音直播搜索页的优化需求,希望能通过油猴脚本或谷歌插件实现以下功能,恳请有经验的朋友指点思路或分享方案:

  • 布局调整:当前抖音直播搜索页(https://www.douyin.com/search/*)是单列瀑布流布局,需要改成九宫格(或可自定义列数的多宫格),让更多直播内容同时展示在可视区域。

  • 自动播放优化:目前页面需要手动下拉到对应直播才会加载播放,希望实现「进入页面后自动播放所有可视区域内的直播」,且滚动时自动加载并播放新进入可视区域的内容,离开可视区域的直播自动暂停(减少资源占用)。

  • 悬浮控制按钮:在每个直播窗口右上角或固定位置添加悬浮的「暂停 / 播放」按钮,点击可手动控制单个直播的播放状态,避免自动播放时需要点击进入直播间才能暂停的麻烦。

  • 其他细节:
  • 布局调整后希望保持直播窗口的比例协调,避免画面拉伸变形;
  • 尽可能保留原页面的直播封面,固定尺寸不影响基本功能使用;
  • 脚本 / 插件兼容最新版 Chrome 浏览器,尽量减少与抖音网页版现有功能的冲突。


    目前自己尝试研究了一下页面结构,但对抖音的接口加载逻辑和 DOM 操作不太熟悉,不知道如何绕过原页面的懒加载机制实现自动播放,也不清楚九宫格布局如何适配不同屏幕尺寸。如果有大佬做过类似功能,或者能提供核心思路(比如监听滚动事件、修改 CSS 布局、控制 video 标签播放状态等),非常感谢!

    自动播放, 布局

  • 您需要登录后才可以回帖 登录 | 立即注册

    返回顶部