maleuh

<navigation /> <div id="smooth-wrapper"> <div id="smooth-content"> <header :class="{ 'home-page': isHomePage, 'page-header': !isHomePage}"> <div data-speed="1.2" :class="{'special-watch': isHomePage, 'hidden': !isHomePage}"> <div class="special-watch-subhead">DISCOVER THE SEASON’S SELECTION</div> <div class="special-watch-title">the new interpretation of our heritage</div> </div> <div class="blue-button-aliner"> <blueButton data-speed="1.2" buttonText="discover" buttonLink="/contact"></blueButton> </div> <h1 data-speed="1.2" :class="{'page-title': !isHomePage, 'hidden': isHomePage}">{{ $route.name }}</h1> </header> <div class="grid-aliner"> <div class="page-grid"> <router-view></router-view> </div> </div> </div> </div> </div> .page-header, .home-page { width: 100vw; height: 745px; background-attachment: fixed; background-image: url(../assets/img/story-dragon.jpg); } the thing is, the background-attachment works perfectly when my header is out of the smooth-wrapper and smooth-content, but i need it to be in it.

I just got a problem in my project: I have a header with a background image with the property background-attachement: fixed; My header have to be in the wrapper and the smooth-content because it have children with effects from the plugin. How can I make this background to be fixed, I thought about a way to make this property more important than the plugin effects to get the priority and make everything work but idk how.