以下是 jQuery图片左右滚动插件Microfiche特效代码 的示例演示效果:
部分效果截图:
HTML代码(index.html):
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=810">
<title>jQuery图片左右滚动插件Microfiche</title>
<link rel="stylesheet" href="vendor/prettify.css">
<link rel="stylesheet" href="microfiche.css">
<link rel="stylesheet" href="microfiche.demo.css">
<script src="vendor/jquery-1.7.1.js"></script>
<script src="vendor/prettify.js"></script>
<script src="microfiche.js"></script>
<script>
function example(id) {
document.write(
'<div class="example" id="' + id + '">' +
'<div>' +
'<ul>' +
'<li><img src="images/1.jpg" width="160" height="160"></li>' +
'<li><img src="images/2.jpg" width="160" height="160"></li>' +
'<li><img src="images/3.jpg" width="160" height="160"></li>' +
'<li><img src="images/4.jpg" width="160" height="160"></li>' +
'<li><img src="images/5.jpg" width="160" height="160"></li>' +
'<li><img src="images/6.jpg" width="160" height="160"></li>' +
'<li><img src="images/7.jpg" width="160" height="160"></li>' +
'<li><img src="images/8.jpg" width="160" height="160"></li>' +
'<li><img src="images/9.jpg" width="160" height="160"></li>' +
'<li><img src="images/10.jpg" width="160" height="160"></li>' +
'<li><img src="images/11.jpg" width="160" height="160"></li>' +
'<li><img src="images/12.jpg" width="160" height="160"></li>' +
'<li><img src="images/13.jpg" width="160" height="160"></li>' +
'<li><img src="images/14.jpg" width="160" height="160"></li>' +
'</ul>' +
'</div>' +
'</div>'
);
}
function example_short(id) {
document.write(
'<div class="example" id="' + id + '">' +
'<div>' +
'<ul>' +
'<li><img src="images/1.jpg" width="160" height="160"></li>' +
'<li><img src="images/2.jpg" width="160" height="160"></li>' +
'</ul>' +
'</div>' +
'</div>'
);
}
</script>
</head>
<body>
<div class="body-subcontainer">
<h2>Usage</h2>
<h3>Defaults</h3>
<div class="demo">
<p><code class="prettyprint">$('#default').microfiche();</code></p>
<script>example('default')</script>
<script>$('#default').microfiche()</script>
</div>
<h3>Options</h3>
<div class="demo">
<p><code class="prettyprint">$('#cyclic').microfiche({ cyclic: true });</code></p>
<script>example('cyclic')</script>
<script>$('#cyclic').microfiche({ cyclic: true })</script>
</div>
<div class="demo">
<p><code class="prettyprint">$('#buttons').microfiche({ buttons: false });</code></p>
<script>example('buttons')</script>
<script>$('#buttons').microfiche({ buttons: false })</script>
</div>
<div class="demo">
<p><code class="prettyprint">$('#bullets').microfiche({ bullets: false });</code></p>
<script>example('bullets')</script>
<script>$('#bullets').microfiche({ bullets: false })</script>
</div>
<div class="demo">
<p><code class="prettyprint">$('#keyboard').microfiche({ keyboard: true });</code></p>
<script>example('keyboard')</script>
<script>$('#keyboard').microfiche({ keyboard: true })</script>
</div>
<div class="demo">
<p><code class="prettyprint">$('#click').microfiche({ clickToAdvance: true });</code></p>
<script>example('click')</script>
<script>$('#click').microfiche({ clickToAdvance: true })</script>
</div>
<h3>Commands</h3>
<p>Commands are passed to the microfiche method as options, and may be passed at any point.<br>
In this example, the <code class="prettyprint">slideByPages(1)</code> command is performed immediately
after Microfiche has finished setting up.</p>
<div class="demo">
<p><code class="prettyprint">$('#commands').microfiche({ slideByPages: 1 });</code></p>
<script>example('commands')</script>
<script>$('#commands').microfiche({ slideByPages: 1 })</script>
<p>
<button onclick="$('#commands').microfiche({ slideByPages: -1 }); return false;">Run →</button>
<code class="prettyprint">$('#commands').microfiche({ slideByPages: -1 })</code><br>
<button onclick="$('#commands').microfiche({ slideByPages: 1 }); return false;">Run →</button>
<code class="prettyprint">$('#commands').microfiche({ slideByPages: 1 })</code><br>
<button onclick="$('#commands').microfiche({ slideToPoint: 0 }); return false;">Run →</button>
<code class="prettyprint">$('#commands').microfiche({ slideToPoint: 0 })</code><br>
<button onclick="$('#commands').microfiche({ jumpToPoint: 0 }); return false;">Run →</button>
<code class="prettyprint">$('#commands').microfiche({ jumpToPoint: 0 })</code><br>
<button onclick="$('#commands').microfiche({ jumpToPage: 2 }); return false;">Run →</button>
<code class="prettyprint">$('#commands').microfiche({ jumpToPage: 2 })</code> </p>
</div>
<h3>Events</h3>
<p>Microfiche emits the following events:</p>
<ul>
<li><code class="prettyprint">'microfiche:willMove'</code></li>
<li><code class="prettyprint">'microfiche:didMove'</code></li>
</ul>
<p>You can listen for them in the usual way:</p>
<div class="demo">
<p>
<pre class="prettyprint">
$('#events').microfiche().on('microfiche:willMove microfiche:didMove', function(event) {
$('#events-console').html(event.type);
});
</pre>
</p>
<script>example('events')</script>
<script>
$('#events').microfiche().on('microfiche:willMove microfiche:didMove', function(event) {
$('#events-console').html(event.type);
});
</script>
<p><strong>Event received:</strong> <code id="events-console">-</code></p>
</div>
<h3>Talking to Microfiche Directly</h3>
<p>Microfiche has some useful methods that return values, and so cannot
be used through the aforementioned jQuery style syntax. The microfiche
object itself is available via jQuery’ <code>data</code> method.</p>
<p><code class="prettyprint">$('.my-element').data('microfiche');</code></p>
<h3>Methods</h3>
<div class="demo">
<p>
<pre class="prettyprint">
var m = $('#methods').microfiche().data('microfiche');
m.currentPageIndex() // returns 0-index of the current page
m.totalPageCount() // returns the number of pages as an integer
m.min() // returns the minimum (left-most) position
m.max() // returns the maximum (right-most) position
</pre>
</p>
<script>example('methods')</script>
<script>
var m = $('#methods').microfiche().data('microfiche');
document.write('<pre class="prettyprint">' +
'currentPageIndex: ' + m.currentPageIndex() + '<br>' +
' totalPageCount: ' + m.totalPageCount() + '<br>' +
' min: ' + m.min() + '<br>' +
' max: ' + m.max() +
'</pre>');
</script>
</div>
<h3>Autoplay</h3>
<p>To have Microfiche pause rotation when the user hovers over the
carousel, set <code>autopause</code> to <code>true</code>.</p>
<div class="demo">
<p>
<pre class="prettyprint">
$('#autoplay').microfiche({
cyclic: true,
autoplay: 3,
autopause: true
});
</pre>
</p>
<script>example('autoplay')</script>
<script>
$('#autoplay').microfiche({ cyclic: true, autoplay: 3, autopause: true });
</script>
</div>
<h3>Refresh</h3>
<p>To refresh an existing Microfiche’s controls and content to adjust to a new container size,
call the <code>refresh</code> method.</p>
<div class="demo">
<p>
<pre class="prettyprint">$('#refresher').microfiche({ cyclic: true });</pre>
</p>
<script>example('refresher')</script>
<script>
$('#refresher').microfiche({ cyclic: true });
</script>
<p>
<button onclick="$('#refresher').css('width', '340px'); return false;">Resize Parent →</button>
<code class="prettyprint"> $('#refresher').css('width', '340px');</code> <br />
<button onclick="$('#refresher').microfiche({ refresh: true }); return false;">Refresh →</button>
<code class="prettyprint">$('#refresher').microfiche({ refresh: true });</code> </p>
</div>
<h3>RefreshOnResize</h3>
<p>To have Microfiche automatically refresh when a window <code>resize</code> event is fired, set a debounce rate in ms for <code>refreshOnResize</code>. A value of <code>true</code> indicates a 250ms debounce.</p>
<p>
<pre class="prettyprint">
var r = $('#refreshonresize');
r.microfiche({ refreshOnResize: false }); // no refresh (default)
r.microfiche({ refreshOnResize: true }); // 250ms debounce
r.microfiche({ refreshOnResize: 0 }); // instant refresh
r.microfiche({ refreshOnResize: 100 }); // 100ms debounce
</pre>
</p>
<p>Resize your browser window until it's narrower than the example carousel below to see the carousel refresh.</p>
<p>
<pre class="prettyprint">
$('#refreshonresize').microfiche({ refreshOnResize: true });
</pre>
</p>
</div>
<!-- .body-subcontainer -->
<script>prettyPrint()</script>
</body>
</html>
JS代码(microfiche.js):
// # Microfiche.js v1.8.0//// ## Usage//// $('.my-slideshow').microfiche();
// $('.my-slideshow').microfiche({
cyclic:true,button:false}
);
// $('.my-slideshow').microfiche({
slideByPages:1}
);
//// ## Options//// The following options can be passed the first time `microfiche` is called// on an element.//// ### cyclic//// If true,microfiche wraps around at front and beginning of the slideshow.// This option is false by default.//// $('.my-slideshow').microfiche({
cyclic:true}
);
//// ### buttons//// If true,microfiche will create previous/next buttons.// This option is true by default.//// $('.my-slideshow').microfiche({
buttons:false}
);
//// ### bullets//// If true,microfiche will create bullets for the pages available.// This option is also true by default.//// $('.my-slideshow').microfiche({
bullets:false}
);
//// ## Commands//// The following commands can be run on a microfiche'd element at any point,// including in the first call.//// ### slideByPages//// Slides `n` screenfuls (negative `n` goes backwards).//// $('.my-slideshow').microfiche({
slideByPages:n}
);
//// ### slideToPage//// Slides to the `nth` screenful.//// $('.my-slideshow').microfiche({
slideToPage:n}
);
//// ### slideToPoint//// Slides to point `x` (rounded and constrained appropriately).//// $('.my-slideshow).microfiche({
slideToPoint:x}
);
//// ### jumpToPoint//// Jumps without animation to point x (again,rounded and constrained).//// $('.my-slideshow').microfiche({
jumpToPoint:x}
);
//// ### autoplay//// Automatically advances every `n` seconds.//// $('.my-slideshow').microfiche({
autoplay:n}
);
//// ### autopause//// Automatically pause autoplay when the user hovers over the carousel.//// $('.my-slideshow').microfiche({
autoplay:n,autopause:true}
);
//// ### refresh//// To refresh an existing Microfiche’s controls and content to adjust// to a new container size,call the `refresh` method.//// $('.my-slideshow').microfiche({
refresh:true}
);
//// ### refreshOnResize//// Automatically refresh microfiche filmstrip and controls on window// resize event. Set `true` to refresh with a 250ms debounce,or specify// a custom debounce rate in ms. The default value is false.//// $('.my-slideshow').microfiche({
refreshOnResize:100}
);
//// ### destroy//// Destroys the microfiche instance and clear related events//// $('my-slideshow').microfiche({
destroy:true}
);
// // or// $('my-slideshow').data('microfiche').destroy();
//// ### noScrollAlign//// Defines left,right,or center filmstrip alignment in the event that// all items are visible on screen and no scrolling is required.//// $('.my-slideshow').microfiche({
noScrollAlign:'left'}
);
//(function(){
window.Microfiche = function(options){
this.initialize(options);
return this;
}
;
Microfiche.VERSION = '1.8.0';
$.extend(Microfiche.prototype,{
// ## Default Options ## // // These may be overridden in the initializer. options:{
autoplay:false,autopause:false,buttons:true,bullets:true,cyclic:false,keyboard:false,swipe:true,clickToAdvance:false,minDuration:250,duration:500,maxDuration:500,dragThreshold:25,elasticity:0.5,swipeThreshold:0.125,refreshOnResize:false,prevButtonLabel:'←
',nextButtonLabel:'→
',noScrollAlign:'left'}
,// Rather than relying on the literal position of `this.film`,// we keep a tab on the current destination. x:0,// ## Setup ## // Build microfiche in steps. initialize:function(options){
this.options = $.extend({
}
,this.options,options);
this.el = $(options.el);
this.initialContents = this.el.contents();
this.el.data('microfiche',this);
this.createFilm();
this.createScreen();
this.calibrate();
if (this.film.width() <= this.screen.width()){
this.noScrollAlign(this.options.noScrollAlign);
this.refreshOnResize(this.options.refreshOnResize);
return;
}
this.createControls();
this.enableTouch();
this.enableKeyboard();
this.enableClick();
this.prepareCyclic();
this.run(this.options);
}
,// We create our film element,which we’ll slide back and forth in the screen. // Before appending any extra elements,we detach the existing children,// append them to film,and tell them to float so they’ll (hopefully) lay-out // nicely along the horizontal. createFilm:function(){
this.film = $('<div class="microfiche-film">'). css({
position:'absolute'}
);
this.el.children().appendTo(this.film).css({
float:'left'}
);
this.prepareFilm && this.prepareFilm();
}
,// The screen is created and appended to our element,then the film is // appended to the screen. Screen manually takes its height from film. createScreen:function(){
this.screen = $('<div class="microfiche-screen">'). css({
position:'relative',overflow:'hidden'}
). appendTo(this.el). append(this.film);
}
,// Prepare duplicate content at either end,for our cyclic behaviour. prepareCyclic:function(){
if (!this.options.cyclic) return;
var cloneL = this.film.clone(),cloneR = this.film.clone(),w = this.film.width();
cloneL.prependTo(this.film).css({
position:'absolute',left:-w + 'px'}
);
cloneR.appendTo(this.film).css({
position:'absolute',left:w + 'px'}
);
}
,// This slightly strange process tries to ensure we don’t get any wrapping // in `this.film`,then fixes the dimensions of `this.film` and `this.screen`. calibrate:function(){
this.screen.width(100000);
var w = this.film.width(),h = this.film.height();
this.film.width(w).height(h);
this.screen.width('auto').height(h);
}
,// Create prev/next buttons and page bullets. createControls:function(){
var self = this;
this.controls = $('<span class="microfiche-controls" />').appendTo(this.el);
this.controls.on('click','a,button',function(e){
self.didClickControl(e)}
);
if (this.options.bullets) this.createBullets();
if (this.options.buttons) this.createButtons();
this.updateControls();
}
,// Create page bullets. createBullets:function(){
var container = $('<span class="microfiche-bullets" />').appendTo(this.controls);
for (var i = 0;
i < this.totalPageCount();
i++){
$('<button>') .addClass('microfiche-bullet') .attr('data-microfiche-page',i) .data('action','slideToPage') .data('arguments',[i]) .html(i + 1) .appendTo(container);
}
}
,// Create prev/next buttons. createButtons:function(){
$('<button>') .addClass('microfiche-button microfiche-prev-button') .attr('rel','prev') .data('action','prev') .data('arguments',[]) .html(this.options.prevButtonLabel) .prependTo(this.controls);
$('<button>') .addClass('microfiche-button microfiche-next-button') .attr('rel','next') .data('action','next') .data('arguments',[]) .html(this.options.nextButtonLabel) .appendTo(this.controls);
}
,// Add in the appropriate touch events. This requires a bit of scope-locking. enableTouch:function(){
if (!this.options.swipe) return;
var self = this;
var thisTouchstart = this.touchstart,thisTouchmove = this.touchmove,thisTouchend = this.touchend;
this.touchstart = function(){
thisTouchstart.apply(self,arguments)}
;
this.touchmove = function(){
thisTouchmove.apply(self,arguments)}
;
this.touchend = function(){
thisTouchend.apply(self,arguments)}
;
this.film.on('touchstart',this.touchstart);
}
,// Add in left-right keyboard events. enableKeyboard:function(){
if (!this.options.keyboard) return;
var self = this;
this.screen.attr('data-microfiche-keyboard',true);
var thisOnkeydown = this.onkeydown;
this.onkeydown = function(){
thisOnkeydown.apply(self,arguments)}
;
$(document).on('keydown',this.onkeydown);
}
,// Add in mosuedown event. enableClick:function(){
if (!this.options.clickToAdvance) return;
var self = this;
var thisOnmousedown = this.onmousedown;
this.onmousedown = function(){
thisOnmousedown.apply(self,arguments)}
;
this.film.on('mousedown',this.onmousedown);
}
,// ## User Event Handling ## // When anything in `this.controls` is clicked. didClickControl:function(e){
e.preventDefault();
var control = $(e.target),action = control.data('action'),args = control.data('arguments');
this[action].apply(this,args);
}
,// When touch starts,record the origin point and time. touchstart:function(e){
var touches = e.originalEvent.targetTouches;
if (!touches || touches.length > 1) return;
this.touchState ={
then:new Date(),ox:touches[0].pageX,oy:touches[0].pageY,isDrag:false}
$(document).on('touchmove',this.touchmove). on('touchend',this.touchend);
}
,// Touchmove begins by getting the deltas on both axis. // // If we’re not already in drag-mode,we check to see if the horizontal // delta is above the treshold. If the vertical delta crosses the threshold,// we duck out altogether. // // After that,we ask `this.film` to follow the touch,and record a few // details about position and velocity for good measure. touchmove:function(e){
var t = e.originalEvent.targetTouches[0],dx = t.pageX - this.touchState.ox,dy = t.pageY - this.touchState.oy;
if (!this.touchState.isDrag){
if (Math.abs(dy) >= this.options.dragThreshold){
this.touchend();
return;
}
else if (Math.abs(dx) >= this.options.dragThreshold){
this.touchState.isDrag = true;
}
}
if (this.touchState.isDrag){
e.preventDefault();
var now = new Date(),t = now - this.touchState.then;
this.touchState.vx = (dx - this.touchState.dx) / t;
this.touchState.vy = (dy - this.touchState.dy) / t;
this.touchState.dx = dx;
this.touchState.dy = dy;
this.touchState.then = now;
this.touchState.cx = this.x - dx;
if (!this.options.cyclic){
if (this.touchState.cx < this.min()){
var bx = this.min() - this.touchState.cx;
bx = bx * this.options.elasticity;
this.touchState.cx = this.min() - bx;
}
if (this.touchState.cx > this.max()){
var bx = this.touchState.cx - this.max();
bx = bx * this.options.elasticity;
this.touchState.cx = this.max() + bx;
}
}
this.film.css({
WebkitTransition:'none',WebkitTransform:'translate3d(' + -this.touchState.cx + 'px,0px,0px)'}
);
}
}
,// When the touch is finished,we unbind events. If the touch was decided // to be a drag,we’ll deduce the new target value for x,ensure Microfiche // knows about it,and animate into place. touchend:function(e){
$(document).off('touchmove',this.touchmove). off('touchend',this.touchend);
if (this.touchState.isDrag){
var dx = this.touchState.dx,w = this.screenWidth(),vx = this.touchState.vx,th = this.options.swipeThreshold;
if (dx <= -w * th){
this.slideByPages(1,vx);
}
else if (dx >= w * th){
this.slideByPages(-1,vx);
}
else{
this.slideByPages(0);
}
}
}
,// Slide centermost instance of microfiche left / right on key press. onkeydown:function(e){
if (e.keyCode !== 37 && e.keyCode !== 39 || !this.isCentral('[data-microfiche-keyboard]')) return;
if (e.keyCode === 37) this.slideByPages(-1);
else if (e.keyCode === 39) this.slideByPages(1);
}
,// Advance microfiche on mousedown. onmousedown:function(e){
this.slideByPages(1);
}
,// ## State Update ## // Enable/disable controls based on current position. updateControls:function(){
if (this.options.bullets) this.updateBullets();
if (this.options.buttons) this.updateButtons();
}
,// Update selected state of bullets. updateBullets:function(){
this.controls.find('.microfiche-bullet').removeClass('selected');
this.controls.find('[data-microfiche-page="' + this.currentPageIndex() + '"]').addClass('selected');
}
,// Update enabled state of prev/next buttons. updateButtons:function(){
if (this.options.cyclic) return;
this.controls.find('[rel="prev"]').attr('disabled',this.x <= this.min());
this.controls.find('[rel="next"]').attr('disabled',this.x >= this.max());
}
,// ## Helpers ## // Round `x` to a factor of `screenWidth`. round:function(x){
var w = this.screenWidth();
return Math.round(x / w) * w;
}
,// Return `x` constrained between limits `min` and `max`. constrain:function(x,min,max){
if (min === undefined) min = this.min();
if (max === undefined) max = this.max();
return Math.max(min,Math.min(x,max));
}
,// Round and constrain `x`. roundAndConstrain:function(x,min,max){
return this.constrain(this.round(x),min,max);
}
,// Returns true if the given point is within our upper/lower bounds. withinBounds:function(x){
return this.min() <= x && x <= this.max();
}
,// Returns the lower limit - simply 0. min:function(){
return 0;
}
,// Returns the upper limit - the width of `this.film` less the width of // `this.screen`. max:function(){
return this.film.width() - this.screenWidth();
}
,// Returns the current page index. currentPageIndex:function(){
return Math.round(this.x / this.screenWidth());
}
,// Returns the number of pages. totalPageCount:function(){
return Math.ceil(this.film.width() / this.screenWidth());
}
,// Returns the width of the containing element. screenWidth:function(){
return this.el.width();
}
,// Returns true if this microfiche instance is closest to the center of the screen isCentral:function(selector){
var closest = $($(selector || '.microfiche-screen').sort(function(a,b){
return Math.abs(1 - (($(window).scrollTop()+$(window).height()/2-$(a).height()/2) / $(a).offset().top)) - Math.abs(1 - (($(window).scrollTop()+$(window).height()/2-$(b).height()/2) / $(b).offset().top))}
)[0]).parent().data('microfiche');
return (closest === this);
}
,// ## Internal Methods for Performing Transitions ## // Perform an instant transition to our new destination. jump:function(){
this.el.trigger('microfiche:willMove');
this.performJump();
this.updateControls();
this.el.trigger('microfiche:didMove');
}
,// Default jump transform. performJump:function(){
this.film.css({
left:-this.x}
);
}
,// Sets up environment,but allows the real transition to be overridden. transition:function(duration){
var self = this;
if (this.options.cyclic) this.handleWrappingTransition();
if (duration == null) duration = this.options.duration;
var callback = function(){
self.afterTransition()}
;
this.el.trigger('microfiche:willMove');
setTimeout(function(){
self.performTransition(duration,callback);
}
);
}
,// Handle what happens in cyclic mode if we’ve slipped off at either end. handleWrappingTransition:function(){
if (this.x > this.max()){
this.x = this.min() - this.screenWidth();
if (this.touchState && this.touchState.dx) this.x -= this.touchState.dx;
this.jump();
this.x = this.min();
this.updateControls();
}
else if (this.x < this.min()){
this.x = this.max() + this.screenWidth();
if (this.touchState && this.touchState.dx) this.x -= this.touchState.dx;
this.jump();
this.x = this.max();
this.updateControls();
}
}
,// Default transition animation. performTransition:function(duration,callback){
this.film.stop().animate({
left:-this.x + 'px'}
,duration,callback);
}
,// Called when a transition finishes. afterTransition:function(){
delete this.touchState;
this.el.trigger('microfiche:didMove');
}
,// ## Public API ## // Slides by `n` pages. If `n` is negative,it will slide in reverse. // // Also takes `vx`,which is the velocity on the x-axis. This is used // internally by the touch event handlers,but can be used to perform // a faster slide. slideByPages:function(n,vx){
var ox = this.x,w = this.screenWidth();
this.x = this.constrain((Math.round(this.x / w) + n) * w);
if (this.options.cyclic && this.x == ox) this.x += n * w;
if (vx){
var duration = this.constrain( Math.abs((this.x - ox) / vx),this.options.minDuration,this.options.maxDuration );
}
else{
var duration = this.options.duration;
}
this.updateControls();
this.transition(duration);
}
,// Slides to the given `page`. slideToPage:function(page){
this.x = this.constrain(page * this.screenWidth());
this.updateControls();
this.transition();
}
,// Animate to the given point (constrained to an acceptable value). slideToPoint:function(x){
this.x = this.roundAndConstrain(x);
this.updateControls();
this.transition();
}
,// Jump to the given `page` jumpToPage:function(page){
this.x = this.constrain(page * this.screenWidth());
this.updateControls();
this.jump();
}
,// Jump to the given point (constrained to an acceptable value). jumpToPoint:function(x){
this.x = this.roundAndConstrain(x);
this.updateControls();
this.jump();
}
,// Slide to the previous screen’s-worth of slides. prev:function(){
this.slideByPages(-1);
}
,// Slide to the next screen’s-worth of slides. next:function(){
this.slideByPages(1);
}
,// Automatically call next every `n` seconds. autoplay:function(n){
if (this.autoplayTimeout){
clearInterval(this.autoplayTimeout);
delete this.autoplayTimeout;
}
n = +n;
if (isNaN(n) || n <= 0) return;
var self = this;
this.autoplayTimeout = setInterval(function (){
if (!self.pause){
self.next();
}
}
,n * 1000);
}
,// Pause autoplay when hovering over carousel autopause:function (){
var self = this;
this.el.hover(function (){
self.pause = true;
}
,function (){
self.pause = false;
}
);
}
,// Destroy the microfiche instance and clear related events destroy:function(){
this.el.empty();
this.el.off();
this.clearResizeHandler();
this.el.removeData('microfiche');
}
,// Refresh the microfiche instance by deleting the contents and associated data,// then restoring the original contents,and re-initializing them. This is particularly // useful for refreshing microfiche on page or container element resize,as it will // redraw the controls if needed. refresh:function(){
var options = this.el.data('microfiche').options,contents = this.getContents();
this.destroy();
this.el.append(contents);
new Microfiche($.extend({
el:this.el}
,options));
return this.el;
}
,getContents:function(){
if(this.contentsChanged()){
return this.el.html();
}
else{
return this.el.data('microfiche').initialContents;
}
}
,// Have the contents changed? contentsChanged:function(){
return this.el.find('.microfiche-screen').length === 0;
}
,// Refresh microfiche automatically on window resize refreshOnResize:function(delay){
// Overwrite previous settings this.options.refreshOnResize = delay;
if (this.resizeHandler) this.clearResizeHandler();
if (delay === false) return;
if (delay === true) delay = 250;
var self = this,timeout;
// Debounce so microfiche will only refresh once for each time // a visitor resizes the window self.resizeHandler = function(){
if (timeout) clearTimeout(timeout);
timeout = setTimeout(function(){
self.refresh();
}
,delay);
}
;
$(window).on('resize',self.resizeHandler);
}
,clearResizeHandler:function(){
$(window).off('resize',this.resizeHandler);
}
,noScrollAlign:function(alignment){
if(this.film.width() > this.screen.width()) return;
switch(alignment){
case 'center':this.film.css({
left:'50%',marginLeft:(this.film.width() / 2 * -1) + 'px',right:'auto'}
);
break;
case 'right':this.film.css({
left:'auto',marginLeft:'auto',right:0}
);
break;
default:this.film.css({
left:0,marginLeft:'auto',right:'auto'}
);
}
}
,// Run given commands,for example:// // microfiche.run({
slideByPages:1}
);
// run:function(options){
for (var key in options){
var property = this[key];
if ($.isFunction(property)) property.call(this,options[key]);
}
}
}
);
// ## WebKit Optimization ##//// A bit of feature detection for webkit transition support.if (('WebKitCSSMatrix' in window && 'm11' in new WebKitCSSMatrix())){
// If we have webkit transition support,then override `prepareFilm` // and `transition` to take advantage of hardware acceleration. $.extend(Microfiche.prototype,{
prepareFilm:function(){
this.film.css({
WebkitTransform:'translate3d(0px,0px,0px)'}
);
}
,performTransition:function(duration,callback){
this.film.one('webkitTransitionEnd',callback).css({
WebkitTransition:'-webkit-transform ' + duration + 'ms',WebkitTransform:'translate3d(' + -this.x + 'px,0px,0px)'}
);
}
,performJump:function(){
this.film.css({
WebkitTransition:'-webkit-transform 0ms',WebkitTransform:'translate3d(' + -this.x + 'px,0px,0px)'}
);
}
}
);
}
// ## jQuery.fn.microfiche ##//// Creates microfiche elements and sends them commands.jQuery.fn.microfiche = function(options){
return this.each(function(){
var microfiche = $(this).data('microfiche');
if (microfiche){
microfiche.run(options);
}
else{
new Microfiche($.extend({
el:this}
,options));
}
}
);
}
}
)();
JS代码(prettify.js):
var q=null;
window.PR_SHOULD_USE_CONTINUATION=!0;
(function(){
function L(a){
function m(a){
var f=a.charCodeAt(0);
if(f!==92)return f;
var b=a.charAt(1);
return(f=r[b])?f:"0"<=b&&b<="7"?parseInt(a.substring(1),8):b==="u"||b==="x"?parseInt(a.substring(2),16):a.charCodeAt(1)}
function e(a){
if(a<32)return(a<16?"\\x0":"\\x")+a.toString(16);
a=String.fromCharCode(a);
if(a==="\\"||a==="-"||a==="["||a==="]")a="\\"+a;
return a}
function h(a){
for(var f=a.substring(1,a.length-1).match(/\\u[\dA-Fa-f]{
4}
|\\x[\dA-Fa-f]{
2}
|\\[0-3][0-7]{
0,2}
|\\[0-7]{
1,2}
|\\[\S\s]|[^\\]/g),a=[],b=[],o=f[0]==="^",c=o?1:0,i=f.length;
c<i;
++c){
var j=f[c];
if(/\\[bdsw]/i.test(j))a.push(j);
else{
var j=m(j),d;
c+2<i&&"-"===f[c+1]?(d=m(f[c+2]),c+=2):d=j;
b.push([j,d]);
d<65||j>122||(d<65||j>90||b.push([Math.max(65,j)|32,Math.min(d,90)|32]),d<97||j>122||b.push([Math.max(97,j)&-33,Math.min(d,122)&-33]))}
}
b.sort(function(a,f){
return a[0]-f[0]||f[1]-a[1]}
);
f=[];
j=[NaN,NaN];
for(c=0;
c<b.length;
++c)i=b[c],i[0]<=j[1]+1?j[1]=Math.max(j[1],i[1]):f.push(j=i);
b=["["];
o&&b.push("^");
b.push.apply(b,a);
for(c=0;
c<f.length;
++c)i=f[c],b.push(e(i[0])),i[1]>i[0]&&(i[1]+1>i[0]&&b.push("-"),b.push(e(i[1])));
b.push("]");
return b.join("")}
function y(a){
for(var f=a.source.match(/\[(?:[^\\\]]|\\[\S\s])*]|\\u[\dA-Fa-f]{
4}
|\\x[\dA-Fa-f]{
2}
|\\\d+|\\[^\dux]|\(\?[!:=]|[()^]|[^()[\\^]+/g),b=f.length,d=[],c=0,i=0;
c<b;
++c){
var j=f[c];
j==="("?++i:"\\"===j.charAt(0)&&(j=+j.substring(1))&&j<=i&&(d[j]=-1)}
for(c=1;
c<d.length;
++c)-1===d[c]&&(d[c]=++t);
for(i=c=0;
c<b;
++c)j=f[c],j==="("?(++i,d[i]===void 0&&(f[c]="(?:")):"\\"===j.charAt(0)&&(j=+j.substring(1))&&j<=i&&(f[c]="\\"+d[i]);
for(i=c=0;
c<b;
++c)"^"===f[c]&&"^"!==f[c+1]&&(f[c]="");
if(a.ignoreCase&&s)for(c=0;
c<b;
++c)j=f[c],a=j.charAt(0),j.length>=2&&a==="["?f[c]=h(j):a!=="\\"&&(f[c]=j.replace(/[A-Za-z]/g,function(a){
a=a.charCodeAt(0);
return"["+String.fromCharCode(a&-33,a|32)+"]"}
));
return f.join("")}
for(var t=0,s=!1,l=!1,p=0,d=a.length;
p<d;
++p){
var g=a[p];
if(g.ignoreCase)l=!0;
else if(/[a-z]/i.test(g.source.replace(/\\u[\da-f]{
4}
|\\x[\da-f]{
2}
|\\[^UXux]/gi,""))){
s=!0;
l=!1;
break}
}
for(var r={
b:8,t:9,n:10,v:11,f:12,r:13}
,n=[],p=0,d=a.length;
p<d;
++p){
g=a[p];
if(g.global||g.multiline)throw Error(""+g);
n.push("(?:"+y(g)+")")}
return RegExp(n.join("|"),l?"gi":"g")}
function M(a){
function m(a){
switch(a.nodeType){
case 1:if(e.test(a.className))break;
for(var g=a.firstChild;
g;
g=g.nextSibling)m(g);
g=a.nodeName;
if("BR"===g||"LI"===g)h[s]="\n",t[s<<1]=y++,t[s++<<1|1]=a;
break;
case 3:case 4:g=a.nodeValue,g.length&&(g=p?g.replace(/\r\n?/g,"\n"):g.replace(/[\t\n\r ]+/g," "),h[s]=g,t[s<<1]=y,y+=g.length,t[s++<<1|1]=a)}
}
var e=/(?:^|\s)nocode(?:\s|$)/,h=[],y=0,t=[],s=0,l;
a.currentStyle?l=a.currentStyle.whiteSpace:window.getComputedStyle&&(l=document.defaultView.getComputedStyle(a,q).getPropertyValue("white-space"));
var p=l&&"pre"===l.substring(0,3);
m(a);
return{
a:h.join("").replace(/\n$/,""),c:t}
}
function B(a,m,e,h){
m&&(a={
a:m,d:a}
,e(a),h.push.apply(h,a.e))}
function x(a,m){
function e(a){
for(var l=a.d,p=[l,"pln"],d=0,g=a.a.match(y)||[],r={
}
,n=0,z=g.length;
n<z;
++n){
var f=g[n],b=r[f],o=void 0,c;
if(typeof b==="string")c=!1;
else{
var i=h[f.charAt(0)];
if(i)o=f.match(i[1]),b=i[0];
else{
for(c=0;
c<t;
++c)if(i=m[c],o=f.match(i[1])){
b=i[0];
break}
o||(b="pln")}
if((c=b.length>=5&&"lang-"===b.substring(0,5))&&!(o&&typeof o[1]==="string"))c=!1,b="src";
c||(r[f]=b)}
i=d;
d+=f.length;
if(c){
c=o[1];
var j=f.indexOf(c),k=j+c.length;
o[2]&&(k=f.length-o[2].length,j=k-c.length);
b=b.substring(5);
B(l+i,f.substring(0,j),e,p);
B(l+i+j,c,C(b,c),p);
B(l+i+k,f.substring(k),e,p)}
else p.push(l+i,b)}
a.e=p}
var h={
}
,y;
(function(){
for(var e=a.concat(m),l=[],p={
}
,d=0,g=e.length;
d<g;
++d){
var r=e[d],n=r[3];
if(n)for(var k=n.length;
--k>=0;
)h[n.charAt(k)]=r;
r=r[1];
n=""+r;
p.hasOwnProperty(n)||(l.push(r),p[n]=q)}
l.push(/[\S\s]/);
y=L(l)}
)();
var t=m.length;
return e}
function u(a){
var m=[],e=[];
a.tripleQuotedStrings?m.push(["str",/^(?:'''(?:[^'\\]|\\[\S\s]|''?(?=[^']))*(?:'''|$)|"""(?:[^"\\]|\\[\S\s]|""?(?=[^"]))*(?:"""|$)|'(?:[^'\\]|\\[\S\s])*(?:'|$)|"(?:[^"\\]|\\[\S\s])*(?:"|$))/,q,"'\""]):a.multiLineStrings?m.push(["str",/^(?:'(?:[^'\\]|\\[\S\s])*(?:'|$)|"(?:[^"\\]|\\[\S\s])*(?:"|$)|`(?:[^\\`]|\\[\S\s])*(?:`|$))/,q,"'\"`"]):m.push(["str",/^(?:'(?:[^\n\r'\\]|\\.)*(?:'|$)|"(?:[^\n\r"\\]|\\.)*(?:"|$))/,q,"\"'"]);
a.verbatimStrings&&e.push(["str",/^@"(?:[^"]|"")*(?:"|$)/,q]);
var h=a.hashComments;
h&&(a.cStyleComments?(h>1?m.push(["com",/^#(?:##(?:[^#]|#(?!##))*(?:###|$)|.*)/,q,"#"]):m.push(["com",/^#(?:(?:define|elif|else|endif|error|ifdef|include|ifndef|line|pragma|undef|warning)\b|[^\n\r]*)/,q,"#"]),e.push(["str",/^<(?:(?:(?:\.\.\/)*|\/?)(?:[\w-]+(?:\/[\w-]+)+)?[\w-]+\.h|[a-z]\w*)>/,q])):m.push(["com",/^#[^\n\r]*/
,q,"#"]));
a.cStyleComments&&(e.push(["com",/^\/\/[^\n\r]*/
,q]),e.push(["com",/^\/\*[\S\s]*?(?:\*\/|$)/,q]));
a.regexLiterals&&e.push(["lang-regex",/^(?:^^\.?|[!+-]|!=|!==|#|%|%=|&|&&|&&=|&=|\(|\*|\*=|\+=|,|-=|->|\/|\/=|:|::|;
|<|<<|<<=|<=|=|==|===|>|>=|>>|>>=|>>>|>>>=|[?@[^]|\^=|\^\^|\^\^=|{
|\||\|=|\|\||\|\|=|~|break|case|continue|delete|do|else|finally|instanceof|return|throw|try|typeof)\s*(\/(?=[^*/
])(?:[^/[\\]|\\[\S\s]|\[(?:[^\\\]]|\\[\S\s])*(?:]|$))+\/)/]);
(h=a.types)&&e.push(["typ",h]);
a=(""+a.keywords).replace(/^ | $/g,"");
a.length&&e.push(["kwd",RegExp("^(?:"+a.replace(/[\s,]+/g,"|")+")\\b"),q]);
m.push(["pln",/^\s+/,q," \r\n\t\xa0"]);
e.push(["lit",/^@[$_a-z][\w$@]*/
i,q],["typ",/^(?:[@_]?[A-Z]+[a-z][\w$@]*|\w+_t\b)/,q],["pln",/^[$_a-z][\w$@]*/
i,q],["lit",/^(?:0x[\da-f]+|(?:\d(?:_\d+)*\d*(?:\.\d*)?|\.\d\+)(?:e[+-]?\d+)?)[a-z]*/
i,q,"0123456789"],["pln",/^\\[\S\s]?/,q],["pun",/^.[^\s\w"-$'./@\\`]*/
,q]);
return x(m,e)}
function D(a,m){
function e(a){
switch(a.nodeType){
case 1:if(k.test(a.className))break;
if("BR"===a.nodeName)h(a),a.parentNode&&a.parentNode.removeChild(a);
else for(a=a.firstChild;
a;
a=a.nextSibling)e(a);
break;
case 3:case 4:if(p){
var b=a.nodeValue,d=b.match(t);
if(d){
var c=b.substring(0,d.index);
a.nodeValue=c;
(b=b.substring(d.index+d[0].length))&&a.parentNode.insertBefore(s.createTextNode(b),a.nextSibling);
h(a);
c||a.parentNode.removeChild(a)}
}
}
}
function h(a){
function b(a,d){
var e=d?a.cloneNode(!1):a,f=a.parentNode;
if(f){
var f=b(f,1),g=a.nextSibling;
f.appendChild(e);
for(var h=g;
h;
h=g)g=h.nextSibling,f.appendChild(h)}
return e}
for(;
!a.nextSibling;
)if(a=a.parentNode,!a)return;
for(var a=b(a.nextSibling,0),e;
(e=a.parentNode)&&e.nodeType===1;
)a=e;
d.push(a)}
var k=/(?:^|\s)nocode(?:\s|$)/,t=/\r\n?|\n/,s=a.ownerDocument,l;
a.currentStyle?l=a.currentStyle.whiteSpace:window.getComputedStyle&&(l=s.defaultView.getComputedStyle(a,q).getPropertyValue("white-space"));
var p=l&&"pre"===l.substring(0,3);
for(l=s.createElement("LI");
a.firstChild;
)l.appendChild(a.firstChild);
for(var d=[l],g=0;
g<d.length;
++g)e(d[g]);
m===(m|0)&&d[0].setAttribute("value",m);
var r=s.createElement("OL");
r.className="linenums";
for(var n=Math.max(0,m-1|0)||0,g=0,z=d.length;
g<z;
++g)l=d[g],l.className="L"+(g+n)%10,l.firstChild||l.appendChild(s.createTextNode("\xa0")),r.appendChild(l);
a.appendChild(r)}
function k(a,m){
for(var e=m.length;
--e>=0;
){
var h=m[e];
A.hasOwnProperty(h)?window.console&&console.warn("cannot override language handler %s",h):A[h]=a}
}
function C(a,m){
if(!a||!A.hasOwnProperty(a))a=/^\s*</.test(m)?"default-markup":"default-code";
return A[a]}
function E(a){
var m=a.g;
try{
var e=M(a.h),h=e.a;
a.a=h;
a.c=e.c;
a.d=0;
C(m,h)(a);
var k=/\bMSIE\b/.test(navigator.userAgent),m=/\n/g,t=a.a,s=t.length,e=0,l=a.c,p=l.length,h=0,d=a.e,g=d.length,a=0;
d[g]=s;
var r,n;
for(n=r=0;
n<g;
)d[n]!==d[n+2]?(d[r++]=d[n++],d[r++]=d[n++]):n+=2;
g=r;
for(n=r=0;
n<g;
){
for(var z=d[n],f=d[n+1],b=n+2;
b+2<=g&&d[b+1]===f;
)b+=2;
d[r++]=z;
d[r++]=f;
n=b}
for(d.length=r;
h<p;
){
var o=l[h+2]||s,c=d[a+2]||s,b=Math.min(o,c),i=l[h+1],j;
if(i.nodeType!==1&&(j=t.substring(e,b))){
k&&(j=j.replace(m,"\r"));
i.nodeValue=j;
var u=i.ownerDocument,v=u.createElement("SPAN");
v.className=d[a+1];
var x=i.parentNode;
x.replaceChild(v,i);
v.appendChild(i);
e<o&&(l[h+1]=i=u.createTextNode(t.substring(b,o)),x.insertBefore(i,v.nextSibling))}
e=b;
e>=o&&(h+=2);
e>=c&&(a+=2)}
}
catch(w){
"console"in window&&console.log(w&&w.stack?w.stack:w)}
}
var v=["break,continue,do,else,for,if,return,while"],w=[[v,"auto,case,char,const,default,double,enum,extern,float,goto,int,long,register,short,signed,sizeof,static,struct,switch,typedef,union,unsigned,void,volatile"],"catch,class,delete,false,import,new,operator,private,protected,public,this,throw,true,try,typeof"],F=[w,"alignof,align_union,asm,axiom,bool,concept,concept_map,const_cast,constexpr,decltype,dynamic_cast,explicit,export,friend,inline,late_check,mutable,namespace,nullptr,reinterpret_cast,static_assert,static_cast,template,typeid,typename,using,virtual,where"],G=[w,"abstract,boolean,byte,extends,final,finally,implements,import,instanceof,null,native,package,strictfp,super,synchronized,throws,transient"],H=[G,"as,base,by,checked,decimal,delegate,descending,dynamic,event,fixed,foreach,from,group,implicit,in,interface,internal,into,is,lock,object,out,override,orderby,params,partial,readonly,ref,sbyte,sealed,stackalloc,string,select,uint,ulong,unchecked,unsafe,ushort,var"],w=[w,"debugger,eval,export,function,get,null,set,undefined,var,with,Infinity,NaN"],I=[v,"and,as,assert,class,def,del,elif,except,exec,finally,from,global,import,in,is,lambda,nonlocal,not,or,pass,print,raise,try,with,yield,False,True,None"],J=[v,"alias,and,begin,case,class,def,defined,elsif,end,ensure,false,in,module,next,nil,not,or,redo,rescue,retry,self,super,then,true,undef,unless,until,when,yield,BEGIN,END"],v=[v,"case,done,elif,esac,eval,fi,function,in,local,set,then,until"],K=/^(DIR|FILE|vector|(de|priority_)?queue|list|stack|(const_)?iterator|(multi)?(set|map)|bitset|u?(int|float)\d*)/,N=/\S/,O=u({
keywords:[F,H,w,"caller,delete,die,do,dump,elsif,eval,exit,foreach,for,goto,if,import,last,local,my,next,no,our,print,package,redo,require,sub,undef,unless,until,use,wantarray,while,BEGIN,END"+I,J,v],hashComments:!0,cStyleComments:!0,multiLineStrings:!0,regexLiterals:!0}
),A={
}
;
k(O,["default-code"]);
k(x([],[["pln",/^[^<?]+/],["dec",/^<!\w[^>]*(?:>|$)/],["com",/^<\!--[\S\s]*?(?:--\>|$)/],["lang-",/^<\?([\S\s]+?)(?:\?>|$)/],["lang-",/^<%([\S\s]+?)(?:%>|$)/],["pun",/^(?:<[%?]|[%?]>)/],["lang-",/^<xmp\b[^>]*>([\S\s]+?)<\/xmp\b[^>]*>/i],["lang-js",/^<script\b[^>]*>([\S\s]*?)(<\/script\b[^>]*>)/i],["lang-css",/^<style\b[^>]*>([\S\s]*?)(<\/style\b[^>]*>)/i],["lang-in.tag",/^(<\/?[a-z][^<>]*>)/i]]),["default-markup","htm","html","mxml","xhtml","xml","xsl"]);
k(x([["pln",/^\s+/,q," \t\r\n"],["atv",/^(?:"[^"]*"?|'[^']*'?)/,q,"\"'"]],[["tag",/^^<\/?[a-z](?:[\w-.:]*\w)?|\/?>$/i],["atn",/^(?!style[\s=]|on)[a-z](?:[\w:-]*\w)?/i],["lang-uq.val",/^=\s*([^\s"'>]*(?:[^\s"'/>]|\/(?=\s)))/],["pun",/^[/<->]+/],["lang-js",/^on\w+\s*=\s*"([^"]+)"/i],["lang-js",/^on\w+\s*=\s*'([^']+)'/i],["lang-js",/^on\w+\s*=\s*([^\s"'>]+)/i],["lang-css",/^style\s*=\s*"([^"]+)"/i],["lang-css",/^style\s*=\s*'([^']+)'/i],["lang-css",/^style\s*=\s*([^\s"'>]+)/i]]),["in.tag"]);
k(x([],[["atv",/^[\S\s]+/]]),["uq.val"]);
k(u({
keywords:F,hashComments:!0,cStyleComments:!0,types:K}
),["c","cc","cpp","cxx","cyc","m"]);
k(u({
keywords:"null,true,false"}
),["json"]);
k(u({
keywords:H,hashComments:!0,cStyleComments:!0,verbatimStrings:!0,types:K}
),["cs"]);
k(u({
keywords:G,cStyleComments:!0}
),["java"]);
k(u({
keywords:v,hashComments:!0,multiLineStrings:!0}
),["bsh","csh","sh"]);
k(u({
keywords:I,hashComments:!0,multiLineStrings:!0,tripleQuotedStrings:!0}
),["cv","py"]);
k(u({
keywords:"caller,delete,die,do,dump,elsif,eval,exit,foreach,for,goto,if,import,last,local,my,next,no,our,print,package,redo,require,sub,undef,unless,until,use,wantarray,while,BEGIN,END",hashComments:!0,multiLineStrings:!0,regexLiterals:!0}
),["perl","pl","pm"]);
k(u({
keywords:J,hashComments:!0,multiLineStrings:!0,regexLiterals:!0}
),["rb"]);
k(u({
keywords:w,cStyleComments:!0,regexLiterals:!0}
),["js"]);
k(u({
keywords:"all,and,by,catch,class,else,extends,false,finally,for,if,in,is,isnt,loop,new,no,not,null,of,off,on,or,return,super,then,true,try,unless,until,when,while,yes",hashComments:3,cStyleComments:!0,multilineStrings:!0,tripleQuotedStrings:!0,regexLiterals:!0}
),["coffee"]);
k(x([],[["str",/^[\S\s]+/]]),["regex"]);
window.prettyPrintOne=function(a,m,e){
var h=document.createElement("PRE");
h.innerHTML=a;
e&&D(h,e);
E({
g:m,i:e,h:h}
);
return h.innerHTML}
;
window.prettyPrint=function(a){
function m(){
for(var e=window.PR_SHOULD_USE_CONTINUATION?l.now()+250:Infinity;
p<h.length&&l.now()<e;
p++){
var n=h[p],k=n.className;
if(k.indexOf("prettyprint")>=0){
var k=k.match(g),f,b;
if(b=!k){
b=n;
for(var o=void 0,c=b.firstChild;
c;
c=c.nextSibling)var i=c.nodeType,o=i===1?o?b:c:i===3?N.test(c.nodeValue)?b:o:o;
b=(f=o===b?void 0:o)&&"CODE"===f.tagName}
b&&(k=f.className.match(g));
k&&(k=k[1]);
b=!1;
for(o=n.parentNode;
o;
o=o.parentNode)if((o.tagName==="pre"||o.tagName==="code"||o.tagName==="xmp")&&o.className&&o.className.indexOf("prettyprint")>=0){
b=!0;
break}
b||((b=(b=n.className.match(/\blinenums\b(?::(\d+))?/))?b[1]&&b[1].length?+b[1]:!0:!1)&&D(n,b),d={
g:k,h:n,i:b}
,E(d))}
}
p<h.length?setTimeout(m,250):a&&a()}
for(var e=[document.getElementsByTagName("pre"),document.getElementsByTagName("code"),document.getElementsByTagName("xmp")],h=[],k=0;
k<e.length;
++k)for(var t=0,s=e[k].length;
t<s;
++t)h.push(e[k][t]);
var e=q,l=Date;
l.now||(l={
now:function(){
return+new Date}
}
);
var p=0,d,g=/\blang(?:uage)?-([\w.]+)(?!\S)/;
m()}
;
window.PR={
createSimpleLexer:x,registerLangHandler:k,sourceDecorator:u,PR_ATTRIB_NAME:"atn",PR_ATTRIB_VALUE:"atv",PR_COMMENT:"com",PR_DECLARATION:"dec",PR_KEYWORD:"kwd",PR_LITERAL:"lit",PR_NOCODE:"nocode",PR_PLAIN:"pln",PR_PUNCTUATION:"pun",PR_SOURCE:"src",PR_STRING:"str",PR_TAG:"tag",PR_TYPE:"typ"}
}
)();
CSS代码(docco.css):
/*--------------------- Typography ----------------------------*/
@font-face{font-family:'aller-light';src:url('public/fonts/aller-light.eot');src:url('public/fonts/aller-light.eot?#iefix') format('embedded-opentype'),url('public/fonts/aller-light.woff') format('woff'),url('public/fonts/aller-light.ttf') format('truetype');font-weight:normal;font-style:normal;}
@font-face{font-family:'aller-bold';src:url('public/fonts/aller-bold.eot');src:url('public/fonts/aller-bold.eot?#iefix') format('embedded-opentype'),url('public/fonts/aller-bold.woff') format('woff'),url('public/fonts/aller-bold.ttf') format('truetype');font-weight:normal;font-style:normal;}
@font-face{font-family:'novecento-bold';src:url('public/fonts/novecento-bold.eot');src:url('public/fonts/novecento-bold.eot?#iefix') format('embedded-opentype'),url('public/fonts/novecento-bold.woff') format('woff'),url('public/fonts/novecento-bold.ttf') format('truetype');font-weight:normal;font-style:normal;}
/*--------------------- Layout ----------------------------*/
html{height:100%;}
body{font-family:"aller-light";font-size:14px;line-height:18px;color:#30404f;margin:0;padding:0;height:100%;}
#container{min-height:100%;}
a{color:#000;}
b,strong{font-weight:normal;font-family:"aller-bold";}
p{margin:15px 0 0px;}
.annotation ul,.annotation ol{margin:25px 0;}
.annotation ul li,.annotation ol li{font-size:14px;line-height:18px;margin:10px 0;}
h1,h2,h3,h4,h5,h6{color:#112233;line-height:1em;font-weight:normal;font-family:"novecento-bold";text-transform:uppercase;margin:30px 0 15px 0;}
h1{margin-top:40px;}
hr{border:0;background:1px #ddd;height:1px;margin:20px 0;}
pre,tt,code{font-size:12px;line-height:16px;font-family:Menlo,Monaco,Consolas,"Lucida Console",monospace;margin:0;padding:0;}
.annotation pre{display:block;margin:0;padding:7px 10px;background:#fcfcfc;-moz-box-shadow:inset 0 0 10px rgba(0,0,0,0.1);-webkit-box-shadow:inset 0 0 10px rgba(0,0,0,0.1);box-shadow:inset 0 0 10px rgba(0,0,0,0.1);overflow-x:auto;}
.annotation pre code{border:0;padding:0;background:transparent;}
blockquote{border-left:5px solid #ccc;margin:0;padding:1px 0 1px 1em;}
.sections blockquote p{font-family:Menlo,Consolas,Monaco,monospace;font-size:12px;line-height:16px;color:#999;margin:10px 0 0;white-space:pre-wrap;}
ul.sections{list-style:none;padding:0 0 5px 0;;margin:0;}
/* Force border-box so that % widths fit the parent container without overlap because of margin/padding. More Info:http://www.quirksmode.org/css/box.html*/
ul.sections > li > div{-moz-box-sizing:border-box;/* firefox */
-ms-box-sizing:border-box;/* ie */
-webkit-box-sizing:border-box;/* webkit */
-khtml-box-sizing:border-box;/* konqueror */
box-sizing:border-box;/* css3 */
}
/*---------------------- Jump Page -----------------------------*/
#jump_to,#jump_page{margin:0;background:white;-webkit-box-shadow:0 0 25px #777;-moz-box-shadow:0 0 25px #777;-webkit-border-bottom-left-radius:5px;-moz-border-radius-bottomleft:5px;font:16px Arial;cursor:pointer;text-align:right;list-style:none;}
#jump_to a{text-decoration:none;}
#jump_to a.large{display:none;}
#jump_to a.small{font-size:22px;font-weight:bold;color:#676767;}
#jump_to,#jump_wrapper{position:fixed;right:0;top:0;padding:10px 15px;margin:0;}
#jump_wrapper{display:none;padding:0;}
#jump_to:hover #jump_wrapper{display:block;}
#jump_page{padding:5px 0 3px;margin:0 0 25px 25px;}
#jump_page .source{display:block;padding:15px;text-decoration:none;border-top:1px solid #eee;}
#jump_page .source:hover{background:#f5f5ff;}
#jump_page .source:first-child{}
/*---------------------- Low resolutions (> 320px) ---------------------*/
@media only screen and (min-width:320px){.pilwrap{display:none;}
ul.sections > li > div{display:block;padding:5px 10px 0 10px;}
ul.sections > li > div.annotation ul,ul.sections > li > div.annotation ol{padding-left:30px;}
ul.sections > li > div.content{overflow-x:auto;-webkit-box-shadow:inset 0 0 5px #e5e5ee;box-shadow:inset 0 0 5px #e5e5ee;border:1px solid #dedede;margin:5px 10px 5px 10px;padding-bottom:5px;}
ul.sections > li > div.annotation pre{margin:7px 0 7px;padding-left:15px;}
ul.sections > li > div.annotation p tt,.annotation code{background:#f8f8ff;border:1px solid #dedede;font-size:12px;padding:0 0.2em;}
}
/*---------------------- (> 481px) ---------------------*/
@media only screen and (min-width:481px){#container{position:relative;}
body{background-color:#F5F5FF;font-size:15px;line-height:21px;}
pre,tt,code{line-height:18px;}
p,ul,ol{margin:0 0 15px;}
#jump_to{padding:5px 10px;}
#jump_wrapper{padding:0;}
#jump_to,#jump_page{font:10px Arial;text-transform:uppercase;}
#jump_page .source{padding:5px 10px;}
#jump_to a.large{display:inline-block;}
#jump_to a.small{display:none;}
#background{position:absolute;top:0;bottom:0;width:350px;background:#fff;border-right:1px solid #e5e5ee;z-index:-1;}
ul.sections > li > div.annotation ul,ul.sections > li > div.annotation ol{padding-left:40px;}
ul.sections > li{white-space:nowrap;}
ul.sections > li > div{display:inline-block;}
ul.sections > li > div.annotation{max-width:350px;min-width:350px;min-height:5px;padding:13px;overflow-x:hidden;white-space:normal;vertical-align:top;text-align:left;}
ul.sections > li > div.annotation pre{margin:15px 0 15px;padding-left:15px;}
ul.sections > li > div.content{padding:13px;vertical-align:top;border:none;-webkit-box-shadow:none;box-shadow:none;}
.pilwrap{position:relative;display:inline;}
.pilcrow{font:12px Arial;text-decoration:none;color:#454545;position:absolute;top:3px;left:-20px;padding:1px 2px;opacity:0;-webkit-transition:opacity 0.2s linear;}
.for-h1 .pilcrow{top:47px;}
.for-h2 .pilcrow,.for-h3 .pilcrow,.for-h4 .pilcrow{top:35px;}
ul.sections > li > div.annotation:hover .pilcrow{opacity:1;}
}
/*---------------------- (> 1025px) ---------------------*/
@media only screen and (min-width:1025px){body{font-size:16px;line-height:24px;}
#background{width:525px;}
ul.sections > li > div.annotation{max-width:525px;min-width:525px;padding:10px 25px 1px 50px;}
ul.sections > li > div.content{padding:9px 15px 16px 25px;}
}
/*---------------------- Syntax Highlighting -----------------------------*/
td.linenos{background-color:#f0f0f0;padding-right:10px;}
span.lineno{background-color:#f0f0f0;padding:0 5px 0 5px;}
/*github.com style (c) Vasily Polovnyov <vast@whiteants.net>*/
pre code{display:block;padding:0.5em;color:#000;background:#f8f8ff}
pre .hljs-comment,pre .hljs-template_comment,pre .hljs-diff .hljs-header,pre .hljs-javadoc{color:#408080;font-style:italic}
pre .hljs-keyword,pre .hljs-assignment,pre .hljs-literal,pre .hljs-css .hljs-rule .hljs-keyword,pre .hljs-winutils,pre .hljs-javascript .hljs-title,pre .hljs-lisp .hljs-title,pre .hljs-subst{color:#954121;/*font-weight:bold*/
}
pre .hljs-number,pre .hljs-hexcolor{color:#40a070}
pre .hljs-string,pre .hljs-tag .hljs-value,pre .hljs-phpdoc,pre .hljs-tex .hljs-formula{color:#219161;}
pre .hljs-title,pre .hljs-id{color:#19469D;}
pre .hljs-params{color:#00F;}
pre .hljs-javascript .hljs-title,pre .hljs-lisp .hljs-title,pre .hljs-subst{font-weight:normal}
pre .hljs-class .hljs-title,pre .hljs-haskell .hljs-label,pre .hljs-tex .hljs-command{color:#458;font-weight:bold}
pre .hljs-tag,pre .hljs-tag .hljs-title,pre .hljs-rules .hljs-property,pre .hljs-django .hljs-tag .hljs-keyword{color:#000080;font-weight:normal}
pre .hljs-attribute,pre .hljs-variable,pre .hljs-instancevar,pre .hljs-lisp .hljs-body{color:#008080}
pre .hljs-regexp{color:#B68}
pre .hljs-class{color:#458;font-weight:bold}
pre .hljs-symbol,pre .hljs-ruby .hljs-symbol .hljs-string,pre .hljs-ruby .hljs-symbol .hljs-keyword,pre .hljs-ruby .hljs-symbol .hljs-keymethods,pre .hljs-lisp .hljs-keyword,pre .hljs-tex .hljs-special,pre .hljs-input_number{color:#990073}
pre .hljs-builtin,pre .hljs-constructor,pre .hljs-built_in,pre .hljs-lisp .hljs-title{color:#0086b3}
pre .hljs-preprocessor,pre .hljs-pi,pre .hljs-doctype,pre .hljs-shebang,pre .hljs-cdata{color:#999;font-weight:bold}
pre .hljs-deletion{background:#fdd}
pre .hljs-addition{background:#dfd}
pre .hljs-diff .hljs-change{background:#0086b3}
pre .hljs-chunk{color:#aaa}
pre .hljs-tex .hljs-formula{opacity:0.5;}
CSS代码(microfiche.css):
.microfiche-controls{display:block;text-align:center;font-size:10px;padding:5px 0px;}
.microfiche-bullet{display:inline-block;cursor:pointer;width:10px;height:10px;border-radius:6px;background:#000;overflow:hidden;text-indent:-1000px;margin:0 5px;opacity:0.25;appearance:none;border:none;outline:none;padding:0;}
.microfiche-bullet.selected{opacity:1;}
.microfiche-button{margin:0 15px;}
CSS代码(prettify.css):
.pln{color:#000}
@media screen{.str{color:#080}
.kwd{color:#008}
.com{color:#800}
.typ{color:#606}
.lit{color:#066}
.pun,.opn,.clo{color:#660}
.tag{color:#008}
.atn{color:#606}
.atv{color:#080}
.dec,.var{color:#606}
.fun{color:red}
}
@media print,projection{.str{color:#060}
.kwd{color:#006;font-weight:bold}
.com{color:#600;font-style:italic}
.typ{color:#404;font-weight:bold}
.lit{color:#044}
.pun,.opn,.clo{color:#440}
.tag{color:#006;font-weight:bold}
.atn{color:#404}
.atv{color:#060}
}
pre.prettyprint{padding:2px;border:1px solid #888}
ol.linenums{margin-top:0;margin-bottom:0}
li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8{list-style-type:none}
li.L1,li.L3,li.L5,li.L7,li.L9{background:#eee}
分享到QQ
分享到微博
微信扫一扫
