I'm using materializecss as a front-end framework for my personal website I am currently developing. I used their starter Parallax template and everything works, but for some reason my Parallax images are not showing. I believe it has something to do with the initialization.
snippet of one of the parallax for the HTML:
<template name="parall">
<div class="parallax"><img src="/public/background1.jpg">
</div>
</template>
JS:
if (Meteor.isClient) {
Template.parall.onRendered(function(){
$(".parallax").parallax();
});
}
if (Meteor.isServer) {
Meteor.startup(function () {
// code to run on server at startup
});
}
Have you tried rendering your images with css?
.parallax {
background-image: url("/background1.jpg");
}
Simply try removing "public" from your img src, and instead use "/background1.jpg". [ Assuming "public" directory is in your route project folder ].
You dont have to specify "public" while accessing resources stored in public directory. It is one among the few reserved directory names in meteor structure.
将div.parallax包裹在div.parallax-container中
Wrap the div in a parallax-container as already posted
<div class="parallax-container">
<div class="parallax"><img src="/images/parallax1.jpg"></div>
</div>
and add the following in your CSS
.parallax{
position:static!important
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.