timeline 更新

This commit is contained in:
Vanessa 2013-02-20 16:42:27 +08:00
parent be06efb65e
commit fb07b16453
6 changed files with 1345 additions and 1200 deletions

View File

@ -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>

View File

@ -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%;

View File

@ -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;}

View File

@ -7,7 +7,7 @@
${b3logLabel}&nbsp; ${b3logLabel}&nbsp;
<b style="color: orangered;">Solo</b></a>, <b style="color: orangered;">Solo</b></a>,
ver ${version}&nbsp;&nbsp; ver ${version}&nbsp;&nbsp;
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">

View File

@ -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"));

File diff suppressed because one or more lines are too long