是否可以在不使用css background和background-attachment属性的情况下添加视差效果?
我在img里面有一个标签div,想要为图像添加视差滚动效果,下面是代码
function resize_div()
{
var image_height = $('.project-image img').height();
var div_height = $('.project-image').height();
var window_height = $(window).height();
var window_width = $(window).width();
$('.project-image').css('height', window_height - 80);
}
$(window).resize(function () {
resize_div();
});Run Code Online (Sandbox Code Playgroud)
.project-details
{
width:100%;
}
.project-image{
text-align:center
}
.project-description
{
line-height:15px;
margin:0 0 10px
}
.img-responsive
{
height: auto;
max-width: 100%;
}Run Code Online (Sandbox Code Playgroud)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="project-details">
<div class="project-image">
<img src="http://placehold.it/350X225" class="img-responsive">
</div>
<h1>
Project Title
</h1>
<p class="project-description">
Lorem Ipsum is …Run Code Online (Sandbox Code Playgroud)