From 7f3466995d23789b9a6af2fe883b36e01055914c Mon Sep 17 00:00:00 2001 From: vitalif Date: Fri, 8 Mar 2013 23:22:58 +0000 Subject: [PATCH] Standalone (NO JQUERY) Slimbox2 clone --- autoload.js | 22 ++++ closelabel.gif | Bin 0 -> 971 bytes loading.gif | Bin 0 -> 1279 bytes next.png | Bin 0 -> 1359 bytes nextlabel.gif | Bin 0 -> 354 bytes prev.png | Bin 0 -> 1368 bytes prevlabel.gif | Bin 0 -> 371 bytes slimbox2-rtl.css | 84 ++++++++++++++ slimbox2.css | 83 ++++++++++++++ slimbox2.js | 288 +++++++++++++++++++++++++++++++++++++++++++++++ 10 files changed, 477 insertions(+) create mode 100644 autoload.js create mode 100644 closelabel.gif create mode 100644 loading.gif create mode 100644 next.png create mode 100644 nextlabel.gif create mode 100644 prev.png create mode 100644 prevlabel.gif create mode 100644 slimbox2-rtl.css create mode 100644 slimbox2.css create mode 100644 slimbox2.js diff --git a/autoload.js b/autoload.js new file mode 100644 index 0000000..7961f8d --- /dev/null +++ b/autoload.js @@ -0,0 +1,22 @@ +// AUTOLOAD CODE BLOCK (MAY BE CHANGED OR REMOVED) +addListener(window, 'load', function(){ + if (!/android|iphone|ipod|series60|symbian|windows ce|blackberry/i.test(navigator.userAgent)) { + var as = document.getElementsByTagName('A'); + var links = []; + var w = 100*Math.floor((document.documentElement.offsetWidth*0.8)/100); + var h = 100*Math.floor((document.documentElement.offsetHeight*0.8)/100); + var t; + for (var i = 0; i < as.length; i++) { + if (as[i].getAttribute('rel') == 'lightbox') { + t = as[i].title; + t += ' '+(t?'(с':'С')+'м. полный размер'+(t?')':'')+''; + links.push({ + element: as[i], + url: as[i].href + (as[i].href.indexOf('?') ? '&' : '?') + ('w='+w+'&h='+h), + title: t + }); + } + } + setSlimbox(links); + } +}); diff --git a/closelabel.gif b/closelabel.gif new file mode 100644 index 0000000000000000000000000000000000000000..af0cab2d77308533759e404186138d03f8acdbef GIT binary patch literal 971 zcmZ?wbh9u|bYc)=c*nr-@87@w|NmE2Ro%XQ`@n$%2M->cJ9lnmWaOnwmztZK*RNmy z_3PIsPoDJj^z7KNBOoAP%9JS~At7O5VR!D_IeGGAP*6}rL_}aTMlLqq@m z{rl?Gt8d@FojG&n?%li9)zt|J3E|=4ixw^V_3PKNWy}2i{e66VzJLFomX;PDAOGON z18;Bdd-v`wT)6PhpFbZye0cr(_3z)mw{G2ePygic_afojrTDva<5y$B!u~ zDN#{T&!0bk|Ni~v&6_uF-1zwMED{)I5FqG&wnW z(xgc%SFY^n=(vCX{?45{w`|!`P*Bj;)|Q%@`u6SHva+(=+}s&6W=x+xJufdWKR>^( zukY&Bs|<7jIv`s>alyd;zk#u-xuvzOy`!_MyQjCWzlUMcVTuf)vJ@pAI$_0*%MGWNz?D z2sSZ=HnDK4J)KhFC&bLirX@MUV#=fiRl5mAPG{=tlbbJv zvNLE|-KY$42y&jvbi^a*VFQaG`+u#1m71BaRd-MBielnYXtrWhm6)mdj2b@HXewoo_%=m)AkyVZ3!NNe}gbxh{BJw|8JkdD!LWx<}GGzky6o-t3N2dB8 hQu1a{2`N3vW?OLcsrDw5$DMWQzhw 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 RYi|Gm002ovPDHLkV1nR~ca{JE literal 0 HcmV?d00001 diff --git a/nextlabel.gif b/nextlabel.gif new file mode 100644 index 0000000000000000000000000000000000000000..7c66121faf40ef2950abb16de34fd063dc3022de GIT binary patch literal 354 zcmV-o0iFIwNk%w1VLt#M0K^;sdU|@Qs;bV;&S7C;^Yio2(9pud!rR;1ZEbCyo}QeX zoK;m-hK7c=wzlWz=hoKNhlhvH&(FTTzWVz5!NI|jl9KuP`QP8)&CShna&k#YN&o-< zGcz*)0000000000A^8LW000~SEC2ui06zdA000HwAjfTFX`X1Rt}HsXa4gSsZQppV z?|kq7z@TtQEEDG5v(jwV}*VpRx<8<0-`pa5zlY#M)-oIr#d z2c`s`grTFXW2l%ts~e55DhLY)as;+YRV14WP@TyqTUm|6s>QTRW@y&52ql|}m&B;a zQeOnyC4;BkN$Kk86A=aP@b4HG>n#=(2KoB=5)bwN00RmfNU-3Gf-poNgb@M&I}o6s A+yDRo literal 0 HcmV?d00001 diff --git a/prev.png b/prev.png new file mode 100644 index 0000000000000000000000000000000000000000..6f50afd20d0ad806a598f50b035899fdb9469bd9 GIT binary patch literal 1368 zcmV-e1*iInP)%BJCJfu!3mS^I)f<}&londh$;@2TG0^$o9t<(drY1ge3!o1z*BD7K z;Sqc>BIBYDnwUkxCE*1XIulJWzCnN#%0))~Hu*LG6VA>#n&|)ZpL_y2{Ic=s@BjUs z|7m$3kx2X}{13}O7=cI_>6$>WmDVCmA_JJ{E6Jq4hyX-j1{RPD9whR>DPWd#NJuvk z0T}32KM4we19-p_Lx2bZ!IPlUZns~bot>TE+uQr=;NakJet!Or*XzATG7pngwvU$z%$m=24KF8UXr=Fo|qn171+=a=C8e)xVp#&)VJHJ-{}51$Ct$ zpF~9dBJyBcBoZ}lxBJ7z#l_ze3M(FuZ$qSxGL#2I9v#sRHj}7zI2<3XtgQU0B(b@< zxz*Iv6h>`11>V9-L_65j37gIK!SeF*A1V^t6%`eqpf&`a0!1K8udoY}PFU#|sz$Ki zpP89iR+3m>U*8FZLfxpn0GktAHSolGPl@Dh;+n33hTjDN4j* zu^qqPAE8c^0jDGr27tv)ge2H@@}`1~PDE9LoxIsaC=+bNN`lQ(M4KcI$lz;+~p^WG!k_qx@tN1`ee}Dh9noM(Z^KI0<0V+s_ zvcfvU|31P-Z~+C_hs-o|cXv;z$+Wk(Ponk;sFZew$?z3nonbO1pxj_E)JGzbNtPM; z>g?>CLTx?pOJuT`3@;J6Ocp3i$$+c9y}jS4$#isdOw%??Wu{On!&5}w87AWcjgV2z zOj}#qq$D#Qr2)YEc|??S#zWht@gEF;an!v|@-i7-B5IlO0G}v|S1B`!D;y4gM+3mm zWY_@UE22FBR6Ent)AM~YTOa^DvdnN3(H;N||8@Y#Is^EKXb*rlai7r|028Qt4ZHvz z0eQfrmk1jGOr{hBa6Y>>JUo0y<2dsbPS%&`_+tYnIlj}Vof(p;#GBJ^4Gj(bpmA!R zLbg(;@H%fT?Gr!=IFDbruB)r-^Rcn9h4Jz61$_Uh#bOE4C%jhu!>&C5 z@_~z<8lMHv(N`~c9N49g#rlb8%b01~oCXe1OgQLTw(Ly`T}8A%hA`9i$tF(GHTI_* awEhM}ydyM2>q~ literal 0 HcmV?d00001 diff --git a/prevlabel.gif b/prevlabel.gif new file mode 100644 index 0000000000000000000000000000000000000000..064187672c20444b0d5e80282b40ddab59296748 GIT binary patch literal 371 zcmZ?wbhEHbv}aIYI3mTcapT68mX=GGF8%%cHz_G8H#hg?%a?cV+&O;y_^w^MX3d(_ z-`~G<>C!!W_T0UDx3aSG%a<=tpFZ8ad-ttdxBmV6w{6?D-@kvKIddjFJpBLv|Hj6~ z45&cyCkrD3gA{`fNEl=%1M7zbwZ4?hc^Ru_&DyrF;Lon2-1`;l-q*bUe_%m@hmKVL zi6?vwnMraS6F2WHNMX6W%%L%Jf|P{Agp~{i91_lK!3;AvTeQ_4lu66@2PxPd<8a|f z%w|;Psf$Qb<*$)sli+spsh4a_Dpuys>`+VS^a-p@O|Ow)VPs^T9>KbNxsm`2s}k#` ziGIr#EM?4K5GY!+Ryl@ms`DhZ=_yLH)hc*mvbIfDnJ&39>x>%z$_dBnPP7!YM3j_X zPLNn|>A{Tl$forhy*_{Wsw61P{_FQI=5N~KS}GDA28}G-|3d;K4s1v~+#;atHOFJ) OBLOL~;4K`C4Auad8=cVr literal 0 HcmV?d00001 diff --git a/slimbox2-rtl.css b/slimbox2-rtl.css new file mode 100644 index 0000000..d59e371 --- /dev/null +++ b/slimbox2-rtl.css @@ -0,0 +1,84 @@ +/* SLIMBOX */ + +#lbOverlay { + position: fixed; + z-index: 9999; + left: 0; + top: 0; + width: 100%; + height: 100%; + background-color: #000; + cursor: pointer; +} + +#lbCenter, #lbBottomContainer { + position: absolute; + z-index: 9999; + overflow: hidden; + background-color: #fff; +} + +.lbLoading { + background: #fff url(loading.gif) no-repeat center; +} + +#lbImage { + position: absolute; + left: 0; + top: 0; + border: 10px solid #fff; + background-repeat: no-repeat; +} + +#lbPrevLink, #lbNextLink { + display: block; + position: absolute; + top: 0; + width: 50%; + outline: none; +} + +#lbPrevLink { + right: 0; +} + +#lbPrevLink:hover { + background: transparent url(prevlabel.gif) no-repeat 100% 15%; +} + +#lbNextLink { + left: 0; +} + +#lbNextLink:hover { + background: transparent url(nextlabel.gif) no-repeat 0 15%; +} + +#lbBottom { + font-family: Verdana, Arial, Geneva, Helvetica, sans-serif; + font-size: 10px; + color: #666; + line-height: 1.4em; + text-align: right; + border: 10px solid #fff; + border-top-style: none; + direction: rtl; +} + +#lbCloseLink { + display: block; + float: left; + width: 66px; + height: 22px; + background: transparent url(closelabel.gif) no-repeat center; + margin: 5px 0; + outline: none; +} + +#lbCaption, #lbNumber { + margin-left: 71px; +} + +#lbCaption { + font-weight: bold; +} diff --git a/slimbox2.css b/slimbox2.css new file mode 100644 index 0000000..9eed9bc --- /dev/null +++ b/slimbox2.css @@ -0,0 +1,83 @@ +/* SLIMBOX */ + +#lbOverlay { + position: fixed; + z-index: 9999; + left: 0; + top: 0; + width: 100%; + height: 100%; + background-color: #000; + cursor: pointer; +} + +#lbCenter, #lbBottomContainer { + position: absolute; + z-index: 9999; + overflow: hidden; + background-color: #fff; +} + +.lbLoading { + background: #fff url(loading.gif) no-repeat center; +} + +#lbImage { + position: absolute; + left: 0; + top: 0; + border: 10px solid #fff; + background-repeat: no-repeat; +} + +#lbPrevLink, #lbNextLink { + display: block; + position: absolute; + top: 0; + width: 50%; + outline: none; +} + +#lbPrevLink { + left: 0; +} + +#lbPrevLink:hover { + background: transparent url(prev.png) no-repeat 0 15%; +} + +#lbNextLink { + right: 0; +} + +#lbNextLink:hover { + background: transparent url(next.png) no-repeat 100% 15%; +} + +#lbBottom { + font-family: Verdana, Arial, Geneva, Helvetica, sans-serif; + font-size: 10px; + color: #666; + line-height: 1.4em; + text-align: left; + border: 10px solid #fff; + border-top-style: none; +} + +#lbCloseLink { + display: block; + float: right; + width: 66px; + height: 22px; + background: transparent url(closelabel.gif) no-repeat center; + margin: 5px 0; + outline: none; +} + +#lbCaption, #lbNumber { + margin-right: 71px; +} + +#lbCaption { + font-weight: bold; +} diff --git a/slimbox2.js b/slimbox2.js new file mode 100644 index 0000000..e3d51ba --- /dev/null +++ b/slimbox2.js @@ -0,0 +1,288 @@ +/* + Standalone (no jQuery) lightweight Lightbox implementation with minimal CSS3 animations + Based on and compatible with Slimbox2 + (c) 2012 Vitaliy Filippov + MIT-style license. +*/ + +window.addListener = (function() { + return window.addEventListener + ? function(el, type, fn) { el.addEventListener(type, fn, false); } + : function(el, type, fn) { el.attachEvent('on'+type, fn); }; +})(); + +window.removeListener = (function() { + return window.removeEventListener + ? function(el, type, fn) { el.removeEventListener(type, fn, false); } + : function(el, type, fn) { el.detachEvent('on'+type, fn); }; +})(); + +addListener(window, 'load', function() { + + // Global variables, accessible to Slimbox only + var options, images, activeImage = -1, activeURL, prevImage, nextImage, compatibleOverlay, middle, centerWidth, centerHeight, + ie6 = !window.XMLHttpRequest, hiddenElements = [], els = {}, css, keyActions, + // Preload images + preload = {}, preloadPrev = new Image(), preloadNext = new Image(); + + // Initialization + + // Append the Slimbox HTML code at the bottom of the document + var d = document.createElement('div'); + d.innerHTML = ''+ + '