How to open a new html file with some nice transition?


#1

Hello, i have no idea how to switch between pages with some animations, and not using the <a href= tag
I know its a bad question but if someone could help me out i would be thankful.


#2

Yes it is a pretty bad question.

You can use the <ion-view ng-animate="animation-name"></ion-view>.
The page you dynamically inject will have transitions when it comes into view.


#3

I can use the … WHAT?

EDIT: well since he didnt help me, can someone else help me please?


#4

The page transition in ionic comes with the ion-nav-view tag.
There you have an attribute called animation.
Look at that documentation and the example:
http://ionicframework.com/docs/api/directive/ionNavView/

The animation of the ion-nav-view is triggered everytime you make a state change. It not depends on using an a-tag. And in angular apps it is not recommanded to use href-attribute for that.

Therefor you can use ui-sref (from ui-router) or ng-href (from standard angularjs).
Everytime you use $location.path(YOUPATH) or $state.go(YOU STATE NAME) to navigate to another state and the nav-view has an animation the animation is shown.

greets.


#5

Thank you for your response, now it works but i have some scripts in template that is located in <script id="something" type="text/ng-template"> and those dont work :confused:


#6

Hey there, check out our codepen demos for a list of information and demos on how to set things up.


#7

Well but If i put my html into <script> tag then my all.js doesnt work.