         React.Children.forEach @props.children, (child_, index_) =>
           if index_ == nextIndex
             @setNewKey child_.key
-
+  componentDidUpdate: (prevProps, prevState) ->
+    @prevActiveKey = @state.nowKey || @props.children[0]?.key
   render: ->
     onTheLeft = true
     activeKey = @activeKey()
     <div className='poi-tab-contents'>
       {
-        React.Children.map @props.children, (child) =>
+        React.Children.map @props.children, (child, index) =>
           if child.key == activeKey
             onTheLeft = false
           positionLeft = if child.key == activeKey
             0
           else if onTheLeft
             -100
-          else 
+          else
             100
+          tabStyle =
+            left: "#{positionLeft}%"
+            transition: '0s'
+          if child.key == activeKey ||
+             child.key == @prevActiveKey
+            delete tabStyle.transition
           <div className='poi-tab-child-sizer'>
-            <div className='poi-tab-child-positioner' style={left: "#{positionLeft}%"}>
+            <div className='poi-tab-child-positioner' style=tabStyle>
               {child}
             </div>
           </div>

    @setNewKey e.detail.key

  findChildByKey: (key) ->
    _.filter((React.Children.map @props.children, 
        (child) -> if child.key == key then child),
      Boolean)[0]


    @selectTab 'settings'
  handleCtrlOrCmdNumberKeyDown: (num) ->
    switch num
      when 1
        key = 'mainView'
      when 2
        key = 'shipView'
