Script phân trang hình ảnh từ Flickr kèm hiệu ứng Fancy

Phiên bản cải tiến từ sản phẩm Script phân trang hình ảnh từ tài khoản Flickr chọn trước của tác giả Riccardo.

Ở phiên bản này, khi click vào hình ảnh, popup hiệu ứng Fancybox sẽ hiện hình ra với kích thước lớn.


Script phân trang hình ảnh từ Flickr kèm hiệu ứng Fancy

<style type='text/css'>
/* jquery.myflickr base css */
table.myFlickr { margin: auto auto; }

div.flickrItem { border: none 1px #dedede; float:left; text-align:center; vertical-align:middle; line-height: 75px; position: relative; z-index: 1; }
div.flickrItem.highlighted { z-index: 2; }
div.flickrItem a img { border: none; position: relative; z-index: 3; }
div.flickrItem.highlighted a img { position: absolute; z-index: 1000; top: 0; left: 0; }

div.flickrItem img.loader { display: inline; top:-50%; }

div.photoInfos { background-color:#FDFDFD;
border:1px solid #ACACAC;
color: #000000;
overflow: hidden;
position:absolute;
width: 200px; /* statica? */
z-index: 999;
padding: 5px;
top: -5px;
line-height: 1.1em;
font-size: 0.65em; }

div.photoInfos.toRight { left: -5px; padding-left: 84px; }
div.photoInfos.toLeft { right: -5px; padding-right: 84px; }

div.photoInfos h1 { font-size: 1.3em !important; padding: 0px; margin: 0px; line-height: 1.35em !important; text-align: left; color: #666666; }
div.photoInfos #infoViews { float: left; font-weight: bold; font-size: 1.1em; }
div.photoInfos #infoDescription,
div.photoInfos #infoTags { font-size: 1em; text-align: justify; display: inline-block; }
div.photoInfos #infoLinkToOriginalFlickr { float: right; }

/* class for paginator div container */
.paginator div { text-align: center; display: table; margin: auto auto; }
.paginator div #pagesStatus { display: table-cell; width: 33%; }
.paginator div #pageNext { display: table-cell; width: 33%; padding-left: 10px; }
.paginator div #pagePrev { display: table-cell; width: 33%; padding-right: 10px; }
</style>

<style type='text/css'>
/*
* FancyBox - jQuery Plugin
* Simple and fancy lightbox alternative
*
* Examples and documentation at: http://fancybox.net
*
* Copyright (c) 2008 - 2010 Janis Skarnelis
*
* Version: 1.3.1 (05/03/2010)
* Requires: jQuery v1.3+
*
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*/

#fancybox-loading {
position: fixed;
top: 50%;
left: 50%;
height: 40px;
width: 40px;
margin-top: -20px;
margin-left: -20px;
cursor: pointer;
overflow: hidden;
z-index: 1104;
display: none;
}

* html #fancybox-loading { /* IE6 */
position: absolute;
margin-top: 0;
}

#fancybox-loading div {
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 480px;
background-image: url('http://ca0.upanh.com/15.998.20292767.3e30/fancybox.png');
}

#fancybox-overlay {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: #000;
z-index: 1100;
display: none;
}

* html #fancybox-overlay { /* IE6 */
position: absolute;
width: 100%;
}

#fancybox-tmp {
padding: 0;
margin: 0;
border: 0;
overflow: auto;
display: none;
}

#fancybox-wrap {
position: absolute;
top: 0;
left: 0;
margin: 0;
padding: 20px;
z-index: 1101;
display: none;
}

#fancybox-outer {
position: relative;
width: 100%;
height: 100%;
background: #FFF;
}

#fancybox-inner {
position: absolute;
top: 0;
left: 0;
width: 1px;
height: 1px;
padding: 0;
margin: 0;
outline: none;
overflow: hidden;
}

#fancybox-hide-sel-frame {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: transparent;
}

#fancybox-close {
position: absolute;
top: -15px;
right: -15px;
width: 30px;
height: 30px;
background-image: url('http://ca0.upanh.com/15.998.20292767.3e30/fancybox.png');
background-position: -40px 0px;
cursor: pointer;
z-index: 1103;
display: none;
}

#fancybox_error {
color: #444;
font: normal 12px/20px Arial;
padding: 7px;
margin: 0;
}

#fancybox-content {
height: auto;
width: auto;
padding: 0;
margin: 0;
}

#fancybox-img {
width: 100%;
height: 100%;
padding: 0;
margin: 0;
border: none;
outline: none;
line-height: 0;
vertical-align: top;
-ms-interpolation-mode: bicubic;
}

#fancybox-frame {
position: relative;
width: 100%;
height: 100%;
border: none;
display: block;
}

#fancybox-title {
position: absolute;
bottom: 0;
left: 0;
font-family: Arial;
font-size: 12px;
z-index: 1102;
}

.fancybox-title-inside {
padding: 10px 0;
text-align: center;
color: #333;
}

.fancybox-title-outside {
padding-top: 5px;
color: #FFF;
text-align: center;
font-weight: bold;
}

.fancybox-title-over {
color: #FFF;
text-align: left;
}

#fancybox-title-over {
padding: 10px;
background-image: url('http://ca0.upanh.com/15.998.20292755.wrj0/fancytitleover.png');
display: block;
}

#fancybox-title-wrap {
display: inline-block;
}

#fancybox-title-wrap span {
height: 32px;
float: left;
}

#fancybox-title-left {
padding-left: 15px;
background-image: url('http://ca0.upanh.com/15.998.20292767.3e30/fancybox.png');
background-position: -40px -90px;
background-repeat: no-repeat;
}

#fancybox-title-main {
font-weight: bold;
line-height: 29px;
background-image: url('http://ca0.upanh.com/15.998.20292769.tpO0/fancyboxx.png');
background-position: 0px -40px;
color: #FFF;
}

