我在CSS中将我的图片设置为居中:
background-position: center center;
但是我想知道它被设置为中心后的顶部位置,如何使用jQuery或纯JavaScript计算?
.parallax3 {
position: relative;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
background-image: url('https://picsum.photos/g/200/600');
height: 100%;
}
.tagline {
font-size: 2.5vw;
letter-spacing:0.05em;
padding: 25% 25%;
}
.grid-x {
border:1px solid red;
}
.cell {
border: 1px solid blue;
}
<div class="row widescreen">
<div class="grid-container full">
<div class="grid-x grid-padding-x align-stretch small-padding-collapse">
<div class="medium-6 cell">
<div class="tagline text-center">
<p>Lorem ipsum dolor sit amet</p>
</div>
</div>
<div class="medium-6 cell parallax-viewport">
<div class="parallax3">
</div>
</div>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/foundicons/3.0.0/foundation-icons.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.4.1/css/foundation.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.4.1/js/foundation.min.js"></script>
有什么想法吗?
$(".parallax3").position().top
这样的代码行不起作用吗?还是我漏掉了什么? - Omar Einea