Edit Question - KnowledgeHub

Title Body

I'm developing a mobile application using RequireJS and Backbone.js. I'd like to specify the transition from one page to another by adding data-transition and data-direction attributes to each anchor (in the same way as with jQuery Mobile): <a href="#home" data-transition="slide" data-direction="left">Go to the home page</a> All my views extend a base view that attaches a click handler to anchors and catches the values of these attributes: define([ 'zepto', 'lodash', 'backbone' ], function ($, _, Backbone) { 'use strict'; BaseView = Backbone.View.extend({ events: { 'click a': 'navigate' }, navigate: function (e) { e.preventDefault(); var href = $(e.currentTarget).attr('href'), transition = $(e.currentTarget).attr('data-transition'), direction = $(e.currentTarget).attr('data-direction'); Backbone.history.navigate(href, true); } }); }); My problem is that I don't know how to pass these values to the route handlers of my router, defined as another module: define([ 'zepto', 'lodash', 'backbone' ], function ($, _, Backbone) { 'use strict'; var Router = Backbone.Thumb.Router.extend({ routes: { '': 'home' } }); var initialize = function () { var router = new Router(); router.on('route:home', function () { require(['views/home'], function (HomeView) { var homeView = new HomeView(); // Get the data-transition and data-direction attributes // of the clicked anchor here: // var transition = ???, // direction = ???; router.animate(homeView.render().$el, transition, direction); }); }); Backbone.history.

Tags (comma-separated) Cancel