example.css

.ember-view .tooltip {
  display:none;
}
.ember-view.tip-visible .tooltip {
  display:block;
}

example.js

App = Ember.Application.create();

App.ImageWithTooltip = Ember.View.extend({
  classNames: ['container'],
  classNameBindings: ['tipVisible'],
  tipVisible: false,
  mouseEnter: function(){
    this.toggleProperty('tipVisible');
  },
  mouseLeave: function(){
    this.toggleProperty('tipVisible');
  }
});

index.html

<script type="text/x-handlebars" data-template-name="example">
  <div class="main-container">
    <h2>Pick Your Character:</h2>
    <div class="row-fluid">
      {{view App.ImageWithTooltip src="./imgs/someImage.png"}}
      {{view App.ImageWithTooltip src="./imgs/someImage.png"}}
    </div>
  </div>
</script>

<script type="text/x-handlebars" data-template-name="imageWithTooltip">
    <img {{bindAttr src="view.src"}} />
    <div class='tooltip'></div>
</script>

This is a cool technique, but IMO I don't think Ember users should be confined to this.