1

I am developing a website using scrolling parallax, only one long website page, divided into slides.

The first slide to fit on the screen is the main menu with menus: about us, contact and so on then the rest of the slides also fit on the screen.

If I want to click about us my website can smooth scroll navigate to about us belowthe first slide and should navigate to the center on the targeted element and that is vertically centered on the screen.

The HTML is

<a href="#aboutuscontents" class="active" title="Next Section" >Slide 1</a>

and I think on this line on jquery:

var targetOffset = $target.offset().top but i'm not sure with it

is responsible for that, but I don't know how to center it because no center available to it only top and left

The problem is, when navigating, the topmost part of element will stick to the edge of the top of screen using targetOffset.|

to this link: jQuery - Scroll element to the middle of the screen instead of to the top with an anchor link this is same with my problem and the link clearly states what my problem is, and in the line offset = elOffset - ((windowHeight / 2) - (elHeight / 2)); it answers my question.

thank you

Community
  • 1
  • 1
Aljohn Yamaro
  • 2,629
  • 25
  • 22
  • $target.offset() gives you an object with that contains the $target element's position relative from the top left of the screen (0,0). If you're trying to center align the element you probably want to look at doing that via CSS. – Brodie Jul 08 '15 at 20:43
  • You can simply do some math. Your vertical target center is $target.offset().top + $target.height()/2 and your horizontal center is $target.offset().left + $target.width()/2 – mwoelk Jul 09 '15 at 10:09

1 Answers1

0

This works for me thanks to Brodie one of the comments below.

$target.offset() gives you an object with that contains the $target element's position relative from the top left of the screen (0,0). If you're trying to center align the element you probably want to look at doing that via CSS.

Aljohn Yamaro
  • 2,629
  • 25
  • 22