Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

Superscrollarama different screen sizes = different height causing scrollto issues #140

Closed
epcieye opened this Issue · 4 comments

3 participants

@epcieye

We are using the scrollarama plugin and are having an issue where we have a set height set on out intro section but the height increases for bigger screens. We are using the scrollto plugin to navigate to different parts of the page but since the height changes in media queries for different screen sizes the scrollto point changes due to different heights. I tried using anchor's instead of scrolling to set pixel values but since some of the pages live in a timeline, it just takes me to the first page of the timeline instead of navigating me to where the anchor lives inside the timeline. The code I am using is:
$("li#one").click(function()
{
TweenMax.to(window, 1, {scrollTo:{y:$('#showcase').offset().top}});
$('.current').removeClass('current');
$(this).addClass('current');
});
$("li#two").click(function()
{
TweenMax.to(window, 1, {scrollTo:1350, ease:Back.easeOut});
$('.current').removeClass('current');
$(this).addClass('current');
});
$("li#three").click(function()
{
TweenMax.to(window, 1, {scrollTo:3150, ease:Back.easeOut});
$('.current').removeClass('current');
$(this).addClass('current');
});
$("li#four").click(function()
{
TweenMax.to(window, 1, {scrollTo:4400, ease:Back.easeOut});
$('.current').removeClass('current');
$(this).addClass('current');
});

Again, this works fine on my screen, but on a bigger screen, since the height changes the set pixel values are incorrect.
How do I go about building the scrollto plugin inside of a timeline?

@jkrot
@epcieye

Hi jkrot, thanks for the info - I will give this a go :+1:

@janpaepke
Collaborator

Hi @epcieye, were you able to sort out this issue?

regards,
Jan

@janpaepke janpaepke self-assigned this
@epcieye

Hi Jan,
My solution was what jkrot suggested - I just set a fixed height on my starting page and moved on. THe end result was that I had to scroll further on smaller screens to trigger the next slide but it will do for now! :)

@epcieye epcieye closed this
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.