英文:
Website Button does not work in mobile Layout
问题
我遇到了一个非常奇怪的错误，我正在努力解决。在我使用可视化编辑器构建的网站上，有一个按钮，它应该跳转到同一网站上的内部锚点（#whatwedosmall），但在移动布局上却无法工作。
这是网站链接：https://b8j3ssh.myraidbox.de/
我创建了3种布局（大，中，小），每个部分都有一个特定的ID（例如，在大型布局中，“What we do” 部分的名称是：#whatwedolarge，依此类推）。在网站内，有一些按钮可以引导到这些部分，而且效果很好！
然而，在移动设备上（宽度小于600像素）的第一个按钮却根本无法工作。我尝试了一切办法，但就是无法让它起作用……
你能帮我吗？
英文:
I have a really weird error that I'm trying to resolve. On a website I built with the visual composer, one of the buttons that leads to an internal anchor (#whatwedosmall) on the same site just wont work on the mobile layout.
This is the site: https://b8j3ssh.myraidbox.de/
I created 3 layouts (large, medium, small) and each section has a certain ID (for example the What we do section in large is named: #whatwedolarge and so on. Within the site there are buttons that lead to these sections and it works great!
However, the very first button on mobile (breakpoint smaller than 600px) just wont work at all. I tried everything but I cannot get it to work...
Can you help me?
答案1
得分: 0
当您在小于 600 像素的断点处检查页面时，您会发现您的按钮（实际上是一个<a>元素）被 rev_slider_1_1 遮挡，因此实际的<a>元素无法进行悬停或点击。
如果您在 DevTools 中从 DOM 中删除该幻灯片，或者手动设置高度，则悬停和点击功能将会正常。如下面的截屏所示，手动将幻灯片高度设置为 850 像素后，我可以进行悬停和点击操作。
您需要确定幻灯片高度是如何确定的，并在您的代码中修复这个问题。
英文:
When you inspect the page at a breakpoint < 600px you can see that your button (actually an <a>) is being covered by the rev_slider_1_1 so the actual <a> can never be hovered or clicked.
If you delete that slider from the DOM in DevTools or set the height manually, then the hovering and click work. As you can see in the screenshot below, manually setting the Slider height to 850px allows me to hover and click
You need to determine how the height of that slider is being determined and fix that in your code.
专注分享java语言的经验与见解，让所有开发者获益！
评论