我在这里http://fancyapps.com/fancybox/3/docs/
遵循指南请向下滚动到“内联”,并阅读有关使框可滚动的信息部分,然后在此处尝试Codepen示例。在该示例中,有一个打开的演示按钮。如果单击它,则会打开一个弹出框,并且该框内有一个切换内容按钮。如果单击该按钮,则文本将显示并且可以滚动。
我需要删除切换内容按钮并直接显示可滚动文本。在文本的底部,我需要添加一些链接。
https://codepen.io/shadi-shtaklef/pen/oaayMQ是我的codepen示例。它与原始示例完全相同。我只是删除了切换内容按钮,然后添加了
Email: <a href="mailto:info@mdscomputers.ae">info@mdscomputers.ae</a><br>
Website: <a href="http://www.mdscomputers.ae" target="_blank">www.mdscomputers.ae</a>
在文本底部,问题是当我单击打开的演示按钮时,可滚动文本会自动向下滚动到底部的那两个链接。如何禁用它?
您可以在原始Codepen示例中进行相同的编辑,并且会发生相同的事情。
答案 0 :(得分:1)
答案 1 :(得分:0)
这有点棘手,但是可以用; https://codepen.io/mcourto/pen/yRRqEq
我使用了jquery(因为您已经在使用它)$( "#button" ).click();
单击按钮并使用CSS隐藏它
然后,我将文本区域的标签索引设置为1,以便默认情况下滚动到顶部。
答案 2 :(得分:0)
根据他们的文档,打开模式后,它将自动聚焦于第一个可聚焦元素。并且在您的模式内容中
<a href="mailto:info@mdscomputers.ae">info@mdscomputers.ae</a>
是第一个可聚焦元素。这就是模态自动向下滚动的原因。
如果要更改此默认行为,则可以使用数据属性
data-auto-focus="false"
在打开演示锚点中。
请参见fancybox v3.5 - Scrollable content上Niraj Kaushal(@nirajkaushal)的钢笔CodePen。