Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

JenniBabs

Member
  • Posts

    2
  • Joined

  • Last visited

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Hi Erika, Thanks for your message. I'm using version 7.1. About the html part, yes you are right, I had the html there but accidentally left it out when copy/pasting. I will send you the link to my site by message. Thanks again.
  2. Hi everyone, Straight up I'm not a coder but I'm trying to achieve two things on my page: 1. Smooth Home page navigation scroll using anchors 2. Parallax Scroll where images are blocked in the background and the next section overlaps as you scroll down. Both codes work idividually, however when I combine both in the Custom CCS section, the Parallax code works and the smooth navigation stops working. What happens is when I click on a menu item, it jumps straight to that section and I loose that "smooth scroll" effect. Can you guys help me out? is it possible to have both effects? I've posted the codes I'm using at the end. Thanks in advance! Jen This one in the CSS Custom section: { scroll-behavior: smooth; } This one in the Code Injection Footer section: <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/parallax.js/1.4.2/parallax.min.js"></script> <script> $('.has-background:not(:has(.sqs-video-background))').each(function() { var findImage = $(this).find('.section-background img'); var imgUrl = findImage.data('src') + '?format=2500w'; var dimensions = findImage.data('image-dimensions'); var imgWidth = dimensions.substr(0, dimensions.indexOf('x')); var imgHeight = dimensions.substr(dimensions.indexOf('x') + 1); $(this).parallax({ bleed: 0, imageSrc: imgUrl, naturalWidth: imgWidth, naturalHeight: imgHeight, speed: .5, }) }); document.getElementsByTagName("body")[0].onresize = function() { setTimeout(function() { jQuery(window).trigger('resize').trigger('scroll') }, 100) }; </script> <style>.has-background{background-color:transparent!important}.has-background .section-background{background-color:transparent!important}.has-background .section-background img{visibility:hidden!important}.has-background.background-width--inset{margin:4vw;padding:0!important}.has-background.background-width--inset:not(.content-collection):not(.gallery-section) .section-background{top:0!important;right:0!important;bottom:0!important;left:0!important}</style>
×
×
  • Create New...