Add parallax effect to a div that has a background image assigned to it already

[tsquez]

I have a quick question, how can I add the parallax effect to a div that already has a background image to it via css?

I have created a Custom Post Type in WordPress and the user can upload an image or use the featured image as the background to the main content.

Everything is working the way it should and now I am ready to add the option to use parallax.

I am stumped at trying to figure out how I can get the effect with the background image set. This i what I have so far:

<div class="primo-header small-12 large-auto cell parallax-window" data-parallax="scroll">

Any help is greatly appreciated. Thanks in advance.

[alexgilbertDG]

I use javascript for that use case, simply initialize the parallax with the same url has the background-image :

PHP: <div class="slider w-full h-full py-24 parallax-bg darker-bg" style="background:url('<?= get_the_post_thumbnail_url(get_the_ID()) ?>') no-repeat center center;background-size:cover;">

JS $('.parallax-bg').each(function (idx, item) { var $item = $(item); var bg = $item.css('background-image'); var url = bg.replace('url(', '').replace(')', '').replace(/\"/gi, ""); $item.parallax({imageSrc: url, speed:0.5}); $item.css('background-image', '') });

[tsquez]

Awesome, thanks for the replay. It's greatly appreciated.