iLoveElysia/pjax
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 9 Wiki Activity

Question: Different exiting/entering animations based on which link is clicked #38

New Issue
Closed
opened 2015-04-21 21:02:17 -05:00 by mikeebee · 4 comments
mikeebee commented 2015-04-21 21:02:17 -05:00 (Migrated from github.com)
Copy Link

Hi there!

I've been using jQuery Smoothstate to add custom animations to page transitions. Support has disappeared so I'm interested in replacing it. I looked into jQuery pjax but the lack of ability to allow a specified duration for CSS animations put me off and in turn, led me here. I've had a good read of your docs and it seems perfect, I just want to clear a few things up before I make the jump.

Is it be possible to change the exiting animations based on which link was clicked? I'm trying to have it feel like a horizontal slideshow so that I have left and right exiting/entering navigation. So if I click on the left link the screen animates out left and vice versa with the right link.

Further from this, I'd need to alter the animation on the following page, depending on the exiting animation. Does that make sense? This site is a good example (click the left and right links, they animate out and in according to which item you click.

Other than that I just need to be able to re-fire any JS that needs to be loaded once the page has loaded but I'm pretty sure you have that covered?

Finally, how closely are you planning to keep this to jQuery pjax, feature wise?

Many thanks,
Mike

Hi there! I've been using [jQuery Smoothstate](http://weblinc.github.io/jquery.smoothState.js/) to add custom animations to page transitions. Support has disappeared so I'm interested in replacing it. I looked into jQuery pjax but the lack of ability to allow a specified duration for CSS animations put me off and in turn, led me here. I've had a good read of your docs and it seems perfect, I just want to clear a few things up before I make the jump. Is it be possible to change the exiting animations based on which link was clicked? I'm trying to have it feel like a horizontal slideshow so that I have left and right exiting/entering navigation. So if I click on the left link the screen animates out left and vice versa with the right link. Further from this, I'd need to alter the animation on the following page, depending on the exiting animation. Does that make sense? [This site is a good example](http://howarkitekter.se/work/truecaller/) (click the left and right links, they animate out and in according to which item you click. Other than that I just need to be able to re-fire any JS that needs to be loaded once the page has loaded but I'm pretty sure you have that covered? Finally, how closely are you planning to keep this to jQuery pjax, feature wise? Many thanks, Mike
MoOx commented 2015-04-21 23:27:17 -05:00 (Migrated from github.com)
Copy Link

Using the switches your should be able to do whatever you want if you add metadata into the html (like an data-pjax-direction or something) that you might use in the callback.
I guess in this callback you can do this animation.
For my concern, I use right/left animation on my website. Right for new page, left for back button.

For the JS on each page update, see events.

And sorry I do not understand your last question.

Using the [switches](https://github.com/MoOx/pjax#switches-object-default-) your should be able to do whatever you want if you add metadata into the html (like an data-pjax-direction or something) that you might use in the callback. I guess in this callback you can do this animation. For my concern, I use right/left animation on my website. Right for new page, left for back button. For the JS on each page update, see [events](https://github.com/MoOx/pjax#events). And sorry I do not understand your last question.
mikeebee commented 2015-04-22 00:15:26 -05:00 (Migrated from github.com)
Copy Link

Ah, perfect! I thought as much, I just wanted to make sure.

I have noticed that the animations on your site are a bit jerky**. A moment before the animation initiates, the content block appears to be out of place. I've taken a short video to illustrate. Curious if this is likely to carry over to any implementation or just a minor issue with your site.

** Chrome 42 on OSX (Yosemite), I see a similar issue in Firefox but it's not quite as noticeable.

The last part of my original question was wondering if you are planning to keep this plugin's feature set similar to that of the jQuery pjax plugin. It seems to be actively developed and I noticed that some of your to-do's are directly related to parts of jQuery pjax. It's not a requirement in any way, I was just curious :)

Thanks

Ah, perfect! I thought as much, I just wanted to make sure. I have noticed that the animations on your site are a bit jerky**. A moment before the animation initiates, the content block appears to be out of place. I've taken a [short video to illustrate](http://mikeebee.com/other/moox.mov). Curious if this is likely to carry over to any implementation or just a minor issue with your site. *\* Chrome 42 on OSX (Yosemite), I see a similar issue in Firefox but it's not _quite_ as noticeable. The last part of my original question was wondering if you are planning to keep this plugin's feature set similar to that of the jQuery pjax plugin. It seems to be actively developed and I noticed that some of your to-do's are directly related to parts of jQuery pjax. It's not a requirement in any way, I was just curious :) Thanks
MoOx commented 2015-04-22 00:28:18 -05:00 (Migrated from github.com)
Copy Link

I didn't take much time to polish my animation that's true :)
It's probably related to my animation, not this script itself. Thanks for reporting.

jQuery pjax have a good experience in pjax issues, so yeah I am checking it sometimes to grab interesting stuff :)

I didn't take much time to polish my animation that's true :) It's probably related to my animation, not this script itself. Thanks for reporting. jQuery pjax have a good experience in pjax issues, so yeah I am checking it sometimes to grab interesting stuff :)
mikeebee commented 2015-04-22 00:31:23 -05:00 (Migrated from github.com)
Copy Link

Heh no worries. Ok great, I'll give this thing a spin. Thanks for fielding my questions!

Heh no worries. Ok great, I'll give this thing a spin. Thanks for fielding my questions!
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
bug
dependencies
Pull requests that update a dependency file
 duplicate
enhancement
invalid
question
wontfix
No Label question
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
iLoveElysia
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: iLoveElysia/pjax#38
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?