#fancybox-title-right {
padding-left: 15px;
background-image: url('http://ca0.upanh.com/15.998.20292767.3e30/fancybox.png');
background-position: -55px -90px;
background-repeat: no-repeat;
}

#fancybox-left, #fancybox-right {
position: absolute;
bottom: 0px;
height: 100%;
width: 35%;
cursor: pointer;
outline: none;
background-image: url('http://ca0.upanh.com/15.998.20292706.XiB0/blank.gif');
z-index: 1102;
display: none;
}

#fancybox-left {
left: 0px;
}

#fancybox-right {
right: 0px;
}

#fancybox-left-ico, #fancybox-right-ico {
position: absolute;
top: 50%;
left: -9999px;
width: 30px;
height: 30px;
margin-top: -15px;
cursor: pointer;
z-index: 1102;
display: block;
}

#fancybox-left-ico {
background-image: url('http://ca0.upanh.com/15.998.20292767.3e30/fancybox.png');
background-position: -40px -30px;
}

#fancybox-right-ico {
background-image: url('http://ca0.upanh.com/15.998.20292767.3e30/fancybox.png');
background-position: -40px -60px;
}

#fancybox-left:hover, #fancybox-right:hover {
visibility: visible; /* IE6 */
}

#fancybox-left:hover span {
left: 20px;
}

#fancybox-right:hover span {
left: auto;
right: 20px;
}

.fancy-bg {
position: absolute;
padding: 0;
margin: 0;
border: 0;
width: 20px;
height: 20px;
z-index: 1001;
}

#fancy-bg-n {
top: -20px;
left: 0;
width: 100%;
background-image: url('http://ca0.upanh.com/15.998.20292769.tpO0/fancyboxx.png');
}

#fancy-bg-ne {
top: -20px;
right: -20px;
background-image: url('http://ca0.upanh.com/15.998.20292767.3e30/fancybox.png');
background-position: -40px -162px;
}

#fancy-bg-e {
top: 0;
right: -20px;
height: 100%;
background-image: url('http://ca0.upanh.com/15.998.20292702.m7l0/fancyboxy.png');
background-position: -20px 0px;
}

#fancy-bg-se {
bottom: -20px;
right: -20px;
background-image: url('http://ca0.upanh.com/15.998.20292767.3e30/fancybox.png');
background-position: -40px -182px;
}

#fancy-bg-s {
bottom: -20px;
left: 0;
width: 100%;
background-image: url('http://ca0.upanh.com/15.998.20292769.tpO0/fancyboxx.png');
background-position: 0px -20px;
}

#fancy-bg-sw {
bottom: -20px;
left: -20px;
background-image: url('http://ca0.upanh.com/15.998.20292767.3e30/fancybox.png');
background-position: -40px -142px;
}

#fancy-bg-w {
top: 0;
left: -20px;
height: 100%;
background-image: url('http://ca0.upanh.com/15.998.20292702.m7l0/fancyboxy.png');
}

#fancy-bg-nw {
top: -20px;
left: -20px;
background-image: url('http://ca0.upanh.com/15.998.20292767.3e30/fancybox.png');
background-position: -40px -122px;
}

/* IE */

#fancybox-loading.fancybox-ie div { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292710.9Pj0/fancyloading.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-close { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292709.V3S0/fancyclose.png', sizingMethod='scale'); }

.fancybox-ie #fancybox-title-over { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292755.wrj0/fancytitleover.png', sizingMethod='scale'); zoom: 1; }
.fancybox-ie #fancybox-title-left { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292742.SrR0/fancytitleleft.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-title-main { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292744.HF0/fancytitlemain.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-title-right { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292757.QRo0/fancytitleright.png', sizingMethod='scale'); }

.fancybox-ie #fancybox-left-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292712.0MF0/fancynavleft.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-right-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292714.kF70/fancynavright.png', sizingMethod='scale'); }

.fancybox-ie .fancy-bg { background: transparent !important; }

.fancybox-ie #fancy-bg-n { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292728.rHW0/fancyshadown.png', sizingMethod='scale'); }
.fancybox-ie #fancy-bg-ne { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292731.enr0/fancyshadowne.png', sizingMethod='scale'); }
.fancybox-ie #fancy-bg-e { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292717.Rot0/fancyshadowe.png', sizingMethod='scale'); }
.fancybox-ie #fancy-bg-se { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292736.RGo0/fancyshadowse.png', sizingMethod='scale'); }
.fancybox-ie #fancy-bg-s { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292734.Mmg0/fancyshadows.png', sizingMethod='scale'); }
.fancybox-ie #fancy-bg-sw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292738.mte0/fancyshadowsw.png', sizingMethod='scale'); }
.fancybox-ie #fancy-bg-w { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292741.Z0X0/fancyshadoww.png', sizingMethod='scale'); }
.fancybox-ie #fancy-bg-nw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://ca0.upanh.com/15.998.20292733.XI50/fancyshadownw.png', sizingMethod='scale'); }
</style>

<script src="http://code.jquery.com/jquery-1.4.2.min.js" type="text/javascript"></script>

<script type='text/javascript'>
/*
* FancyBox - jQuery Plugin
* Simple and fancy lightbox alternative
*
* Examples and documentation at: http://fancybox.net
*
* Copyright (c) 2008 - 2010 Janis Skarnelis
*
* Version: 1.3.1 (05/03/2010)
* Requires: jQuery v1.3+
*
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
*/

