Fixed scroll shadows not appearing

Implemented scroll classes into a jQuery plugin and fixed shadows not appearing when scrolled
This commit is contained in:
Matthew Harrison-Jones 2013-09-04 17:21:50 +01:00
parent 415ba7bcf5
commit b19bb108ef
3 changed files with 33 additions and 28 deletions

View File

@ -83,6 +83,34 @@
return 0;
};
// ## scrollShadow
// This adds a 'scroll' class to the targeted element when the element is scrolled
// **target:** The element in which the class is applied. Defaults to scrolled element.
// **class-name:** The class which is applied.
// **offset:** How far the user has to scroll before the class is applied.
$.fn.scrollClass = function (options) {
var config = $.extend({
'target' : '',
'class-name' : 'scrolling',
'offset' : 1
}, options);
return this.each(function () {
var $this = $(this),
$target = $this;
if (config.target) {
$target = $(config.target);
}
$this.scroll(function () {
if ($this.scrollTop() > config.offset) {
$target.addClass(config['class-name']);
} else {
$target.removeClass(config['class-name']);
}
});
});
};
$.fn.selectText = function () {
var elem = this[0],
range,

View File

@ -4,16 +4,7 @@
var ContentList,
ContentItem,
PreviewContainer,
// Add shadow during scrolling
scrollShadow = function (target, e) {
if ($(e.currentTarget).scrollTop() > 10) {
$(target).addClass('scrolling');
} else {
$(target).removeClass('scrolling');
}
};
PreviewContainer;
// Base view
// ----------
@ -34,7 +25,7 @@
},
initialize: function (options) {
this.$('.content-list-content').on('scroll', _.bind(scrollShadow, null, '.content-list'));
this.$('.content-list-content').scrollClass({target: '.content-list', offset: 10});
this.listenTo(this.collection, 'remove', this.showNext);
},
@ -129,7 +120,6 @@
initialize: function (options) {
this.listenTo(Backbone, 'blog:activeItem', this.setActivePreview);
this.$('.content-preview-content').on('scroll', _.bind(scrollShadow, null, '.content-preview'));
},
setActivePreview: function (id) {
@ -201,6 +191,7 @@
this.model = this.collection.get(this.activeId);
this.$el.html(this.template(this.templateData()));
}
this.$('.content-preview-content').scrollClass({target: '.content-preview', offset: 10});
this.$('.wrapper').on('click', 'a', function (e) {
$(e.currentTarget).attr('target', '_blank');
});

View File

@ -256,23 +256,9 @@
this.$('.CodeMirror-scroll').on('scroll', this.syncScroll);
// Shadow on Markdown if scrolled
this.$('.CodeMirror-scroll').on('scroll', function (e) {
if ($('.CodeMirror-scroll').scrollTop() > 10) {
$('.entry-markdown').addClass('scrolling');
} else {
$('.entry-markdown').removeClass('scrolling');
}
});
this.$('.CodeMirror-scroll').scrollClass({target: '.entry-markdown', offset: 10});
this.$('.entry-preview-content').scrollClass({target: '.entry-preview', offset: 10});
// Shadow on Preview if scrolled
this.$('.entry-preview-content').on('scroll', function (e) {
if ($('.entry-preview-content').scrollTop() > 10) {
$('.entry-preview').addClass('scrolling');
} else {
$('.entry-preview').removeClass('scrolling');
}
});
// Zen writing mode shortcut
shortcut.add("Alt+Shift+Z", function () {