djett41 / ionic-filter-bar

Filter Bar plugin for the Ionic Framework
MIT License
362 stars 112 forks source link

opacity and translate3d() behavior... #69

Open ebruner opened 8 years ago

ebruner commented 8 years ago

Can you help me understand what's going on here? I have two copies of my app (one with ionic-filter-bar and one without). In the app with ionic-filter-bar, when I click a list item it transitions to the next state correctly. When I click the back button, the app returns to the original state, but this time with the nav bar opacity=0 and translate3d with a large value. Code in tabs.html

<ion-nav-view title="Home" icon="icon ion-home" name="index-tab" href="#/tab/index"></ion-nav-view>
  </ion-tab>

Here is the before(Safari-view source):

<div class="title title-center header-item" style="left: 56px; right: 56px; -webkit-transform: translate3d(0px, 0, 0);">Welcome</div>

Here is the after (back button pressed, Safari-view source):

   `<div class="title title-center header-item" style="left: 56px; right: 56px; -webkit-transform: translate3d(700.6224975585938px, 0px, 0px); opacity: 0;">Welcome</div>`

Any ideas? I'm new to ionic and right now I'm assuming that this is caused by ionic-filter-bar because the other copy of the app (without ionic-filter-bar) is functioning.

Yessengerey commented 8 years ago

I have a similar issue. My ion-view title gets truncated/clipped when I put two particular ion icon buttons in the nav-bar on the right side of the title. I am looking into this issue and am trying to solver it. I believe the answer lies in CSS.