(function(b){var m,u,x,g,D,i,z,A,B,p=0,e={},q=[],n=0,c={},j=[],E=null,s=new Image,G=/\.(jpg|gif|png|bmp|jpeg)(.*)?$/i,S=/[^\.]\.(swf)\s*$/i,H,I=1,k,l,h=false,y=b.extend(b("<div/>")[0],{prop:0}),v=0,O=!b.support.opacity&&!window.XMLHttpRequest,J=function(){u.hide();s.onerror=s.onload=null;E&&E.abort();m.empty()},P=function(){b.fancybox('<p id="fancybox_error">The requested content cannot be loaded.<br />Please try again later.</p>',{scrolling:"no",padding:20,transitionIn:"none",transitionOut:"none"})},
K=function(){return[b(window).width(),b(window).height(),b(document).scrollLeft(),b(document).scrollTop()]},T=function(){var a=K(),d={},f=c.margin,o=c.autoScale,t=(20+f)*2,w=(20+f)*2,r=c.padding*2;if(c.width.toString().indexOf("%")>-1){d.width=a[0]*parseFloat(c.width)/100-40;o=false}else d.width=c.width+r;if(c.height.toString().indexOf("%")>-1){d.height=a[1]*parseFloat(c.height)/100-40;o=false}else d.height=c.height+r;if(o&&(d.width>a[0]-t||d.height>a[1]-w))if(e.type=="image"||e.type=="swf"){t+=r;
w+=r;o=Math.min(Math.min(a[0]-t,c.width)/c.width,Math.min(a[1]-w,c.height)/c.height);d.width=Math.round(o*(d.width-r))+r;d.height=Math.round(o*(d.height-r))+r}else{d.width=Math.min(d.width,a[0]-t);d.height=Math.min(d.height,a[1]-w)}d.top=a[3]+(a[1]-(d.height+40))*0.5;d.left=a[2]+(a[0]-(d.width+40))*0.5;if(c.autoScale===false){d.top=Math.max(a[3]+f,d.top);d.left=Math.max(a[2]+f,d.left)}return d},U=function(a){if(a&&a.length)switch(c.titlePosition){case "inside":return a;case "over":return'<span id="fancybox-title-over">'+
a+"</span>";default:return'<span id="fancybox-title-wrap"><span id="fancybox-title-left"></span><span id="fancybox-title-main">'+a+'</span><span id="fancybox-title-right"></span></span>'}return false},V=function(){var a=c.title,d=l.width-c.padding*2,f="fancybox-title-"+c.titlePosition;b("#fancybox-title").remove();v=0;if(c.titleShow!==false){a=b.isFunction(c.titleFormat)?c.titleFormat(a,j,n,c):U(a);if(!(!a||a==="")){b('<div id="fancybox-title" class="'+f+'" />').css({width:d,paddingLeft:c.padding,
paddingRight:c.padding}).html(a).appendTo("body");switch(c.titlePosition){case "inside":v=b("#fancybox-title").outerHeight(true)-c.padding;l.height+=v;break;case "over":b("#fancybox-title").css("bottom",c.padding);break;default:b("#fancybox-title").css("bottom",b("#fancybox-title").outerHeight(true)*-1);break}b("#fancybox-title").appendTo(D).hide()}}},W=function(){b(document).unbind("keydown.fb").bind("keydown.fb",function(a){if(a.keyCode==27&&c.enableEscapeButton){a.preventDefault();b.fancybox.close()}else if(a.keyCode==
37){a.preventDefault();b.fancybox.prev()}else if(a.keyCode==39){a.preventDefault();b.fancybox.next()}});if(b.fn.mousewheel){g.unbind("mousewheel.fb");j.length>1&&g.bind("mousewheel.fb",function(a,d){a.preventDefault();h||d===0||(d>0?b.fancybox.prev():b.fancybox.next())})}if(c.showNavArrows){if(c.cyclic&&j.length>1||n!==0)A.show();if(c.cyclic&&j.length>1||n!=j.length-1)B.show()}},X=function(){var a,d;if(j.length-1>n){a=j[n+1].href;if(typeof a!=="undefined"&&a.match(G)){d=new Image;d.src=a}}if(n>0){a=
j[n-1].href;if(typeof a!=="undefined"&&a.match(G)){d=new Image;d.src=a}}},L=function(){i.css("overflow",c.scrolling=="auto"?c.type=="image"||c.type=="iframe"||c.type=="swf"?"hidden":"auto":c.scrolling=="yes"?"auto":"visible");if(!b.support.opacity){i.get(0).style.removeAttribute("filter");g.get(0).style.removeAttribute("filter")}b("#fancybox-title").show();c.hideOnContentClick&&i.one("click",b.fancybox.close);c.hideOnOverlayClick&&x.one("click",b.fancybox.close);c.showCloseButton&&z.show();W();b(window).bind("resize.fb",
b.fancybox.center);c.centerOnScroll?b(window).bind("scroll.fb",b.fancybox.center):b(window).unbind("scroll.fb");b.isFunction(c.onComplete)&&c.onComplete(j,n,c);h=false;X()},M=function(a){var d=Math.round(k.width+(l.width-k.width)*a),f=Math.round(k.height+(l.height-k.height)*a),o=Math.round(k.top+(l.top-k.top)*a),t=Math.round(k.left+(l.left-k.left)*a);g.css({width:d+"px",height:f+"px",top:o+"px",left:t+"px"});d=Math.max(d-c.padding*2,0);f=Math.max(f-(c.padding*2+v*a),0);i.css({width:d+"px",height:f+
"px"});if(typeof l.opacity!=="undefined")g.css("opacity",a<0.5?0.5:a)},Y=function(a){var d=a.offset();d.top+=parseFloat(a.css("paddingTop"))||0;d.left+=parseFloat(a.css("paddingLeft"))||0;d.top+=parseFloat(a.css("border-top-width"))||0;d.left+=parseFloat(a.css("border-left-width"))||0;d.width=a.width();d.height=a.height();return d},Q=function(){var a=e.orig?b(e.orig):false,d={};if(a&&a.length){a=Y(a);d={width:a.width+c.padding*2,height:a.height+c.padding*2,top:a.top-c.padding-20,left:a.left-c.padding-
20}}else{a=K();d={width:1,height:1,top:a[3]+a[1]*0.5,left:a[2]+a[0]*0.5}}return d},N=function(){u.hide();if(g.is(":visible")&&b.isFunction(c.onCleanup))if(c.onCleanup(j,n,c)===false){b.event.trigger("fancybox-cancel");h=false;return}j=q;n=p;c=e;i.get(0).scrollTop=0;i.get(0).scrollLeft=0;if(c.overlayShow){O&&b("select:not(#fancybox-tmp select)").filter(function(){return this.style.visibility!=="hidden"}).css({visibility:"hidden"}).one("fancybox-cleanup",function(){this.style.visibility="inherit"});
x.css({"background-color":c.overlayColor,opacity:c.overlayOpacity}).unbind().show()}l=T();V();if(g.is(":visible")){b(z.add(A).add(B)).hide();var a=g.position(),d;k={top:a.top,left:a.left,width:g.width(),height:g.height()};d=k.width==l.width&&k.height==l.height;i.fadeOut(c.changeFade,function(){var f=function(){i.html(m.contents()).fadeIn(c.changeFade,L)};b.event.trigger("fancybox-change");i.empty().css("overflow","hidden");if(d){i.css({top:c.padding,left:c.padding,width:Math.max(l.width-c.padding*
2,1),height:Math.max(l.height-c.padding*2-v,1)});f()}else{i.css({top:c.padding,left:c.padding,width:Math.max(k.width-c.padding*2,1),height:Math.max(k.height-c.padding*2,1)});y.prop=0;b(y).animate({prop:1},{duration:c.changeSpeed,easing:c.easingChange,step:M,complete:f})}})}else{g.css("opacity",1);if(c.transitionIn=="elastic"){k=Q();i.css({top:c.padding,left:c.padding,width:Math.max(k.width-c.padding*2,1),height:Math.max(k.height-c.padding*2,1)}).html(m.contents());g.css(k).show();if(c.opacity)l.opacity=
0;y.prop=0;b(y).animate({prop:1},{duration:c.speedIn,easing:c.easingIn,step:M,complete:L})}else{i.css({top:c.padding,left:c.padding,width:Math.max(l.width-c.padding*2,1),height:Math.max(l.height-c.padding*2-v,1)}).html(m.contents());g.css(l).fadeIn(c.transitionIn=="none"?0:c.speedIn,L)}}},F=function(){m.width(e.width);m.height(e.height);if(e.width=="auto")e.width=m.width();if(e.height=="auto")e.height=m.height();N()},Z=function(){h=true;e.width=s.width;e.height=s.height;b("<img />").attr({id:"fancybox-img",
src:s.src,alt:e.title}).appendTo(m);N()},C=function(){J();var a=q[p],d,f,o,t,w;e=b.extend({},b.fn.fancybox.defaults,typeof b(a).data("fancybox")=="undefined"?e:b(a).data("fancybox"));o=a.title||b(a).title||e.title||"";if(a.nodeName&&!e.orig)e.orig=b(a).children("img:first").length?b(a).children("img:first"):b(a);if(o===""&&e.orig)o=e.orig.attr("alt");d=a.nodeName&&/^(?:javascript|#)/i.test(a.href)?e.href||null:e.href||a.href||null;if(e.type){f=e.type;if(!d)d=e.content}else if(e.content)f="html";else if(d)if(d.match(G))f=
"image";else if(d.match(S))f="swf";else if(b(a).hasClass("iframe"))f="iframe";else if(d.match(/#/)){a=d.substr(d.indexOf("#"));f=b(a).length>0?"inline":"ajax"}else f="ajax";else f="inline";e.type=f;e.href=d;e.title=o;if(e.autoDimensions&&e.type!=="iframe"&&e.type!=="swf"){e.width="auto";e.height="auto"}if(e.modal){e.overlayShow=true;e.hideOnOverlayClick=false;e.hideOnContentClick=false;e.enableEscapeButton=false;e.showCloseButton=false}if(b.isFunction(e.onStart))if(e.onStart(q,p,e)===false){h=false;
return}m.css("padding",20+e.padding+e.margin);b(".fancybox-inline-tmp").unbind("fancybox-cancel").bind("fancybox-change",function(){b(this).replaceWith(i.children())});switch(f){case "html":m.html(e.content);F();break;case "inline":b('<div class="fancybox-inline-tmp" />').hide().insertBefore(b(a)).bind("fancybox-cleanup",function(){b(this).replaceWith(i.children())}).bind("fancybox-cancel",function(){b(this).replaceWith(m.children())});b(a).appendTo(m);F();break;case "image":h=false;b.fancybox.showActivity();
s=new Image;s.onerror=function(){P()};s.onload=function(){s.onerror=null;s.onload=null;Z()};s.src=d;break;case "swf":t='<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="'+e.width+'" height="'+e.height+'"><param name="movie" value="'+d+'"></param>';w="";b.each(e.swf,function(r,R){t+='<param name="'+r+'" value="'+R+'"></param>';w+=" "+r+'="'+R+'"'});t+='<embed src="'+d+'" type="application/x-shockwave-flash" width="'+e.width+'" height="'+e.height+'"'+w+"></embed></object>";m.html(t);
F();break;case "ajax":a=d.split("#",2);f=e.ajax.data||{};if(a.length>1){d=a[0];if(typeof f=="string")f+="&selector="+a[1];else f.selector=a[1]}h=false;b.fancybox.showActivity();E=b.ajax(b.extend(e.ajax,{url:d,data:f,error:P,success:function(r){if(E.status==200){m.html(r);F()}}}));break;case "iframe":b('<iframe id="fancybox-frame" name="fancybox-frame'+(new Date).getTime()+'" frameborder="0" hspace="0" scrolling="'+e.scrolling+'" src="'+e.href+'"></iframe>').appendTo(m);N();break}},$=function(){if(u.is(":visible")){b("div",
u).css("top",I*-40+"px");I=(I+1)%12}else clearInterval(H)},aa=function(){if(!b("#fancybox-wrap").length){b("body").append(m=b('<div id="fancybox-tmp"></div>'),u=b('<div id="fancybox-loading"><div></div></div>'),x=b('<div id="fancybox-overlay"></div>'),g=b('<div id="fancybox-wrap"></div>'));if(!b.support.opacity){g.addClass("fancybox-ie");u.addClass("fancybox-ie")}D=b('<div id="fancybox-outer"></div>').append('<div class="fancy-bg" id="fancy-bg-n"></div><div class="fancy-bg" id="fancy-bg-ne"></div><div class="fancy-bg" id="fancy-bg-e"></div><div class="fancy-bg" id="fancy-bg-se"></div><div class="fancy-bg" id="fancy-bg-s"></div><div class="fancy-bg" id="fancy-bg-sw"></div><div class="fancy-bg" id="fancy-bg-w"></div><div class="fancy-bg" id="fancy-bg-nw"></div>').appendTo(g);
D.append(i=b('<div id="fancybox-inner"></div>'),z=b('<a id="fancybox-close"></a>'),A=b('<a href="javascript:;" id="fancybox-left"><span class="fancy-ico" id="fancybox-left-ico"></span></a>'),B=b('<a href="javascript:;" id="fancybox-right"><span class="fancy-ico" id="fancybox-right-ico"></span></a>'));z.click(b.fancybox.close);u.click(b.fancybox.cancel);A.click(function(a){a.preventDefault();b.fancybox.prev()});B.click(function(a){a.preventDefault();b.fancybox.next()});if(O){x.get(0).style.setExpression("height",
"document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px'");u.get(0).style.setExpression("top","(-20 + (document.documentElement.clientHeight ? document.documentElement.clientHeight/2 : document.body.clientHeight/2 ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop )) + 'px'");D.prepend('<iframe id="fancybox-hide-sel-frame" src="javascript:\'\';" scrolling="no" frameborder="0" ></iframe>')}}};
b.fn.fancybox=function(a){b(this).data("fancybox",b.extend({},a,b.metadata?b(this).metadata():{})).unbind("click.fb").bind("click.fb",function(d){d.preventDefault();if(!h){h=true;b(this).blur();q=[];p=0;d=b(this).attr("rel")||"";if(!d||d==""||d==="nofollow")q.push(this);else{q=b("a[rel="+d+"], area[rel="+d+"]");p=q.index(this)}C();return false}});return this};b.fancybox=function(a,d){if(!h){h=true;d=typeof d!=="undefined"?d:{};q=[];p=d.index||0;if(b.isArray(a)){for(var f=0,o=a.length;f<o;f++)if(typeof a[f]==
"object")b(a[f]).data("fancybox",b.extend({},d,a[f]));else a[f]=b({}).data("fancybox",b.extend({content:a[f]},d));q=jQuery.merge(q,a)}else{if(typeof a=="object")b(a).data("fancybox",b.extend({},d,a));else a=b({}).data("fancybox",b.extend({content:a},d));q.push(a)}if(p>q.length||p<0)p=0;C()}};b.fancybox.showActivity=function(){clearInterval(H);u.show();H=setInterval($,66)};b.fancybox.hideActivity=function(){u.hide()};b.fancybox.next=function(){return b.fancybox.pos(n+1)};b.fancybox.prev=function(){return b.fancybox.pos(n-
1)};b.fancybox.pos=function(a){if(!h){a=parseInt(a,10);if(a>-1&&j.length>a){p=a;C()}if(c.cyclic&&j.length>1&&a<0){p=j.length-1;C()}if(c.cyclic&&j.length>1&&a>=j.length){p=0;C()}}};b.fancybox.cancel=function(){if(!h){h=true;b.event.trigger("fancybox-cancel");J();e&&b.isFunction(e.onCancel)&&e.onCancel(q,p,e);h=false}};b.fancybox.close=function(){function a(){x.fadeOut("fast");g.hide();b.event.trigger("fancybox-cleanup");i.empty();b.isFunction(c.onClosed)&&c.onClosed(j,n,c);j=e=[];n=p=0;c=e={};h=false}
if(!(h||g.is(":hidden"))){h=true;if(c&&b.isFunction(c.onCleanup))if(c.onCleanup(j,n,c)===false){h=false;return}J();b(z.add(A).add(B)).hide();b("#fancybox-title").remove();g.add(i).add(x).unbind();b(window).unbind("resize.fb scroll.fb");b(document).unbind("keydown.fb");i.css("overflow","hidden");if(c.transitionOut=="elastic"){k=Q();var d=g.position();l={top:d.top,left:d.left,width:g.width(),height:g.height()};if(c.opacity)l.opacity=1;y.prop=1;b(y).animate({prop:0},{duration:c.speedOut,easing:c.easingOut,
step:M,complete:a})}else g.fadeOut(c.transitionOut=="none"?0:c.speedOut,a)}};b.fancybox.resize=function(){var a,d;if(!(h||g.is(":hidden"))){h=true;a=i.wrapInner("<div style='overflow:auto'></div>").children();d=a.height();g.css({height:d+c.padding*2+v});i.css({height:d});a.replaceWith(a.children());b.fancybox.center()}};b.fancybox.center=function(){h=true;var a=K(),d=c.margin,f={};f.top=a[3]+(a[1]-(g.height()-v+40))*0.5;f.left=a[2]+(a[0]-(g.width()+40))*0.5;f.top=Math.max(a[3]+d,f.top);f.left=Math.max(a[2]+
d,f.left);g.css(f);h=false};b.fn.fancybox.defaults={padding:10,margin:20,opacity:false,modal:false,cyclic:false,scrolling:"auto",width:560,height:340,autoScale:true,autoDimensions:true,centerOnScroll:false,ajax:{},swf:{wmode:"transparent"},hideOnOverlayClick:true,hideOnContentClick:false,overlayShow:true,overlayOpacity:0.3,overlayColor:"#666",titleShow:true,titlePosition:"outside",titleFormat:null,transitionIn:"fade",transitionOut:"fade",speedIn:300,speedOut:300,changeSpeed:300,changeFade:"fast",
easingIn:"swing",easingOut:"swing",showCloseButton:true,showNavArrows:true,enableEscapeButton:true,onStart:null,onCancel:null,onComplete:null,onCleanup:null,onClosed:null};b(document).ready(function(){aa()})})(jQuery);
</script>

<script type="text/javascript"> ;eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('(4($){$.2.3=4(m){T G.1A(4(){r k=$(G);r l=$.1h({},$.2.3.1i,m);9(m&&m.y){l.y=$.1h({},$.2.3.1i.y,m.y)}9(m&&m.q){l.q=$.1h({},$.2.3.1i.q,m.q)}9(l.D!="")k.D=$("<13 />").1j({2b:l.D,"14":"D"});k.8={U:z,15:4(){9(k.8.p<k.8.K){k.8.p+=1;L(k,l)}},16:4(){9(k.8.p>1){k.8.p-=1;L(k,l)}},2c:4(t){k.8.K=t},2d:4(){9(l.y.1B){9(k.8.K>1){k.8.1k.2e()}k.8.1l.1C(k.8.p+"/"+k.8.K)}},1k:z,M:1,1l:z,K:z,p:l.y.2f};$.2.1h({15:k.8.15,16:k.8.16});L=4(d,e){$("A.B",d).w($.2.3.n.x.V,"").H("");r f=4(a,b,c){9(a.2g=="2h"){9(a.E.3b!="0"){9(a.E.p>a.E.K){b.8.p=a.E.K;L(b,c)}I{1D(b,a.E,17,c)}}}I{$.2.3.1E(a.2i,b,c)}};9(d.8.U[d.8.p]!=2j){9(d.D)$("A.B:3c("+d.8.U[d.8.p].18.19+")",d).H(d.D).u("&2k;");1D(d,d.8.U[d.8.p],1a,e)}I{9(d.D)$("A.B",d).H(d.D).u("&2k;");r g=z;2l(e.N){W $.2.3.n.o.X.1m:g={O:e.N,P:e.J,3d:e.1n,Q:"F",1o:d.8.M,p:d.8.p};Y;W $.2.3.n.o.E.1F:g={O:e.N,P:e.J,Q:"F",1o:d.8.M,p:d.8.p};Y;W $.2.3.n.o.1G.L:g={O:e.N,P:e.J,Q:"F",3e:e.2m,1o:d.8.M,p:d.8.p};Y;W $.2.3.n.o.1H.1I:g={O:e.N,P:e.J,Q:"F",1J:e.1J,1o:d.8.M,p:d.8.p};Y;W $.2.3.n.o.Z.1K:g={O:e.N,P:e.J,Q:"F",10:e.10,1L:e.1L};Y}$.1p({1b:$.2.3.n.o.1q,1M:"F",w:g,1N:4(a){f(a,d,e)}})}};1D=4(b,c,d,e){b.8.U[b.8.p]=c;b.8.2c(c.K);b.8.2d();$("A.B:3f("+(c.18.19-1)+")",b).w($.2.3.n.x.V,"").H("");$(c.18).1A(4(i){r a=$(G)[0];2n(a,$("A.B",b).3g(i),d,e,b)})};2o=4(a){a.1c($.2.3.n.R.11);$("13",a).2p().1r({1s:"1"},2q,4(){a.w($.2.3.n.x.1d,1a)})};1O=4(a){a.1P($.2.3.n.R.11);$("13",a).2p().1r({1s:"0.6"},2q,4(){a.w($.2.3.n.x.1d,17)})};2r=4(f,g,h){r i=$(".2s",h);$(".B.11",h).1A(4(){1O($(G))});r j=$("13",g);9(i.19==0){i=$("<A 14=\'2s\' />");i.2t()}i.3h("1Q").1R("1Q",4(e){9(g.3i("13")[0]!=e.3j){i.2t();1O(g)}}).2u({"3k-1S":j.1S()}).3l(g);9(($(3m).1e()-(g.3n().3o+i.3p()))<0){i.1P($.2.3.n.R.q.1t).1c($.2.3.n.R.q.1u)}I{i.1P($.2.3.n.R.q.1u).1c($.2.3.n.R.q.1t)}2o(g);i.2e();9(g.w($.2.3.n.x.1v+f.v)){1T(i)}I{i.H(l.q.2v);$.1p({1b:$.2.3.n.o.1q,1M:"F",w:{O:$.2.3.n.o.E.1U,P:l.J,3q:f.v,Q:"F"},1N:4(a){g.w($.2.3.n.x.1v+f.v,a.18);1T(i)}})}1T=4(a){r b=$(".B.11",h);9(b.19!=0){r c=3r(b.w($.2.3.n.x.1v+b.1j("v")));9(l.q.1V!=""){r d=l.q.1V.C(/\\{\\{3s\\}\\}/,c.1f.12).C(/\\{\\{3t\\}\\}/,c.2w).C(/\\{\\{3u\\}\\}/,c.2x.1b[0].12).C(/\\{\\{3v\\}\\}/,l.q.1W).C(/\\{\\{3w\\}\\}/,c.2y.12).C(/\\{\\{3x\\}\\}/,1X(c.Z.10));a.H(d)}I{a.H("<2z>"+c.1f.12+"</2z><S v=\'3y\'>3z: "+c.2w+"</S><a v=\'3A\' 1w=\'"+c.2x.1b[0].12+"\' 2A=\'2B\'>"+l.q.1W+"</a><1x />"+(l.q.2C?"<1x /><1y v=\'3B\'>"+c.2y.12+"</1y><1x />":"")+((l.q.2D&&c.Z.10.19>0)?"<1x /><1y v=\'3C\'><b>3D: </b>"+1X(c.Z.10)+"</1y>":""))}}}};1X=4(a){r b=1Y 2E();2F(2G 3E a){b.3F(a[2G].3G)}T b.3H(", ")};2n=4(b,c,d,e,f){r g=1Y 3I();g.2b=$.2.3.1Z(e.20,b);r h=$("<a />").1j({1w:$.2.3.1Z("",b,d),2A:"2B",3J:"3K"}).1R("3L",4(){r a=$(G);9(!c.w($.2.3.n.x.1d)){a.w($.2.3.n.x.1z,2H(4(){2r(b,c,f)},e.q.2I))}}).1R("1Q",4(){3M($(G).w($.2.3.n.x.1z))});c.w($.2.3.n.x.V,h).1j("v",b.v);9((21 g.2J!="2j")&&(g.2J)){22($(g),c,h,e,f)}I{$(g).3N(4(){22($(G),c,h,e,f)})}};22=4(a,b,c,d,e){9(b.w($.2.3.n.x.V)==c){b.H(c.u(a));9(21 d.23==="4"){d.23.3O(a)}9((21 d.24)==="4"){r f=$("A.B > a",e);f.2K=d.24;f.2K()}}};2L=4(d,e){2M=4(a,b,c){9(b.y.1B){c.8.1l=$("<S v=\'3P\' />");c.8.1k=$("<3Q />").u($("<1g />").u($("<25 v=\'3R\' 14=\'"+b.y.2N+"\' />").u($("<A />").u($("<a v=\'16\' 1w=\'#\' />").u(b.y.2O.2P()).2Q(4(){c.8.16();T 17})).u(c.8.1l).u($("<a v=\'15\' 1w=\'#\' />").u(b.y.2R.2P()).2Q(4(){c.8.15();T 17})))));a.u(c.8.1k)}};d.8.M=e.26*e.2S;r f=$("<3S 3T=\'0\' 3U=\'0\' />").1c(e.2T);9(e.1f!=""){f.u($("<2U><1g><2V v=\'3V\' 14=\'3W\'>"+e.1f+"</2V></1g></2U>"))}f.u($("<2W><1g><25><A v=\'27\' /></25></1g></2W>"));2M(f,e,d);d.u(f);2F(i=0;i<d.8.M;i++){$("#27",f).u($.2.3.2X(e));9(((i+1)%e.26)==0){$("#27",f).u($("<A 3X=\'3Y:3Z\' />"))}}};28=4(a,b){2L(a,b);a.8.U=1Y 2E();L(a,b)};9(l.J!=z){9(l.1n==z){$.2.3.2Y(l,k,28)}I{2H(4(){28(k,l)},0)}}})};$.2.3.2Y=4(b,c,d){$.1p({1b:$.2.3.n.o.1q,1M:"F",w:{O:$.2.3.n.o.X.29,P:b.J,2a:b.2a,Q:"F"},1N:4(a){9(a.2g=="2h"){b.1n=a.40.41;d(c,b)}I{$.2.3.1E(a.2i,c,b)}}})};$.2.3.1Z=4(a,b,c){T $.2.3.n.2Z.C(/\\[30\\]/,a==""?"":"31"+a).C(/\\[32\\]/,b.33).C(/\\[34\\]/,b.42).C(/\\[35\\]/,b.v).C(/\\[36\\]/,b.43)};$.2.3.2X=4(a){r b,1e;2l(a.20){W"s":b=1e="44";Y}T $("<A 14=\'B\' />").2u({1S:b,1e:1e})};$.2.3.1E=4(a,b,c){9(!c.37)b.1c(c.38).H(a)};$.2.3.n={R:{11:"11",q:{1u:"1u",1t:"1t"}},x:{1v:"w.18",B:"B",1d:"1d",1z:"1z",V:"V"},o:{1q:"39://45.o.3a/46/47/?48=?",1G:{L:"o.1G.L"},X:{29:"o.X.29",1m:"o.X.1m"},E:{1U:"o.E.1U",1F:"o.E.1F"},1H:{1I:"o.1H.1I"},Z:{1K:"o.Z.1K"}},2Z:"39://33[32].49.o.3a/[34]/[35]31[36][30].4a"};$.2.3.1i={J:z,2T:"4b",38:"4c",1L:"",1J:"",2a:z,1n:z,2m:z,20:"s",D:"4d/1p-D.4e",24:z,23:4(){$(G).1r({1s:"1"},4f,4(){$(G).1r({1s:"0.7"},4g)})},26:5,2S:5,y:{1B:1a,2N:"y",2R:$("<S />").1C("4h"),2O:$("<S />").1C("4i"),2f:1},q:{2I:4j,1W:"4k 4l&4m;",2v:"<S>4n...</S>",2C:1a,2D:1a,1V:""},N:$.2.3.n.o.X.1m,37:17,10:"",1f:""}})(4o);',62,273,'||fn|myflickr|function||||pagination|if||||||||||||||constants|flickr|page|photoInfo|var|||append|id|data|datas|paginator|null|div|flickrItem|replace|loader|photos|json|this|html|else|apiKey|pages|getPhotos|itemPerPage|serviceMethod|method|api_key|format|cssClasses|span|return|cache|waitingFor|case|people|break|tags|tag|highlighted|_content|img|class|pageNext|pagePrev|false|photo|length|true|url|addClass|hover|width|title|tr|extend|defaults|attr|itemPaginator|itemStatus|getPublicPhotos|userId|per_page|ajax|service|animate|opacity|toRight|toLeft|data_photo|href|br|small|hoverTimeout|each|enabled|text|callbackGetPhoto|manageErrors|getRecent|galleries|interestingness|getList|date|getClusterPhotos|cluster_id|dataType|success|revertFlickrItem|removeClass|mouseleave|bind|height|buildInfos|getInfo|template|linkToOriginalText|stringifyPhotoTags|new|getMiniatureUrl|miniatureSuffix|typeof|manageMiniature|functionMiniatureLoaded|functionHighlighter|td|cols|flickrContainer|init|findByUsername|username|src|setTotalPages|updateStatus|show|pageToOpen|stat|ok|message|undefined|nbsp|switch|galleryId|buildMiniature|highlightFlickrItem|stop|200|showPhotoInfos|photoInfos|hide|css|loadingMessage|views|urls|description|h1|target|_blank|showDescription|showTags|Array|for|itag|setTimeout|delayForAjaxCall|complete|highlighter|buildGrid|buildPaginator|cssClass|itemPrev|clone|click|itemNext|rows|cssMain|thead|th|tbody|buildGridItem|retrieveUserNSID|miniatureUrlPattern|MINIATURESUFFIX|_|FARM|farm|SERVER|PHOTOID|SECRET|silentErrors|cssClassServiceError|http|com|total|lt|user_id|gallery_id|gt|eq|unbind|find|relatedTarget|min|appendTo|window|offset|left|innerWidth|photo_id|eval|PHOTO_TITLE|PHOTO_VIEWS|PHOTO_ORIGINAL_URL|PHOTO_ORIGINAL_URL_TEXT|PHOTO_DESCRIPTION|PHOTO_TAGS|infoViews|Views|infoLinkToOriginalFlickr|infoDescription|infoTags|Tags|in|push|raw|join|Image|rel|miniatureLink|mouseenter|clearTimeout|load|apply|pagesStatus|tfoot|tdPaginator|table|cellpadding|cellspacing|tdTitle|albumTitle|style|clear|both|user|nsid|server|secret|75px|api|services|rest|jsoncallback|static|jpg|myFlickr|serviceError|images|gif|300|500|Tới|Lùi|210|view|original|raquo|Loading|jQuery'.split('|'),0,{})); </script>

<script type="text/javascript">
$(function() { $("#idGallery").myflickr({ apiKey: "685f89b75efe5c17eac8e4ecb90ff4f2", galleryId: "39745022-72157624738659138",
serviceMethod: $.fn.myflickr.constants.flickr.galleries.getPhotos,
loader: "http://ca6.upanh.com/15.996.20290700.QN60/ajaxloader.gif",
functionHighlighter: function() { return $(this).fancybox(); },
rows: 2, paginator: { enabled: true } });});
</script>

<div id="idGallery"></div>


Theo : code1k.com

Không có nhận xét nào

Một số lưu ý khi bình luận

Bấm Thông báo cho tôi bên dưới khung bình luận để nhận thông báo khi admin trả lời.

Để bình luận một đoạn code, hãy mã hóa code trước nhé!

» Cảm ơn bạn đã ghé thăm websitemika.com
» Nếu có thắc mắc hay góp ý, bạn hãy để lại một góp ý !
» Vui lòng đăng những góp ý lịch sự và gõ tiếng Việt có dấu nếu có thể
HƯỚNG DẪN ĐĂNG THÔNG TIN GÓP Ý :
Bước 1 – Gõ nội dung bạn cần góp ý tới chúng tôi.
Bước 2 - Xử lý mục " Nhận xét với tư cách "
Cách 1 : - Chọn Tên/URL: Gõ tên và địa chỉ blog bạn vào.Nếu không có tài khoản, bạn vẫn có thể nhận xét bằng cách Chọn hồ sơ là Tên/URL hay Ẩn danh. Tuy nhiên bạn nên chọn Tên/URL với URL có thể để trống để cho chúng tôi biết bạn là ai. Bạn vui lòng gõ tiếng Việt có dấu để mọi người không hiểu nhầm so thành sờ, mo thành mò.
Cách 2 : - Chọn Ẩn danh.
Bước 3 - Xem trước: Tuỳ, Bạn là người cẩn thận cần xem lại nội dung Bạn đã gõ (rất cần nếu Bạn có nhập mã, để xem nó hiển thị có đúng không).
Bước 4 - Nên nháy chuột vào nội dung, bấm phím Ctrol + A rồi Ctrol + C nhằm copy nội dung - Đề phòng lỡ hệ thống đăng góp ý trục trặt hoặc mạng rớt, ta có thể Ctrol + V dán đăng lại góp ý để khỏi tốn thời gian!
Bước 5 – Lick vào Button : Đăng nhận xét . Vậy là xong,góp ý của các bạn sẽ được Admin kiểm duyệt và cho đăng trong vòng 12h.Cảm ơn các bạn đã góp ý !

GIỚI THIỆU ĐẾN QUÝ KHÁCH MỘT SỐ DỰ ÁN SẼ THỰC HIỆN TRONG NĂM 2018


DANH MỤC BÀI ĐĂNG - KHÁCH MUỐN XEM NỘI DUNG GÌ LICK VÀO TIÊU ĐỀ ẤY


WEBSITEMIKA - THƯƠNG HIỆU UY TÍN BỞI HƠN 300 DOANH NGHIỆP VÀ CÁC THƯƠNG HIỆU VỪA VÀ NHỎ LỰA CHỌN
Điểm giao dịch: Online 24h
-Email: Setup247@gmail.com - Website: https://thietkeweb.mikalaza.com