Dogstudio / highway

Highway - A Modern Javascript Transitions Manager
https://highway.js.org/
MIT License
1.43k stars 92 forks source link

Browser previous / next position on page #52

Closed wwwahe closed 4 years ago

wwwahe commented 5 years ago

Hello,

First : Great job.

I see a drawback : the previous / next function of the browser doesn't bring you to the (previous or next) page vertical position like the browser handle natively. This can be very useful on e-commerce website, to continue browsing other product in a list.

Is that an evolution your are thinking about ?

ThaoD5 commented 5 years ago

Hello @wwwahe, Thanks for your feedback.

It's an interesting point and we will discuss this with @Anthodpnt and the other contributors. We will give you an answer as soon as we've made a decision about this.

Have a great day :-)

pratikchauhan14 commented 4 years ago

this issue is fixed or not. https://bandandwire.com - this site is working well browser arrow but when I was trying to apply then all are good but browser previous or next arrow is not working.

fsdiogo commented 4 years ago

Are there any developments on this?

We were going to adopt this library but this is a major drawback to our needs.

ThaoD5 commented 4 years ago

Hello @fsdiogo @pratikchauhan14

Yes, this library is still in active development & maintained. We although still have to come up with a solution if we decide to take care of this issue inside Highway.

The issue is in the pipe of things we need to address. We will obviously let you guys know about the status of this when we go forward on it. For now, timing is a bit hard on our side so we can not really promise anything in a short notice.

Thanks for your interest !

ThaoD5 commented 4 years ago

It's also interesting to hear your version of the feature for simple & complex web pages : Simple :

Complex :

pratikchauhan14 commented 4 years ago

https://studiovoila.com/ https://asaro.co.uk/

and other site are still working back arrow and next arrow. are they use production build or other else. I need to apply in my site but this issue is mejor to adopt this library.

ThaoD5 commented 4 years ago

I am not understanding your problem @pratikchauhan14 ; previous / next arrow buttons are not working on your website ?

fsdiogo commented 4 years ago

I think he's referring to the scroll restoration not working when pressing the next/back arrows.

pratikchauhan14 commented 4 years ago

I am not understanding your problem @pratikchauhan14 ; previous / next arrow buttons are not working on your website ?

yes in my site browser next and previous arrow are not working.

pratikchauhan14 commented 4 years ago

I think he's referring to the scroll restoration not working when pressing the next/back arrows.

no man, I am simple wordPress theme integration in my local machine. and nothing task perform in scrolling. just when i go to home to about us page and then i come back to homepage via browser back arrow at the time arrow not working.

ThaoD5 commented 4 years ago

Please @pratikchauhan14 give us more context and information about your issue otherwise we are not able to provide any help.

Which browser ? Which OS ? What action do you do ? What do you expect from this action ?

Also, please take a minute to re-read the documentation and re-work your code to make sure it matches our default setup.

From what I read, your issue is probably that you do not work well with the transitions; you might have forgotten to call done() or remove previous view. Please, have a clean re-try.

pratikchauhan14 commented 4 years ago

`import Highway from '@dogstudio/highway'; import FadeIn from './transition'; import { TimelineMax } from 'gsap';

var scriptList = document.querySelectorAll('script[script-refresh]'); const H = new Highway.Core({ transitions: { default: FadeIn } });

H.on('NAVIGATE_END', ({ from, to, location }) => { console.log('NAVIGATE_END'); });

H.on('NAVIGATE_OUT', ({ from, to, location }) => { console.log('NAVIGATE_OUT'); jQuery('script[script-refresh]').remove(); });

H.on('NAVIGATE_IN', ({ from, to, location }) => { ScriptReload(scriptList); console.log('NAVIGATE_IN'); });`

here is my code and here is my transition.js file code

`import Highway from '@dogstudio/highway'; import { TimelineMax, TweenMax, Expo, Tween } from 'gsap';

console.log('innn');

class FadeIn extends Highway.Transition { in({ from, to, done }) { window.scrollTo(0, 0); from.remove();

var tl = new TimelineMax();
const layer = document.querySelector('.overlay-1');

tl.fromTo(to, 0.5, { opacity: 0 }, { opacity: 1 }).to(layer, 0.2, {
  height: 0,
  onComplete: () => {
    done();
    jQuery(window).trigger('resize');
  }
});

}

out({ from, done }) { const layer = document.querySelector('.overlay-1'); var tl = new TimelineMax();

tl.to(layer, 0.5, { height: '100%' }).to(from, 0.2, {
  onComplete: () => {
    done();
  }
});

} }

export default FadeIn; `

pratikchauhan14 commented 4 years ago

here is my code. I don't know. what issue in my code. I will try within 7 days. please can you check my code.

es-6.zip

ThaoD5 commented 4 years ago

Highway is a free library that we are happy to provide to developers.

Please, consider re-reading (as asked) the documentation and set up a clean install of Highway following the documentation, I am sorry but we are not really here to develop your website for you @pratikchauhan14

If you don't want to give more context than just your piece of code and express your problem in a more complete sentence, I am not willing to provide additional help.

pratikchauhan14 commented 4 years ago

@ThaoD5 thank you man,

Now it's working in my code.

thank you so much for give me your time.