nav-title-slide-ios7 always on in Beta 8, cannot be disabled/changed

[djensen47]

In Beta 8 the nav-title-slide-ios7 animation is always on.

For instance, This

<ion-nav-bar class="bar-positive no-animation" animation="no-animation">

gets rendered as this

<ion-nav-bar class="bar-positive no-animation bar bar-header nav-bar nav-title-slide-ios7 disable-user-behavior" animation="no-animation">
</ion-nav-bar>

Here's a codepen by mhartington
http://codepen.io/mhartington/pen/sDcna

[mhartington]

Here's an additional codepen as well,

http://codepen.io/mhartington/pen/rGFdy

[joined]

I faced the same issue and it seems the bug was introduced in beta 7 version as you can see by this fork of mhartington's pen:
http://codepen.io/joined/pen/vBFAr

[perrygovier]

Note, this is still the case in beta 9.

[ajoslin]

Fixed, thanks all.

[djensen47]

👍

[asterism612]

Note, this is still the case in beta 9.

[joined]

Beta 9 was released before this bug was fixed. Nightly works!

[keanedp]

Still seeing this issue in Beta 10.

[TayganPillay]

Hi..still cannot disable animation in nightly build 1.0.0-beta.11-nightly-371. get the same slide animation even when i use animation='no-animation'

[mhartington]

Seems to work for me

http://codepen.io/mhartington/pen/nzDrB

    <ion-nav-bar class="bar-positive" animation="no-animation">
      <ion-nav-back-button class="button-icon ion-arrow-left-c">
      </ion-nav-back-button>
    </ion-nav-bar>

[jrowny]

I can't disable either on Beta 11.

[mhartington]

@jrowny have you looked at the codepen above, it works for me

[jrowny]

Yea, that one works but I'm not using a nav-bar, I'm using a header-bar.

On Mon, Aug 25, 2014 at 1:44 PM, Mike Hartington [email protected]
wrote:

@jrowny https://github.com/jrowny have you looked at the codepen above,
it works for me

—
Reply to this email directly or view it on GitHub
#1671 (comment).

Jonathan

[mirko77]

not working for me, still sliding left and right

<ion-nav-view animation="no-animation" ></ion-nav-view>

[mhartington]

Again, seems to work fine for me, check it out

[mirko77]

I fix it, all good now, thanks

[Set2005]

My title stuck in the middle when I navigate back to the previous page. any idea?

             <ion-nav-bar  align-title="left" animation="no-animation">

[mobilabgit]

Hi,
using todays build I am also not able to turn off the animation.
I have tried animation="no-animation" on my ion-nav-view.
This has no effect on my nav animation on iOS, it still slides. On my android I turned it off by adding nav-view-transition="none" to my ion-views. This worked for android but didn't do anything for iOS either.

[bodytaing]

I'm having the same issue with nav-view-transition="none" not working. I'm on beta 14.

[mhartington]

Can you provide a codepen of demo
Mike Hartington

On Jan 9, 2015, at 8:25 PM, Body Taing [email protected] wrote:

I'm having the same issue with nav-view-transition="none" not working. I'm on beta 14.

—
Reply to this email directly or view it on GitHub.

[bodytaing]

http://codepen.io/anon/pen/yyMBVK

I noticed that if I change it to some previous beta versions (beta.13 for example, it works as expected). Beta.14 just seems to not honor no-animation.

[mhartington]

So with beta 14, the animation attribute has been removed. You can disable animations on a link by link basis.

http://codepen.io/mhartington/pen/KwWPxB

[bodytaing]

Thanks Mike Hartington, I will try this on my app and let you know.

[jreed88]

I'm looking to remove all animation during screen transition. I navigate using $state.go not using links in your example. I tried using $ionicHistory (below) to disable the animation and the results seem to be inconsistent, for instance I've noticed it doesn't seem to remove the animation for pressing a back button (also saw some inconsistency between device and browser). I am placing the code snippet below at the top of all my controllers. Is my approach correct? Thanks!

$ionicHistory.nextViewOptions({
disableAnimate: true
});

[c0r3yz]

Did anyone get this sorted out? I am trying to disable all animations, but on iOS devices, it always does a slide animation. I am firing off navigation programmatically with $state.go in some cases, so disabling the animation on a link is not helpful for me. The code below works as expected on Android, just not iOS. Does anyone have any ideas?

<ion-nav-view animation="no-animation"></ion-nav-view>

[mhartington]

You can use this

$ionicConfigProvider.views.transition('none');

http://codepen.io/mhartington/pen/zxyByj

[c0r3yz]

That works for me, thanks!

[maiamachine]

I'm still seeing this issue when using the ion-nav-bar combined with ion-nav-title inside of my view template. I'm trying to add a progress bar to the nav that will update as the user transitions through different pages however the only way I can get the nav to stop animating is to turn off animated transitions globally using $ionicConfigProvider.views.transition('none'). In the main index file I have:

<ion-nav-bar class="bar-positive" animation="no-animation">
      <ion-nav-back-button>
      </ion-nav-back-button>
    </ion-nav-bar>

and then in the template I have

<ion-view>
      <ion-nav-title>code for a progress bar will go here</ion-nav-title>
        <ion-content class="padding">
</ion-content>
</ion-view>

I would like to have transitions on the ion-content, just not the nav. Here is a codepen showing the issue based off of your standard example. You can see how the top bar is animated when clicking on the Scientific Facts button: http://codepen.io/maiamachine/pen/dPryzJ?editors=101

[mhartington]

The no-animation class has been removed from ionic.
You could use $ionicConfigProvider.navBar.transition('none');, which isn't documented or fully tested.
But not, it seems to be a bit buggy.
Something we should work out post 1.0.

cc @adamdbradley

http://codepen.io/mhartington/pen/QwoJGo

[buunguyen]

@mhartington $ionicConfigProvider.navBar.transition('none') does prevent title sliding, but it takes a second or so for the title to appear. Pretty obvious and can annoy end-users. Look forward to a proper fix for this.

Funny thing is titles didn't slide in rc2, only happened when I upgraded to rc3.

[ratt]

I found the title issue seems to be caused when using $state.go(), normal ui-sref caused no issues but the minute i used $state the title has alignment issues. I have had to use $ionicConfigProvider.navBar.transition('none') as a workaround

[marcelomiura]

@buunguyen +1
Same situation here, on rc5.

[marin42]

Hey guys, I'm experiencing the same issue with my navbar, I just want to have a simple logo on the middle of it, and obviously don't want to see a transition when changing views, is there anyway to fix this? Thanks!

[dinesh36]

I Agree with @buunguyen i also get the issue when using $ionicConfigProvider.navBar.transition('none')

[adamcweitzman]

wrap the image in a div and float the div to the right. worked for me with,
$ionicConfigProvider.navBar.transition('none')

[brainbrian]

How about a simple fix. Take a look at what it's doing with CSS. Overwrite their transition ;)

.. .title { opacity: 1 !important; transform: none !important; }