Page Titles In WoodPecker®
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce in mauris arcu. Quisque scelerisque, metus non volutpat commodo.
Code Snippet To Create Above Results
<!-- Container For The Page Title -->
<section id="parallax-1" class = "container-fluid wdpk-page-title wdpk-parallax">
<div class = "row wdpk-page-title-wrapper">
<div class = "container">
<div class = "row ">
<div class = "col-lg-8 offset-lg-2 wdpk-page-title-content">
<section class = "col-lg-12 wdpk-page-title-heading text-center">
<h2 class = "wdpk-page-title-heading">Page Titles In WoodPecker®</h2>
<p class = "wdpk-page-title-description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce
in mauris arcu. Quisque scelerisque, metus non volutpat
commodo.
</p>
<div class = "wdpk-page-title-separator-wrapper justify-content-center mb-0">
<span class = "wdpk-page-title-separator"></span>
</div>
</section>
</div>
</div>
</div>
</div>
</section>
<!-- /Conatiner For The Page Title -->
/** No Changes Needed **/
jQuery(document).ready(function ()
{
if (jQuery(".wdpk-parallax").length !== 0)
{
let obj = {
selectorID: 'parallax-1',
factor: 0.8, // +/- gives direction, Less means slower if no other breakpoint factor is set this value is selected
factorXs: 0.1, // factorXs, factorSm, factorMd, factorLg, factorXl
factorSm: 0.2, // factorXs, factorSm, factorMd, factorLg, factorXl
factorMd: 0.3, // factorXs, factorSm, factorMd, factorLg, factorXl
factorLg: 0.4, // factorXs, factorSm, factorMd, factorLg, factorXl
factorXl: 0.5, // factorXs, factorSm, factorMd, factorLg, factorXl
type: 'background', // background, foreground
direction: 'vertical',// vertical, horizontal
transition: 'translate 0.1s ease' // CSS transition, added on elements where type:'foreground'
};
require(["app/shortcodes/wdpkParallax"], function (e)
{
e.publicCall(obj);
});
}
});
