timeline 更新
This commit is contained in:
parent
be06efb65e
commit
fb07b16453
@ -81,7 +81,7 @@
|
|||||||
<#if previousArticlePermalink??>
|
<#if previousArticlePermalink??>
|
||||||
<div class="right">
|
<div class="right">
|
||||||
<a href="${servePath}${previousArticlePermalink}">
|
<a href="${servePath}${previousArticlePermalink}">
|
||||||
${previousArticleTitle}
|
<span class="left">${previousArticleTitle}</span>
|
||||||
<span class="ico-next">»</span>
|
<span class="ico-next">»</span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
@ -17,7 +17,7 @@
|
|||||||
* timeline skin style.
|
* timeline skin style.
|
||||||
*
|
*
|
||||||
* @author <a href="mailto:LLY219@gmail.com">Liyuan Li</a>
|
* @author <a href="mailto:LLY219@gmail.com">Liyuan Li</a>
|
||||||
* @version 1.0.1.0, Jan 30, 2013
|
* @version 1.0.1.1, Feb 20, 2013
|
||||||
*/
|
*/
|
||||||
/* start reset */
|
/* start reset */
|
||||||
html, body {
|
html, body {
|
||||||
@ -514,6 +514,15 @@ a:hover > .ico-pre {
|
|||||||
right: inherit
|
right: inherit
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.articles pre {
|
||||||
|
background-color: #F5F5F5;
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
border-radius: 4px 4px 4px 4px;
|
||||||
|
padding: 9.5px;
|
||||||
|
white-space: pre-wrap;
|
||||||
|
word-wrap: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
time.article-time {
|
time.article-time {
|
||||||
top: -8px;
|
top: -8px;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
|
1
timeline/css/timeline.min.css
vendored
1
timeline/css/timeline.min.css
vendored
@ -79,6 +79,7 @@ a:hover>.ico-next,a:hover>.ico-pre{background-color:#000;}
|
|||||||
.articles .r .dot{left:-37px;right:inherit;}
|
.articles .r .dot{left:-37px;right:inherit;}
|
||||||
.articles .arrow{height:15px;position:absolute;right:-9px;top:21px;width:9px;}
|
.articles .arrow{height:15px;position:absolute;right:-9px;top:21px;width:9px;}
|
||||||
.articles .r .arrow{background-position:0 -22px;left:-9px;right:inherit;}
|
.articles .r .arrow{background-position:0 -22px;left:-9px;right:inherit;}
|
||||||
|
.articles pre{background-color:#F5F5F5;border:1px solid #ddd;border-radius:4px 4px 4px 4px;padding:9.5px;white-space:pre-wrap;word-wrap:break-word;}
|
||||||
time.article-time{top:-8px;left:50%;position:absolute;}
|
time.article-time{top:-8px;left:50%;position:absolute;}
|
||||||
time.article-time>span{background-color:#FFFFFF;border:1px solid #A8A9A9;border-radius:20em 20em 20em 20em;font-size:80%;margin-left:-56px;padding:5px 10px;}
|
time.article-time>span{background-color:#FFFFFF;border:1px solid #A8A9A9;border-radius:20em 20em 20em 20em;font-size:80%;margin-left:-56px;padding:5px 10px;}
|
||||||
article .article-title{margin:10px 0 0 0;}
|
article .article-title{margin:10px 0 0 0;}
|
||||||
|
@ -7,7 +7,7 @@
|
|||||||
${b3logLabel}
|
${b3logLabel}
|
||||||
<b style="color: orangered;">Solo</b></a>,
|
<b style="color: orangered;">Solo</b></a>,
|
||||||
ver ${version}
|
ver ${version}
|
||||||
Theme by <a rel="friend" rel="friend" href="http://vanessa.b3log.org" target="_blank">Vanessa</a>.
|
Theme by <a rel="friend" href="http://themify.me/demo/themes/postline/">postline</a> & <a rel="friend" href="http://vanessa.b3log.org" target="_blank">Vanessa</a>.
|
||||||
</div>
|
</div>
|
||||||
<div class="right fn-clear">
|
<div class="right fn-clear">
|
||||||
<span class="left">
|
<span class="left">
|
||||||
|
@ -18,7 +18,7 @@
|
|||||||
* @fileoverview timeline js.
|
* @fileoverview timeline js.
|
||||||
*
|
*
|
||||||
* @author <a href="mailto:LLY219@gmail.com">Liyuan Li</a>
|
* @author <a href="mailto:LLY219@gmail.com">Liyuan Li</a>
|
||||||
* @version 1.0.1.0, Jan 30, 2013
|
* @version 1.0.1.1, Feb 20, 2013
|
||||||
*/
|
*/
|
||||||
var timeline = {
|
var timeline = {
|
||||||
_COLHA: 0,
|
_COLHA: 0,
|
||||||
@ -35,7 +35,7 @@ var timeline = {
|
|||||||
var $it = $(this),
|
var $it = $(this),
|
||||||
isLeft = colH[1] > colH[0],
|
isLeft = colH[1] > colH[0],
|
||||||
top = isLeft ? colH[0] : colH[1];
|
top = isLeft ? colH[0] : colH[1];
|
||||||
if (!$it.hasClass("r") && !$it.hasClass("l")) {
|
if (parseInt($it.css("top")) !== top) {
|
||||||
$it.css({
|
$it.css({
|
||||||
"top": top + "px",
|
"top": top + "px",
|
||||||
"position": "absolute"
|
"position": "absolute"
|
||||||
@ -53,9 +53,10 @@ var timeline = {
|
|||||||
$articles.height(colH[0] > colH[1] ? colH[0] : colH[1]);
|
$articles.height(colH[0] > colH[1] ? colH[0] : colH[1]);
|
||||||
});
|
});
|
||||||
|
|
||||||
setTimeout(function () {
|
|
||||||
$(window).resize();
|
$(window).resize();
|
||||||
}, 500);
|
$(".module img").imagesLoaded(function () {
|
||||||
|
$(window).resize();
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
||||||
@ -83,6 +84,7 @@ var timeline = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
$(window).resize(function () {
|
$(window).resize(function () {
|
||||||
|
console.log("resize");
|
||||||
$archives.each(function () {
|
$archives.each(function () {
|
||||||
var colH = [timeline._COLHA + 60, timeline._COLHB * 4];
|
var colH = [timeline._COLHA + 60, timeline._COLHB * 4];
|
||||||
|
|
||||||
@ -96,7 +98,8 @@ var timeline = {
|
|||||||
isLeft = colH[1] > colH[0],
|
isLeft = colH[1] > colH[0],
|
||||||
top = isLeft ? colH[0] : colH[1];
|
top = isLeft ? colH[0] : colH[1];
|
||||||
|
|
||||||
if (!$it.hasClass("r") && !$it.hasClass("l")) {
|
if (parseInt($it.css("top")) !== top) {
|
||||||
|
console.log(top);
|
||||||
$it.css({
|
$it.css({
|
||||||
"top": top + "px",
|
"top": top + "px",
|
||||||
"position": "absolute"
|
"position": "absolute"
|
||||||
@ -115,9 +118,10 @@ var timeline = {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
setTimeout(function () {
|
|
||||||
$(window).resize();
|
$(window).resize();
|
||||||
}, 500);
|
$(".module img").imagesLoaded(function () {
|
||||||
|
$(window).resize();
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
_setNavCurrent: function () {
|
_setNavCurrent: function () {
|
||||||
@ -250,9 +254,10 @@ var timeline = {
|
|||||||
$more.css("background", "none #60829F").text(Label.moreLabel);
|
$more.css("background", "none #60829F").text(Label.moreLabel);
|
||||||
}
|
}
|
||||||
|
|
||||||
setTimeout(function () {
|
|
||||||
$(window).resize();
|
$(window).resize();
|
||||||
}, 500);
|
$(".module img").imagesLoaded(function () {
|
||||||
|
$(window).resize();
|
||||||
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
@ -282,6 +287,136 @@ var timeline = {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/*!
|
||||||
|
* jQuery imagesLoaded plugin v2.1.1
|
||||||
|
* http://github.com/desandro/imagesloaded
|
||||||
|
*
|
||||||
|
* MIT License. by Paul Irish et al.
|
||||||
|
*/
|
||||||
|
|
||||||
|
/*jshint curly: true, eqeqeq: true, noempty: true, strict: true, undef: true, browser: true */
|
||||||
|
/*global jQuery: false */
|
||||||
|
|
||||||
|
;
|
||||||
|
(function($, undefined) {
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
// blank image data-uri bypasses webkit log warning (thx doug jones)
|
||||||
|
var BLANK = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==';
|
||||||
|
|
||||||
|
$.fn.imagesLoaded = function( callback ) {
|
||||||
|
var $this = this,
|
||||||
|
deferred = $.isFunction($.Deferred) ? $.Deferred() : 0,
|
||||||
|
hasNotify = $.isFunction(deferred.notify),
|
||||||
|
$images = $this.find('img').add( $this.filter('img') ),
|
||||||
|
loaded = [],
|
||||||
|
proper = [],
|
||||||
|
broken = [];
|
||||||
|
|
||||||
|
// Register deferred callbacks
|
||||||
|
if ($.isPlainObject(callback)) {
|
||||||
|
$.each(callback, function (key, value) {
|
||||||
|
if (key === 'callback') {
|
||||||
|
callback = value;
|
||||||
|
} else if (deferred) {
|
||||||
|
deferred[key](value);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function doneLoading() {
|
||||||
|
var $proper = $(proper),
|
||||||
|
$broken = $(broken);
|
||||||
|
|
||||||
|
if ( deferred ) {
|
||||||
|
if ( broken.length ) {
|
||||||
|
deferred.reject( $images, $proper, $broken );
|
||||||
|
} else {
|
||||||
|
deferred.resolve( $images );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( $.isFunction( callback ) ) {
|
||||||
|
callback.call( $this, $images, $proper, $broken );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function imgLoadedHandler( event ) {
|
||||||
|
imgLoaded( event.target, event.type === 'error' );
|
||||||
|
}
|
||||||
|
|
||||||
|
function imgLoaded( img, isBroken ) {
|
||||||
|
// don't proceed if BLANK image, or image is already loaded
|
||||||
|
if ( img.src === BLANK || $.inArray( img, loaded ) !== -1 ) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// store element in loaded images array
|
||||||
|
loaded.push( img );
|
||||||
|
|
||||||
|
// keep track of broken and properly loaded images
|
||||||
|
if ( isBroken ) {
|
||||||
|
broken.push( img );
|
||||||
|
} else {
|
||||||
|
proper.push( img );
|
||||||
|
}
|
||||||
|
|
||||||
|
// cache image and its state for future calls
|
||||||
|
$.data( img, 'imagesLoaded', {
|
||||||
|
isBroken: isBroken,
|
||||||
|
src: img.src
|
||||||
|
} );
|
||||||
|
|
||||||
|
// trigger deferred progress method if present
|
||||||
|
if ( hasNotify ) {
|
||||||
|
deferred.notifyWith( $(img), [ isBroken, $images, $(proper), $(broken) ] );
|
||||||
|
}
|
||||||
|
|
||||||
|
// call doneLoading and clean listeners if all images are loaded
|
||||||
|
if ( $images.length === loaded.length ) {
|
||||||
|
setTimeout( doneLoading );
|
||||||
|
$images.unbind( '.imagesLoaded', imgLoadedHandler );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// if no images, trigger immediately
|
||||||
|
if ( !$images.length ) {
|
||||||
|
doneLoading();
|
||||||
|
} else {
|
||||||
|
$images.bind( 'load.imagesLoaded error.imagesLoaded', imgLoadedHandler )
|
||||||
|
.each( function( i, el ) {
|
||||||
|
var src = el.src;
|
||||||
|
|
||||||
|
// find out if this image has been already checked for status
|
||||||
|
// if it was, and src has not changed, call imgLoaded on it
|
||||||
|
var cached = $.data( el, 'imagesLoaded' );
|
||||||
|
if ( cached && cached.src === src ) {
|
||||||
|
imgLoaded( el, cached.isBroken );
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// if complete is true and browser supports natural sizes, try
|
||||||
|
// to check for image status manually
|
||||||
|
if ( el.complete && el.naturalWidth !== undefined ) {
|
||||||
|
imgLoaded( el, el.naturalWidth === 0 || el.naturalHeight === 0 );
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// cached images don't fire load sometimes, so we reset src, but only when
|
||||||
|
// dealing with IE, or image is complete (loaded) and failed manual check
|
||||||
|
// webkit hack from http://groups.google.com/group/jquery-dev/browse_thread/thread/eee6ab7b2da50e1f
|
||||||
|
if ( el.readyState || el.complete ) {
|
||||||
|
el.src = BLANK;
|
||||||
|
el.src = src;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
return deferred ? deferred.promise( $this ) : $this;
|
||||||
|
};
|
||||||
|
|
||||||
|
})(jQuery);
|
||||||
|
|
||||||
(function () {
|
(function () {
|
||||||
Util.init();
|
Util.init();
|
||||||
Util.replaceSideEm($(".recent-comments-content"));
|
Util.replaceSideEm($(".recent-comments-content"));
|
||||||
|
4
timeline/js/timeline.min.js
vendored
4
timeline/js/timeline.min.js
vendored
File diff suppressed because one or more lines are too long
Loading…
x
Reference in New Issue
Block a user