javascript - Backbone.js Mobile Slider - ビュー関数を介して変数を渡す

Question

私はこのチュートリアルに従って、モバイル スライダーを作成しています: http://mobile.smashingmagazine.com/2012/06/21/play-with-hardware-accelerated-css/

唯一の違いは、Backbone に取り込もうとしていることです。ただし、変数の問題に遭遇しました。これを機能させる方法について、誰でもアドバイスを提供できますか。ビューの関数全体でこれらの変数を渡すことが問題です。

var sliding = startClientX = startPixelOffset = pixelOffset = currentSlide = 0,
slideCount = $('.slide').length;

フル バックボーン ビュー:

WhiteDeals.Views.EditorView = Backbone.View.extend({

initialize: function() {
    _.bindAll(this, 'render', 'slideStart', 'slide');

    var sliding = startClientX = startPixelOffset = pixelOffset = currentSlide = 0,
    slideCount = $('#dealSlide').length;

},

events: {
    "touchstart"             : "slideStart",
    "mousedown"              : "slideStart",
    "mouseup"                : "slideEnd",
    "touchend"               : "slideEnd",
    "mousemove"              : "slide",
    "touchmove"              : "slide"
},

slideStart: function(event) {
    if (event.originalEvent.touches)
      event = event.originalEvent.touches[0];
    if (sliding == 0) {
      sliding = 1;
      startClientX = event.clientX;
    }
}, // End slideStart

slide: function(event) {
    event.preventDefault();
    if (event.originalEvent.touches)
        event = event.originalEvent.touches[0];
        var deltaSlide = event.clientX - startClientX;

    if (sliding == 1 && deltaSlide != 0) {
      sliding = 2;
      startPixelOffset = pixelOffset;
    }

    if (sliding == 2) {
      var touchPixelRatio = 1;
      if ((currentSlide == 0 && event.clientX > startClientX) ||
          (currentSlide == slideCount - 1 && event.clientX < startClientX))
        touchPixelRatio = 3;
      pixelOffset = startPixelOffset + deltaSlide / touchPixelRatio;
      $('#dealSlider').css('transform', 'translate3d(' + pixelOffset + 'px,0,0)').removeClass();
    }
},

slideEnd: function(event) {
    if (sliding == 2) {
        sliding = 0;
        currentSlide = pixelOffset < startPixelOffset ? currentSlide + 1 : currentSlide - 1;
        currentSlide = Math.min(Math.max(currentSlide, 0), slideCount - 1);
        pixelOffset = currentSlide * -$('body').width();
        $('#temp').remove();
        $('<style id="temp">#dealSlider.animate{transform:translate3d(' + pixelOffset + 'px,0,0)}</style>').appendTo('head');
        $('#dealSlider').addClass('animate').css('transform', '');
    }
}, // End slideEnd

render: function() {
    this.$el.html(JST['editor/view']());
    return this;
}

}); // End of Views EditorView