Question

So I have this simple backbone setup:

$(function() {
  var chooser  = Backbone.View.extend({
    el: $('#content'),

    events: {
      'mouseenter .class': 'showInfo'
    },

    showInfo: function(evt) {
      console.log('YEAH!');
    }
  });

  window.testview = new chooser();
});

However, I can only get click and mousemove events to work. I have tried hover, mouseenter, mouseout and they all seem to not be firing. I am not sure what could be wrong with such a simple setup. I have looked at this code for the past hour so maybe I missing something.

Assume the DOM is set up correctly.

Forgot to mention, I am using Backbone with Zepto. Downloaded Fed 6.

Answer 1

The mouseenter and mouseleave events are not standard events, and they’re natively only supported on Internet Explorer. jQuery simulates these events using mouseover and mouseout events with event-time checks. Same goes for hover, which is actually built using mouseenter/leave.

Zepto doesn’t define these events, so they simply aren’t available. Although Zepto works on desktop browsers, its mainly focused on mobile browsers, where mouse events are not relevant for obvious reasons.