0
http://johnpolacek.github.io/superscrollorama/과 같은 플러그인을 내 Views에 통합하여 Backbone.js와 함께 사용하는 방법을 이해하려고합니다. 백본 View-Events에 연결해야한다는 것을 알고 있지만 플러그인으로 수평 스크롤을 수행하고 싶습니다. 수평 스크롤 이벤트에 대해 알지 못합니다. 어떻게 플러그인을 계속 사용할 수 있습니까? 어떤 아이디어라도 미리 감사드립니다.Backbone.js에서 SuperScrolloRama를 사용하는 방법보기
조회수 :
var ArtistsView = Backbone.View.extend({
tagName: 'ul',
initialize: function() {
this.cleanUp();
$("body").attr('id','artists');
this.render();
},
events: {
"click div.open" : "largeArtViewOpen",
"click div.close" : "largeArtViewClose",
},
render: function() {
this.collection.each(function(model) {
var artistView = new ArtistView({ model: model });
this.$el.append(artistView.render().el);
}, this);
console.log('and a new view was rendered!')
return this;
},
cleanUp: function(){
if (this != null) {
this.remove();
this.unbind();
console.log('View was removed!');
}
},
largeArtViewOpen: function(e){
var thisArt = $(e.currentTarget).parent().attr("class");
console.log(thisArt);
$("#open-view, li."+thisArt).show();
},
largeArtViewClose: function(e){
//var thisArt = $(e.currentTarget).parent().attr("class");
console.log('clicked!');
$("#open-view, ul#large li").hide();
},
scrollFx: function(){
var controller = $.superscrollorama({
isVertical:false
});
controller.addTween('h2#fade-it', TweenMax.from($('h2#fade-it'), .5, {css:{opacity: 0}}), 800);
//$('h2#fade-it').css({'color':'#dbdbdb'});
console.log('scroll message!');
},
});
var ArtistView = Backbone.View.extend({
tagName:'li',
className:'artistLink not-active',
render: function(){
this.id = this.model.get('idWord')+"-menu-item";
this.$el.attr('id', this.id).html(this.template(this.model.toJSON()));
return this;
},
});