In Progress

parent 7ad2e057
/* RESET */
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input{margin:0;padding:0}h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,th{font-size:1em;font-weight:normal;font-style:normal}ul,ol{list-style:none}fieldset,img{border:none}caption,th{text-align:left}table{border-collapse:collapse;border-spacing:0}
html {
margin-bottom: 1px;
overflow: -moz-scrollbars-vertical !important;
overflow-y: scroll;
}
body { font: 11px/18px "Lucida Sans Unicode", "Lucida Sans", "Lucida Grande", Verdana, Arial, sans-serif; background-color: #646461; color: #E0DFDC; -webkit-font-smoothing: antialiased;}
p { margin-bottom: 18px; }
a { color: red; text-decoration: none; outline-style: none; }
a:hover { text-decoration: underline; }
#page { margin: 0 auto; width: 813px; padding-top: -25px;}
h1, h2 { clear: both; font-family: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, sans-serif; font-weight: bold; margin: 0 0 17px 0;}
h1 { font-size: 27px; line-height: 34px; font-family: "HelveticaNeue","Helvetica Neue","HelveticaNeueRoman","HelveticaNeue-Roman","Helvetica Neue Roman",Helvetica,Arial,sans-serif,Verdana; }
h2 { font-size: 11px; line-height: 17px; margin-bottom: 0; }
.demonstrations { float: left; clear: both; width: 100%; margin-bottom: 18px; }
.demonstrations a {
float: left;
width: 150px;
height: 100px;
margin: 5px 5px ;
cursor: pointer;
}
.demonstrations a img {
float: left;
width: 100px;
height: 100px;
}
.demonstrations .rightmost { margin-right: 0; }
.resources strong { font-family: "Lucida Sans"; }
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<!--[if lt IE 9]>
<script type="text/javascript" src="../js/excanvas/excanvas.js"></script>
<![endif]-->
<script type="text/javascript" src="../js/spinners/spinners.min.js"></script>
<script type="text/javascript" src="../js/lightview/lightview.js"></script>
<link rel="stylesheet" type="text/css" href="../css/lightview/lightview.css" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
<meta name="robots" content="noindex,nofollow" >
</head>
<body>
<div id='page'>
<a href='images/paktb.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Pendiri Museum TB SILALAHI CENTER"
data-lightview-caption="TB SILALAHI merupakan pemilik Museum yang cukup terkenal di Toba Samosir ini. ">
<img src='images/thumbnails/paktb.jpg' alt=''/>
</a>
<div class='demonstrations'>
<a href='images/whitepink.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Kolam Renang"
data-lightview-caption="TB SILALAHI telah membangun sebuah kolam renang bagi pengunjung yang mengunjungi Museum ini. Namun untuk lokasi Kolam renang ini sudah berada di luar Museum. Untuk dapat masuk ke Kolam renang ini cukup dengan membayar 10.000 pengunjung sudah bebas berenang di kolam renang ini">
<img src='images/thumbnails/whitepink.jpg' alt=''/>
</a>
<a href='images/white.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Gedung Museum Batak"
data-lightview-caption="Pada Gedung ini kita dapat melihat semua barang-barang pusaka yang dimiliki oleh pendiri Museum TB SILALAHI CENTER ini. Dimulai dari seragam yang pernah digunakan, foto foto keluarga Bapa TB SILALAHI, Kendaraan, Jam tangan, perpustakaan sederhana dan yang lainnya.">
<img src='images/thumbnails/white.jpg' alt=''/>
</a>
<a href='images/raindrop.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Peresmian Museum Batak"
data-lightview-caption="Pada museum TB SILALAHI CENTER ini di dalmnya ada museum Batak. Museum ini diresmikan langsung oleh Mantan Presiden DR.H.SUSILO BAMBANG YUDHOYONO pada 18 Januari 2011 di Balige(lokai Museum)">
<img src='images/thumbnails/raindrop.jpg' alt=''/>
</a>
<a href='images/motor.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Motor Tua TB SILALAHI"
data-lightview-caption="Motor ini merupakan motor tua yang dimiliki oleh TB SILALAHI. Motor ini menjadi salah satu koleksi yang ada pada Gedung Museum Batak.">
<img src='images/thumbnails/motor.jpg' alt=''/>
</a>
<a href='images/gerbang.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Gerbang Utama"
data-lightview-caption="Gerbang utama ini merupakan jalur utama atau pintu masuk untuk dapat mengunjungi Museum ini.">
<img src='images/thumbnails/gerbang.jpg' alt=''/>
</a>
<a href='images/pesta.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Pesta Batak"
data-lightview-caption="Di Museum ini sering diadakan suatu pesta rakyat dengan topik Batak. Salah satunya adalah Pesta Batak . Pesta ini diadakan guna meningkatkan perhatian masyarakat sekitar kepada Museum ini dan sebagai salah satu bukti pengabdian Bapa TB SILALAHI kepada masyarakat sekitar ">
<img src='images/thumbnails/pesta.jpg' alt=''/>
</a>
<a href='images/budaya.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Suasana Pesta Batak"
data-lightview-caption="Suasana Pesta Batak yang dihadiri oleh Bapak TB SILALAHI serta para pejabat dan dimeriahkan juga oleh masyarakat yang ikut berpartisipasi dalam Pesta Batak ini.">
<img src='images/thumbnails/budaya.jpg' alt=''/>
</a>
<a href='images/uang.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Koleksi Uang TB SILALAHI CENTER"
data-lightview-caption="Uang kertas merupakan salah satu koleksi yang ada pada museum ini. Uang kertas ini merupakan uang kertas pada jaman dahulu yang sekarang sudah tidak beredar lagi">
<img src='images/thumbnails/uang.jpg' alt=''/>
</a>
<a href='images/sigale.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Patung Sigale-Gale"
data-lightview-caption="Patung seigale-gale ini menjadi salah satu daya tarik pengunjung untuk berkunjung ke Museum ini.">
<img src='images/thumbnails/sigale.jpg' alt=''/>
</a>
<a href='images/ruma.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Koleksi TB SILALAHI CENTER"
data-lightview-caption="Gambar di atas adalah gambar yang mendeskripsikan suasana kampung batak. Hal ini bisa terlihat dari koleksi yang ada pada gambar.">
<img src='images/thumbnails/ruma.jpg' alt=''/>
</a>
<a href='images/bendasejarah.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Koleksi Pedang TB SILALAHI CENTER"
data-lightview-caption="Koleksi pedang seperti gambar di atas adalah kumpulan pedang yang ada pada jaman dahulu.Kumpulan pedang ini memiliki makna dan kegunaannya masing-masing sesuai dengan karakteristik yang ada pada pedang tersebut.">
<img src='images/thumbnails/bendasejarah.jpg' alt=''/>
</a>
<a href='images/patungbatak.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Pengunjung TB SILALAHI CENTER"
data-lightview-caption="Pengunjung berselfie di koleksi yang ada di dalam Museum.Pada gambar di atas Pengunjung berselfie dengan patung adat batak Toba.">
<img src='images/thumbnails/patungbatak.jpg' alt=''/>
</a>
<a href='images/mobil.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Bekas Mobil TB SILALAHI"
data-lightview-caption="Ini merupakan bekas mobil yang dimiliki oleh TB SILALAHI sewaktu menjabat sebagai Menteri. Mobil tersebut sekarang dapat kita lihat langsung di Museum TB SILALAHI CENTER. Mobil ini sekarang menjadi salah satu koleksi yang ada pada Museum Batak">
<img src='images/thumbnails/mobil.jpg' alt=''/>
</a>
<a href='images/danau.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Pemandangan Danau Toba"
data-lightview-caption="Lokasi Museum TB SILALAHI CENTER ini juga sangat strategis. Hal ini bisa kita lihat bahwa Museum ini dekat dengan Danau Toba. Kita bisa menikmati indahnya Pemandangan Danau Toba dari lantai 2 Gedung yang ada di Museum ini. Sehingga ini juga merupakan sebuah daya tarik yang cukup mengajak pengunjung untuk berkunjung ke Museum ini.">
<img src='images/thumbnails/danau.jpg' alt=''/>
</a>
<a href='images/sd.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Pengunjung TB SILALAHI CENTER"
data-lightview-caption="Selain untuk melihat segala peninggalan sejarah dan fitur-fitur lainnyha, Museum ini juga dijadikan sebagai wadah pembelajaran, terutama untuk kaum muda. Agar kaum muda tau tentang sejarah yang pernah ada.">
<img src='images/thumbnails/sd.jpg' alt=''/>
</a>
<a href='images/mandang.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Pemandangan TB SILALAHI CENTER"
data-lightview-caption="Kita dapat menikmati indahnya pemandangan Danau Toba dan persawahan masyarakat sekitar.">
<img src='images/thumbnails/mandang.jpg' alt=''/>
</a>
<a href='images/perbaikan.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Perbaikan kawasan TB SILALAHI CENTER"
data-lightview-caption="Terlihat pada gambar sedang ada perbaikan bagi Jalan menuju salah satu fitur pariwisata TB SILALAHI CENTER. Jika terjadi kerusakan, akan segera diperbaiki guna menjaga keindahan fitur yang ada pada Museum ini.">
<img src='images/thumbnails/perbaikan.jpg' alt=''/>
</a>
<a href='images/gondang.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title=" Koleksi TB SILALAHI CENTER"
data-lightview-caption="Gondang merupakan salah satu koleksi yang ada pada Museum ini.Gondang merupakan salah satu jenis alat musik khas Batak. ">
<img src='images/thumbnails/gondang.jpg' alt=''/>
</a>
<a href='images/gereja.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Koleksi TB SILALAHI CENTER"
data-lightview-caption="Selain menyimpan peninggalan sejarah, pada museum ini juga menyimpan koleksi kerajinan seperti Gereja mini di atas.">
<img src='images/thumbnails/gereja.jpg' alt=''/>
</a>
<a href='images/love.jpg'
class='lightview'
data-lightview-group='example'
data-lightview-title="Pengunjung TB SILALAHI CENTER"
data-lightview-caption="Pengunjung TB SILALAHI CENTER bebas menikmati segala fitur yang ada pada Museum ini.">
<img src='images/thumbnails/love.jpg' alt=''/>
</a>
</div>
</div>
</body>
</html>
\ No newline at end of file
/*!
* Spinners 3.0.0
* (c) 2010-2012 Nick Stakenburg - http://www.nickstakenburg.com
*
* Spinners is freely distributable under the terms of an MIT-style license.
*
* GitHub: http://github.com/staaky/spinners
*/
;var Spinners={version:"3.0.0"};(function(a){function b(a){return a*Math.PI/180}function c(a){this.element=a}function d(b,c){b&&(this.element=b,h.remove(b),h.removeDetached(),this._position=0,this._state="stopped",this.setOptions(a.extend({color:"#000",dashes:12,radius:5,height:5,width:1.8,opacity:1,padding:3,rotation:700},c||{})),this.drawPosition(0),h.add(this))}var e={scroll:function(a,b){if(!b)return a;var c=a.slice(0,b);return a.slice(b,a.length).concat(c)},isElement:function(a){return a&&1==a.nodeType},element:{isAttached:function(){return function(a){for(;a&&a.parentNode;)a=a.parentNode;return!!a&&!!a.body}}()}},f={drawRoundedRectangle:function(c,d){var e=a.extend({top:0,left:0,width:0,height:0,radius:0},d||{}),f=e.left,g=e.top,h=e.width,i=e.height,e=e.radius;c.beginPath(),c.moveTo(f+e,g),c.arc(f+h-e,g+e,e,b(-90),b(0),!1),c.arc(f+h-e,g+i-e,e,b(0),b(90),!1),c.arc(f+e,g+i-e,e,b(90),b(180),!1),c.arc(f+e,g+e,e,b(-180),b(-90),!1),c.closePath(),c.fill()}},g=function(){function a(a){var c=[];0==a.indexOf("#")&&(a=a.substring(1)),a=a.toLowerCase();if(""!=a.replace(b,""))return null;3==a.length?(c[0]=a.charAt(0)+a.charAt(0),c[1]=a.charAt(1)+a.charAt(1),c[2]=a.charAt(2)+a.charAt(2)):(c[0]=a.substring(0,2),c[1]=a.substring(2,4),c[2]=a.substring(4));for(a=0;a<c.length;a++)c[a]=parseInt(c[a],16);return c.red=c[0],c.green=c[1],c.blue=c[2],c}var b=RegExp("[0123456789abcdef]","g"),c=function(){function a(a,b,c){return a=a.toString(c||10),Array(b-a.length).join("0")+a}return function(b,c,d){return"#"+a(b,2,16)+a(c,2,16)+a(d,2,16)}}();return{hex2rgb:a,hex2fill:function(b,c){"undefined"==typeof c&&(c=1);var d=c,e=a(b);return e[3]=d,e.opacity=d,"rgba("+e.join()+")"},rgb2hex:c}}();a.extend(Spinners,{enabled:!1,support:{canvas:function(){var b=a("<canvas>")[0];return!!b.getContext&&!!b.getContext("2d")}()},init:function(){if(this.support.canvas||window.G_vmlCanvasManager&&window.attachEvent&&-1===navigator.userAgent.indexOf("Opera"))window.G_vmlCanvasManager&&window.G_vmlCanvasManager.init_(document),this.enabled=!0},create:function(a,b){return c.create(a,b),this.get(a)},get:function(a){return new c(a)},play:function(a){return this.get(a).play(),this},pause:function(a){return this.get(a).pause(),this},toggle:function(a){return this.get(a).toggle(),this},stop:function(a){return this.get(a).stop(),this},remove:function(a){return this.get(a).remove(),this},removeDetached:function(){return h.removeDetached(),this},center:function(a){return this.get(a).center(),this},setOptions:function(a,b){return this.get(a).setOptions(b),this},getDimensions:function(a){return a=2*h.get(a)[0].getLayout().workspace.radius,{width:a,height:a}}});var h={spinners:[],get:function(b){if(b){var c=[];return a.each(this.spinners,function(d,f){f&&(e.isElement(b)?f.element==b:a(f.element).is(b))&&c.push(f)}),c}},add:function(a){this.spinners.push(a)},remove:function(b){a(a.map(this.spinners,function(c){if(e.isElement(b)?c.element==b:a(c.element).is(b))return c.element})).each(a.proxy(function(a,b){this.removeByElement(b)},this))},removeByElement:function(b){var c=this.get(b)[0];c&&(c.remove(),this.spinners=a.grep(this.spinners,function(a){return a.element!=b}))},removeDetached:function(){a.each(this.spinners,a.proxy(function(a,b){b&&b.element&&!e.element.isAttached(b.element)&&this.remove(b.element)},this))}};a.extend(c,{create:function(b,c){if(b){var f=c||{},g=[];return e.isElement(b)?g.push(new d(b,f)):a(b).each(function(a,b){g.push(new d(b,f))}),g}}}),a.extend(c.prototype,{items:function(){return h.get(this.element)},play:function(){return a.each(this.items(),function(a,b){b.play()}),this},stop:function(){return a.each(this.items(),function(a,b){b.stop()}),this},pause:function(){return a.each(this.items(),function(a,b){b.pause()}),this},toggle:function(){return a.each(this.items(),function(a,b){b.toggle()}),this},center:function(){return a.each(this.items(),function(a,b){b.center()}),this},setOptions:function(b){return a.each(this.items(),function(a,c){c.setOptions(b)}),this},remove:function(){return h.remove(this.element),this}}),a.extend(d.prototype,{setOptions:function(b){this.options=a.extend({},this.options,b||{}),this.options.radii&&(b=this.options.radii,this.options.radius=Math.min(b[0],b[1]),this.options.height=Math.max(b[0],b[1])-this.options.radius),this.options.dashWidth&&(this.options.width=this.options.dashWidth),this.options.speed&&(this.options.duration=1e3*this.options.speed);var b=this._state,c=this._position;this._layout=null,this.build(),c&&c>=this.options.dashes-1&&(this._position=this.options.dashes-1);switch(b){case"playing":this.play();break;case"paused":case"stopped":this.drawPosition(this._position)}this._centered&&this.center()},remove:function(){this.canvas&&(this.pause(),a(this.canvas).remove(),this.ctx=this.canvas=null)},build:function(){this.remove();var b=this.getLayout().workspace.radius;return a(document.body).append(this.canvas=a("<canvas>").attr({width:2*b,height:2*b}).css({zoom:1})),window.G_vmlCanvasManager&&G_vmlCanvasManager.initElement(this.canvas[0]),this.ctx=this.canvas[0].getContext("2d"),this.ctx.globalAlpha=this.options.opacity,a(this.element).append(this.canvas),this.ctx.translate(b,b),this},drawPosition:function(a){var c=this.getLayout().workspace,a=e.scroll(c.opacities,-1*a),d=c.radius,c=this.options.dashes,f=b(360/c);this.ctx.clearRect(-1*d,-1*d,2*d,2*d);for(d=0;d<c;d++)this.drawDash(a[d],this.options.color),this.ctx.rotate(f)},drawDash:function(a,b){this.ctx.fillStyle=g.hex2fill(b,a);var c=this.getLayout(),d=c.workspace.radius,e=c.dash.position,c=c.dash.dimensions;f.drawRoundedRectangle(this.ctx,{top:e.top-d,left:e.left-d,width:c.width,height:c.height,radius:Math.min(c.height,c.width)/2})},_nextPosition:function(){var b=this.options.rotation/this.options.dashes;this.nextPosition(),this._playTimer=window.setTimeout(a.proxy(this._nextPosition,this),b)},nextPosition:function(){this._position==this.options.dashes-1&&(this._position=-1),this._position++,this.drawPosition(this._position)},play:function(){if("playing"!=this._state){this._state="playing";var b=this.options.rotation/this.options.dashes;return this._playTimer=window.setTimeout(a.proxy(this._nextPosition,this),b),this}},pause:function(){if("paused"!=this._state)return this._pause(),this._state="paused",this},_pause:function(){this._playTimer&&(window.clearTimeout(this._playTimer),this._playTimer=null)},stop:function(){if("stopped"!=this._state)return this._pause(),this._position=0,this.drawPosition(0),this._state="stopped",this},toggle:function(){return this["playing"==this._state?"pause":"play"](),this},getLayout:function(){if(this._layout)return this._layout;for(var a=this.options,b=a.dashes,c=a.width,d=a.radius,e=a.radius+a.height,f=Math.max(c,e),f=Math.ceil(Math.max(f,Math.sqrt(e*e+c/2*(c/2)))),a=f+=a.padding,g=1/b,h=[],i=0;i<b;i++)h.push((i+1)*g);return this._layout=b={workspace:{radius:a,opacities:h},dash:{position:{top:f-e,left:f-c/2},dimensions:{width:c,height:e-d}}}},center:function(){var b=2*this.getLayout().workspace.radius;a(this.element.parentNode).css({position:"relative"}),a(this.element).css({position:"absolute",height:b+"px",width:b+"px",top:"50%",left:"50%",marginLeft:-0.5*b+"px",marginTop:-0.5*b+"px"}),this._centered=!0}}),Spinners.init(),Spinners.enabled||(c.create=function(){return[]})})(jQuery);
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment