Beatport新界面

发布于 2024-11-25 05:33:24 字数 169 浏览 0 评论 0原文

Beatports 的新界面解决了我也在寻找解决方案的一个主要问题。

也就是说,它目前保留了一个“播放器”界面,您可以浏览到网站的不同部分(也可以更改网址),而无需重新加载或中断播放器。

我一生都无法理解他们是如何做到这一点的,你们有人能弄清楚吗?!

非常感谢我收到的任何回复

Beatports new interface has solved a major problem I was looking for the solution too.

Namely, it keeps a "player" interface at the moment and you can browser to different parts of the site (also changing the url) without reloading or interrupting the player.

I cannot for the life of me understand how they have done this, can any of you guys figure it out?!

Many thanks for any replies I get

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

谎言月老 2024-12-02 05:33:24

看起来他们只是使用 AJAX 来加载新内容,但已经注意使其工作并且看起来非常无缝。您可以通过视觉事件更好地了解哪些事件附加到哪些元素小书签。一旦找到触发事件的代码,您可以通过 JSBeautifier 运行混淆后的 JavaScript 来更仔细地检查它。

具体来说,看起来他们正在向所有锚标记添加点击处理程序,如果通过中键点击触发或使用键盘按键修改事件,则传递该事件,否则将其传递给处理状态和其他特定条件的动态加载器,例如多次点击。它的无缝性来自于它们处理 URL 的方式,使每个页面都可以添加书签和浏览器历史记录,因此后退和前进按钮的工作方式就像您在“正常”网站上所期望的那样。

Looks like they are just using AJAX to load new content but have taken care to make it work and look pretty seamless. You can get better insight into what events are attached to what elements via the Visual Events bookmarklet. Once you find the code that triggers the event, you can run the obfuscated javascript through JSBeautifier to examine it more closely.

Specifically, it looks like they're adding click handlers to all anchor tags, passing off the event if it was triggered with a middle click or modified with a keyboard key, otherwise passing it to a dynamic loader which handles state and other specific conditions like multiple clicks. The seamlessness of it comes from the way they deal with URLs making every page bookmarkable and the browser history so the back and forward buttons work as you would expect on a "normal" site.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文