我是新来的,我正在寻找困扰我的事情的答案。我正在为客户开发一个网站,它使用 fullpage.js .....您可以在 http://begemini.co.uk/workshop/loweclothing/index.html 查看该网站
问题是我对箭头旁边的文本有疑问。我无法让正确的文本停留在“slide1”上我尝试使用“position:fixed”,但它停留在正确的位置,但它在每张幻灯片上,我需要在每张幻灯片上使用不同的文本....
html代码是:
<body>
<div class="section" id="section1">
<div class="slide" id="slide1"><img src="imgs/Lowe-Clothing-logo.png" width="30%">
<div id="left-text">Business Opportunities</div><!--left-text-->
<div id="right-text">Introduction</div><!--right-text--></div><!--Slide1-->
<div class="slide" id="slide2"><h1>Totally customizable</h1></div><!--Slide2-->
</div>
</body>
CSS 是:
#left-text{
position: absolute;
top: 50%;
left: 60px;
margin-top:-9px;
font-size: 1.1em;
font-family: arial,helvetica;
color: #fff;
}
#right-text{
position: absolute;
top: 50%;
right: 60px;
margin-top:-9px;
font-size: 1.1em;
font-family: arial,helvetica;
color: #fff;
z-index:100;
}
所以基本上我试图将文本放在箭头上,但要与其余内容一起过渡。我希望每一页的箭头旁边都有不同的文字。您可以下载整个网站here看看整个代码。
任何帮助将不胜感激.. 谢谢, 罗布
最佳答案
首先尝试只使用一种 css 单位,即仅像素或仅 em。
试试这个,然后使用 relative 或 absolute 并尝试它是否有效。
关于javascript - 如何让我的箭头文本留在 fullpage.js 上的正确位置?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21124674/