From 8b13765b44a5c3f67fa5e33ee6fe788ff0937df8 Mon Sep 17 00:00:00 2001 From: root Date: Mon, 15 May 2017 08:08:00 +0200 Subject: [PATCH] New option for src of image. e.g data attribute #70 --- README.md | 4 +- bower.json | 2 +- dist/simple-lightbox.js | 17 +- dist/simple-lightbox.min.js | 2 +- dist/simplelightbox.css | 56 +++-- dist/simplelightbox.min.css | 2 +- dist/simplelightbox.scss | 465 ++++++++++++++++++------------------ package.json | 2 +- 8 files changed, 285 insertions(+), 265 deletions(-) diff --git a/README.md b/README.md index 56b9bb5..1bdc18b 100644 --- a/README.md +++ b/README.md @@ -34,6 +34,7 @@ var lightbox = $('.gallery a').simpleLightbox(options); ### JavaScript Options | Property | Default | Type | Description | | -------- | ------- | ---- | ----------- | +| sourceAttr | href | string | the attribute used for large images | | overlay | true | bool | show an overlay or not | | spinner | true | bool | show spinner or not | | nav | true | bool | show arrow-navigation or not | @@ -151,6 +152,7 @@ $sl-iframe-border-large: 0 none; ### Changelog +**1.11.0 - New option for src of image. e.g data attribute #70** **1.10.7 - Added Bootstrap compatibility #69** **1.10.6 - Merged pull requests #65. Thanks to mstaniuk** **1.10.5 - Merged pull requests #60 and #61. Thanks to slavanga** @@ -189,7 +191,7 @@ $sl-iframe-border-large: 0 none; **1.0.0 - Initial Release** ### Author -[Andre Rinas](http://andreknieriem.de/) - [Github](https://github.com/andreknieriem/) +[Andre Rinas](http://andrerinas.de/) - [Github](https://github.com/andreknieriem/) ### Contributors [nicekiwi](https://github.com/nicekiwi) diff --git a/bower.json b/bower.json index e231a4b..6a01551 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "simplelightbox", - "version": "1.10.7", + "version": "1.11.0", "homepage": "http://andreknieriem.de/simple-lightbox", "authors": [ "André Rinas (http://andreknieriem.de)" diff --git a/dist/simple-lightbox.js b/dist/simple-lightbox.js index 5761b9a..621f2fe 100644 --- a/dist/simple-lightbox.js +++ b/dist/simple-lightbox.js @@ -12,6 +12,7 @@ $.fn.simpleLightbox = function( options ) { var options = $.extend({ + sourceAttr: 'href', overlay: true, spinner: true, nav: true, @@ -137,7 +138,7 @@ $.fn.simpleLightbox = function( options ) wrapper = $('
').addClass('sl-wrapper').addClass(options.className), isValidLink = function( element ){ if(!options.fileExt) return true; - return $( element ).prop( 'tagName' ).toLowerCase() == 'a' && ( new RegExp( '\.(' + options.fileExt + ')$', 'i' ) ).test( $( element ).attr( 'href' ) ); + return $( element ).prop( 'tagName' ).toLowerCase() == 'a' && ( new RegExp( '\.(' + options.fileExt + ')$', 'i' ) ).test( $( element ).attr( options.sourceAttr ) ); }, setup = function(){ if(options.close) closeBtn.appendTo(wrapper); @@ -160,9 +161,9 @@ $.fn.simpleLightbox = function( options ) index = objects.index(elem); curImg = $( '' ) .hide() - .attr('src', elem.attr('href')); - if(loaded.indexOf(elem.attr('href')) == -1){ - loaded.push(elem.attr('href')); + .attr('src', elem.attr(options.sourceAttr)); + if(loaded.indexOf(elem.attr(options.sourceAttr)) == -1){ + loaded.push(elem.attr(options.sourceAttr)); } image.html('').attr('style',''); curImg.appendTo(image); @@ -387,13 +388,13 @@ $.fn.simpleLightbox = function( options ) preload = function(){ var next = (index+1 < 0) ? objects.length -1: (index+1 >= objects.length -1) ? 0 : index+1, prev = (index-1 < 0) ? objects.length -1: (index-1 >= objects.length -1) ? 0 : index-1; - $( '' ).attr( 'src', objects.eq(next).attr( 'href' ) ).on('load', function(){ + $( '' ).attr( 'src', objects.eq(next).attr( options.sourceAttr ) ).on('load', function(){ if(loaded.indexOf($(this).attr('src')) == -1){ loaded.push($(this).attr('src')); } objects.eq(index).trigger($.Event('nextImageLoaded.simplelightbox')); }); - $( '' ).attr( 'src', objects.eq(prev).attr( 'href' ) ).on('load', function(){ + $( '' ).attr( 'src', objects.eq(prev).attr( options.sourceAttr ) ).on('load', function(){ if(loaded.indexOf($(this).attr('src')) == -1){ loaded.push($(this).attr('src')); } @@ -421,8 +422,8 @@ $.fn.simpleLightbox = function( options ) // fadeout old image var elem = objects.eq(index); curImg - .attr('src', elem.attr('href')); - if(loaded.indexOf(elem.attr('href')) == -1){ + .attr('src', elem.attr(options.sourceAttr)); + if(loaded.indexOf(elem.attr(options.sourceAttr)) == -1){ spinner.show(); } $('.sl-caption').remove(); diff --git a/dist/simple-lightbox.min.js b/dist/simple-lightbox.min.js index ba4f7bd..838bf9a 100644 --- a/dist/simple-lightbox.min.js +++ b/dist/simple-lightbox.min.js @@ -2,4 +2,4 @@ By André Rinas, www.andreknieriem.de Available for use under the MIT License */ -!function(a,b,c,d){"use strict";a.fn.simpleLightbox=function(d){var t,d=a.extend({overlay:!0,spinner:!0,nav:!0,navText:["‹","›"],captions:!0,captionDelay:0,captionSelector:"img",captionType:"attr",captionsData:"title",captionPosition:"bottom",close:!0,closeText:"×",swipeClose:!0,showCounter:!0,fileExt:"png|jpg|jpeg|gif",animationSlide:!0,animationSpeed:250,preloading:!0,enableKeyboard:!0,loop:!0,rel:!1,docClose:!0,swipeTolerance:50,className:"simple-lightbox",widthRatio:.8,heightRatio:.9,disableRightClick:!1,disableScroll:!0,alertError:!0,alertErrorMessage:"Image not found, next image will be loaded",additionalHtml:!1,history:!0},d),h=(b.navigator.pointerEnabled||b.navigator.msPointerEnabled,0),i=0,j=a(),k=function(){var a=c.body||c.documentElement;return a=a.style,""===a.WebkitTransition?"-webkit-":""===a.MozTransition?"-moz-":""===a.OTransition?"-o-":""===a.transition&&""},l=!1,m=[],n=function(b,c){var d=a(c.selector).filter(function(){return a(this).attr("rel")===b});return d},o=d.rel&&d.rel!==!1?n(d.rel,this):this,k=k(),p=0,q=k!==!1,r="pushState"in history,s=!1,u=b.location,v=function(){return u.hash.substring(1)},w=v(),x=function(){var b=(v(),"pid="+(H+1)),d=u.href.split("#")[0]+"#"+b;r?history[s?"replaceState":"pushState"]("",c.title,d):s?u.replace(d):u.hash=b,s=!0},y=function(){r?history.pushState("",c.title,u.pathname+u.search):u.hash="",clearTimeout(t)},z=function(){s?t=setTimeout(x,800):x()},A="simplelb",B=a("
").addClass("sl-overlay"),C=a(""),F=a("
").addClass("sl-counter").html('/'),G=!1,H=0,I=a("
").addClass("sl-caption pos-"+d.captionPosition),J=a("
").addClass("sl-image"),K=a("
").addClass("sl-wrapper").addClass(d.className),L=function(b){return!d.fileExt||"a"==a(b).prop("tagName").toLowerCase()&&new RegExp(".("+d.fileExt+")$","i").test(a(b).attr("href"))},M=function(){d.close&&C.appendTo(K),d.showCounter&&o.length>1&&(F.appendTo(K),F.find(".sl-total").text(o.length)),d.nav&&E.appendTo(K),d.spinner&&D.appendTo(K)},N=function(b){b.trigger(a.Event("show.simplelightbox")),d.disableScroll&&(p=W("hide")),K.appendTo("body"),J.appendTo(K),d.overlay&&B.appendTo(a("body")),G=!0,H=o.index(b),j=a("").hide().attr("src",b.attr("href")),m.indexOf(b.attr("href"))==-1&&m.push(b.attr("href")),J.html("").attr("style",""),j.appendTo(J),R(),B.fadeIn("fast"),a(".sl-close").fadeIn("fast"),D.show(),E.fadeIn("fast"),a(".sl-wrapper .sl-counter .sl-current").text(H+1),F.fadeIn("fast"),O(),d.preloading&&T(),setTimeout(function(){b.trigger(a.Event("shown.simplelightbox"))},d.animationSpeed)},O=function(c){if(j.length){var e=new Image,f=a(b).width()*d.widthRatio,g=a(b).height()*d.heightRatio;e.src=j.attr("src"),a(e).bind("error",function(b){o.eq(H).trigger(a.Event("error.simplelightbox")),G=!1,l=!0,D.hide(),d.alertError&&alert(d.alertErrorMessage),U(1==c||c==-1?c:1)}),e.onload=function(){"undefined"!=typeof c&&o.eq(H).trigger(a.Event("changed.simplelightbox")).trigger(a.Event((1===c?"nextDone":"prevDone")+".simplelightbox")),d.history&&z(),m.indexOf(j.attr("src"))==-1&&m.push(j.attr("src"));var h=e.width,i=e.height;if(h>f||i>g){var k=h/i>f/g?h/f:i/g;h/=k,i/=k}a(".sl-image").css({top:(a(b).height()-i)/2+"px",left:(a(b).width()-h-p)/2+"px"}),D.hide(),j.css({width:h+"px",height:i+"px"}).fadeIn("fast"),l=!0;var r,n="self"==d.captionSelector?o.eq(H):o.eq(H).find(d.captionSelector);if(r="data"==d.captionType?n.data(d.captionsData):"text"==d.captionType?n.html():n.prop(d.captionsData),d.loop||(0===H&&a(".sl-prev").hide(),H>=o.length-1&&a(".sl-next").hide(),H>0&&a(".sl-prev").show(),H").html(d.additionalHtml).addClass("sl-additional-html").appendTo(a(".sl-image"))}}},P=function(b){""!==b&&"undefined"!=typeof b&&d.captions&&I.html(b).hide().appendTo(a(".sl-image")).delay(d.captionDelay).fadeIn("fast")},Q=function(b,c){var d={};d[k+"transform"]="translateX("+c+")",d[k+"transition"]=k+"transform "+b+"s linear",a(".sl-image").css(d)},R=function(){a(b).on("resize."+A,O),a(c).on("click."+A+" touchstart."+A,".sl-close",function(a){a.preventDefault(),l&&V()}),d.history&&setTimeout(function(){a(b).on("hashchange."+A,function(){if(l&&v()===w)return void V()})},40),E.on("click."+A,"button",function(b){b.preventDefault(),h=0,U(a(this).hasClass("sl-next")?1:-1)});var e=0,f=0,g=0,j=0,k=!1,m=0;J.on("touchstart."+A+" mousedown."+A,function(a){return!!k||(q&&(m=parseInt(J.css("left"))),k=!0,e=a.originalEvent.pageX||a.originalEvent.touches[0].pageX,g=a.originalEvent.pageY||a.originalEvent.touches[0].pageY,!1)}).on("touchmove."+A+" mousemove."+A+" pointermove MSPointerMove",function(a){return!k||(a.preventDefault(),f=a.originalEvent.pageX||a.originalEvent.touches[0].pageX,j=a.originalEvent.pageY||a.originalEvent.touches[0].pageY,h=e-f,i=g-j,void(d.animationSlide&&(q?Q(0,-h+"px"):J.css("left",m-h+"px"))))}).on("touchend."+A+" mouseup."+A+" touchcancel."+A+" mouseleave."+A+" pointerup pointercancel MSPointerUp MSPointerCancel",function(a){if(k){k=!1;var b=!0;d.loop||(0===H&&h<0&&(b=!1),H>=o.length-1&&h>0&&(b=!1)),Math.abs(h)>d.swipeTolerance&&b?U(h>0?1:-1):d.animationSlide&&(q?Q(d.animationSpeed/1e3,"0px"):J.animate({left:m+"px"},d.animationSpeed/2)),d.swipeClose&&Math.abs(i)>50&&Math.abs(h)=o.length-1?0:H+1,c=H-1<0?o.length-1:H-1>=o.length-1?0:H-1;a("").attr("src",o.eq(b).attr("href")).on("load",function(){m.indexOf(a(this).attr("src"))==-1&&m.push(a(this).attr("src")),o.eq(H).trigger(a.Event("nextImageLoaded.simplelightbox"))}),a("").attr("src",o.eq(c).attr("href")).on("load",function(){m.indexOf(a(this).attr("src"))==-1&&m.push(a(this).attr("src")),o.eq(H).trigger(a.Event("prevImageLoaded.simplelightbox"))})},U=function(b){o.eq(H).trigger(a.Event("change.simplelightbox")).trigger(a.Event((1===b?"next":"prev")+".simplelightbox"));var c=H+b;if(!(G||(c<0||c>=o.length)&&d.loop===!1)){H=c<0?o.length-1:c>o.length-1?0:c,a(".sl-wrapper .sl-counter .sl-current").text(H+1);var e={opacity:0};d.animationSlide&&(q?Q(d.animationSpeed/1e3,-100*b-h+"px"):e.left=parseInt(a(".sl-image").css("left"))+-100*b+"px"),a(".sl-image").animate(e,d.animationSpeed,function(){setTimeout(function(){var c=o.eq(H);j.attr("src",c.attr("href")),m.indexOf(c.attr("href"))==-1&&D.show(),a(".sl-caption").remove(),O(b),d.preloading&&T()},100)})}},V=function(){if(!G){var b=o.eq(H),c=!1;b.trigger(a.Event("close.simplelightbox")),d.history&&y(),a(".sl-image img, .sl-overlay, .sl-close, .sl-navigation, .sl-image .sl-caption, .sl-counter").fadeOut("fast",function(){d.disableScroll&&W("show"),a(".sl-wrapper, .sl-overlay").remove(),S(),c||b.trigger(a.Event("closed.simplelightbox")),c=!0}),j=a(),l=!1,G=!1}},W=function(d){var e=0;if("hide"==d){var f=b.innerWidth;if(!f){var g=c.documentElement.getBoundingClientRect();f=g.right-Math.abs(g.left)}if(c.body.clientWidth0&&a("body").addClass("hidden-scroll").css({"padding-right":i+e})}}else a("body").removeClass("hidden-scroll").css({"padding-right":a("body").data("padding")});return e};return M(),o.on("click."+A,function(b){if(L(this)){if(b.preventDefault(),G)return!1;N(a(this))}}),a(c).on("click."+A+" touchstart."+A,function(b){l&&d.docClose&&0===a(b.target).closest(".sl-image").length&&0===a(b.target).closest(".sl-navigation").length&&V()}),d.disableRightClick&&a(c).on("contextmenu",".sl-image img",function(a){return!1}),d.enableKeyboard&&a(c).on("keyup."+A,function(a){if(h=0,l){a.preventDefault();var b=a.keyCode;27==b&&V(),37!=b&&39!=a.keyCode||U(39==a.keyCode?1:-1)}}),this.open=function(b){b=b||a(this[0]),N(b)},this.next=function(){U(1)},this.prev=function(){U(-1)},this.close=function(){V()},this.destroy=function(){a(c).unbind("click."+A).unbind("keyup."+A),V(),a(".sl-overlay, .sl-wrapper").remove(),this.off("click")},this.refresh=function(){this.destroy(),a(this.selector).simpleLightbox(d)},this}}(jQuery,window,document); +!function(a,b,c,d){"use strict";a.fn.simpleLightbox=function(d){var t,d=a.extend({sourceAttr:"href",overlay:!0,spinner:!0,nav:!0,navText:["‹","›"],captions:!0,captionDelay:0,captionSelector:"img",captionType:"attr",captionsData:"title",captionPosition:"bottom",close:!0,closeText:"×",swipeClose:!0,showCounter:!0,fileExt:"png|jpg|jpeg|gif",animationSlide:!0,animationSpeed:250,preloading:!0,enableKeyboard:!0,loop:!0,rel:!1,docClose:!0,swipeTolerance:50,className:"simple-lightbox",widthRatio:.8,heightRatio:.9,disableRightClick:!1,disableScroll:!0,alertError:!0,alertErrorMessage:"Image not found, next image will be loaded",additionalHtml:!1,history:!0},d),h=(b.navigator.pointerEnabled||b.navigator.msPointerEnabled,0),i=0,j=a(),k=function(){var a=c.body||c.documentElement;return a=a.style,""===a.WebkitTransition?"-webkit-":""===a.MozTransition?"-moz-":""===a.OTransition?"-o-":""===a.transition&&""},l=!1,m=[],n=function(b,c){return a(c.selector).filter(function(){return a(this).attr("rel")===b})},o=d.rel&&!1!==d.rel?n(d.rel,this):this,k=k(),p=0,q=!1!==k,r="pushState"in history,s=!1,u=b.location,v=function(){return u.hash.substring(1)},w=v(),x=function(){var b=(v(),"pid="+(H+1)),d=u.href.split("#")[0]+"#"+b;r?history[s?"replaceState":"pushState"]("",c.title,d):s?u.replace(d):u.hash=b,s=!0},y=function(){r?history.pushState("",c.title,u.pathname+u.search):u.hash="",clearTimeout(t)},z=function(){s?t=setTimeout(x,800):x()},A="simplelb",B=a("
").addClass("sl-overlay"),C=a(""),F=a("
").addClass("sl-counter").html('/'),G=!1,H=0,I=a("
").addClass("sl-caption pos-"+d.captionPosition),J=a("
").addClass("sl-image"),K=a("
").addClass("sl-wrapper").addClass(d.className),L=function(b){return!d.fileExt||"a"==a(b).prop("tagName").toLowerCase()&&new RegExp(".("+d.fileExt+")$","i").test(a(b).attr(d.sourceAttr))},M=function(){d.close&&C.appendTo(K),d.showCounter&&o.length>1&&(F.appendTo(K),F.find(".sl-total").text(o.length)),d.nav&&E.appendTo(K),d.spinner&&D.appendTo(K)},N=function(b){b.trigger(a.Event("show.simplelightbox")),d.disableScroll&&(p=W("hide")),K.appendTo("body"),J.appendTo(K),d.overlay&&B.appendTo(a("body")),G=!0,H=o.index(b),j=a("").hide().attr("src",b.attr(d.sourceAttr)),-1==m.indexOf(b.attr(d.sourceAttr))&&m.push(b.attr(d.sourceAttr)),J.html("").attr("style",""),j.appendTo(J),R(),B.fadeIn("fast"),a(".sl-close").fadeIn("fast"),D.show(),E.fadeIn("fast"),a(".sl-wrapper .sl-counter .sl-current").text(H+1),F.fadeIn("fast"),O(),d.preloading&&T(),setTimeout(function(){b.trigger(a.Event("shown.simplelightbox"))},d.animationSpeed)},O=function(c){if(j.length){var e=new Image,f=a(b).width()*d.widthRatio,g=a(b).height()*d.heightRatio;e.src=j.attr("src"),a(e).bind("error",function(b){o.eq(H).trigger(a.Event("error.simplelightbox")),G=!1,l=!0,D.hide(),d.alertError&&alert(d.alertErrorMessage),U(1==c||-1==c?c:1)}),e.onload=function(){void 0!==c&&o.eq(H).trigger(a.Event("changed.simplelightbox")).trigger(a.Event((1===c?"nextDone":"prevDone")+".simplelightbox")),d.history&&z(),-1==m.indexOf(j.attr("src"))&&m.push(j.attr("src"));var h=e.width,i=e.height;if(h>f||i>g){var k=h/i>f/g?h/f:i/g;h/=k,i/=k}a(".sl-image").css({top:(a(b).height()-i)/2+"px",left:(a(b).width()-h-p)/2+"px"}),D.hide(),j.css({width:h+"px",height:i+"px"}).fadeIn("fast"),l=!0;var r,n="self"==d.captionSelector?o.eq(H):o.eq(H).find(d.captionSelector);if(r="data"==d.captionType?n.data(d.captionsData):"text"==d.captionType?n.html():n.prop(d.captionsData),d.loop||(0===H&&a(".sl-prev").hide(),H>=o.length-1&&a(".sl-next").hide(),H>0&&a(".sl-prev").show(),H").html(d.additionalHtml).addClass("sl-additional-html").appendTo(a(".sl-image"))}}},P=function(b){""!==b&&void 0!==b&&d.captions&&I.html(b).hide().appendTo(a(".sl-image")).delay(d.captionDelay).fadeIn("fast")},Q=function(b,c){var d={};d[k+"transform"]="translateX("+c+")",d[k+"transition"]=k+"transform "+b+"s linear",a(".sl-image").css(d)},R=function(){a(b).on("resize."+A,O),a(c).on("click."+A+" touchstart."+A,".sl-close",function(a){a.preventDefault(),l&&V()}),d.history&&setTimeout(function(){a(b).on("hashchange."+A,function(){if(l&&v()===w)return void V()})},40),E.on("click."+A,"button",function(b){b.preventDefault(),h=0,U(a(this).hasClass("sl-next")?1:-1)});var e=0,f=0,g=0,j=0,k=!1,m=0;J.on("touchstart."+A+" mousedown."+A,function(a){return!!k||(q&&(m=parseInt(J.css("left"))),k=!0,e=a.originalEvent.pageX||a.originalEvent.touches[0].pageX,g=a.originalEvent.pageY||a.originalEvent.touches[0].pageY,!1)}).on("touchmove."+A+" mousemove."+A+" pointermove MSPointerMove",function(a){if(!k)return!0;a.preventDefault(),f=a.originalEvent.pageX||a.originalEvent.touches[0].pageX,j=a.originalEvent.pageY||a.originalEvent.touches[0].pageY,h=e-f,i=g-j,d.animationSlide&&(q?Q(0,-h+"px"):J.css("left",m-h+"px"))}).on("touchend."+A+" mouseup."+A+" touchcancel."+A+" mouseleave."+A+" pointerup pointercancel MSPointerUp MSPointerCancel",function(a){if(k){k=!1;var b=!0;d.loop||(0===H&&h<0&&(b=!1),H>=o.length-1&&h>0&&(b=!1)),Math.abs(h)>d.swipeTolerance&&b?U(h>0?1:-1):d.animationSlide&&(q?Q(d.animationSpeed/1e3,"0px"):J.animate({left:m+"px"},d.animationSpeed/2)),d.swipeClose&&Math.abs(i)>50&&Math.abs(h)=o.length-1?0:H+1,c=H-1<0?o.length-1:H-1>=o.length-1?0:H-1;a("").attr("src",o.eq(b).attr(d.sourceAttr)).on("load",function(){-1==m.indexOf(a(this).attr("src"))&&m.push(a(this).attr("src")),o.eq(H).trigger(a.Event("nextImageLoaded.simplelightbox"))}),a("").attr("src",o.eq(c).attr(d.sourceAttr)).on("load",function(){-1==m.indexOf(a(this).attr("src"))&&m.push(a(this).attr("src")),o.eq(H).trigger(a.Event("prevImageLoaded.simplelightbox"))})},U=function(b){o.eq(H).trigger(a.Event("change.simplelightbox")).trigger(a.Event((1===b?"next":"prev")+".simplelightbox"));var c=H+b;if(!(G||(c<0||c>=o.length)&&!1===d.loop)){H=c<0?o.length-1:c>o.length-1?0:c,a(".sl-wrapper .sl-counter .sl-current").text(H+1);var e={opacity:0};d.animationSlide&&(q?Q(d.animationSpeed/1e3,-100*b-h+"px"):e.left=parseInt(a(".sl-image").css("left"))+-100*b+"px"),a(".sl-image").animate(e,d.animationSpeed,function(){setTimeout(function(){var c=o.eq(H);j.attr("src",c.attr(d.sourceAttr)),-1==m.indexOf(c.attr(d.sourceAttr))&&D.show(),a(".sl-caption").remove(),O(b),d.preloading&&T()},100)})}},V=function(){if(!G){var b=o.eq(H),c=!1;b.trigger(a.Event("close.simplelightbox")),d.history&&y(),a(".sl-image img, .sl-overlay, .sl-close, .sl-navigation, .sl-image .sl-caption, .sl-counter").fadeOut("fast",function(){d.disableScroll&&W("show"),a(".sl-wrapper, .sl-overlay").remove(),S(),c||b.trigger(a.Event("closed.simplelightbox")),c=!0}),j=a(),l=!1,G=!1}},W=function(d){var e=0;if("hide"==d){var f=b.innerWidth;if(!f){var g=c.documentElement.getBoundingClientRect();f=g.right-Math.abs(g.left)}if(c.body.clientWidth0&&a("body").addClass("hidden-scroll").css({"padding-right":i+e})}}else a("body").removeClass("hidden-scroll").css({"padding-right":a("body").data("padding")});return e};return M(),o.on("click."+A,function(b){if(L(this)){if(b.preventDefault(),G)return!1;N(a(this))}}),a(c).on("click."+A+" touchstart."+A,function(b){l&&d.docClose&&0===a(b.target).closest(".sl-image").length&&0===a(b.target).closest(".sl-navigation").length&&V()}),d.disableRightClick&&a(c).on("contextmenu",".sl-image img",function(a){return!1}),d.enableKeyboard&&a(c).on("keyup."+A,function(a){if(h=0,l){a.preventDefault();var b=a.keyCode;27==b&&V(),37!=b&&39!=a.keyCode||U(39==a.keyCode?1:-1)}}),this.open=function(b){b=b||a(this[0]),N(b)},this.next=function(){U(1)},this.prev=function(){U(-1)},this.close=function(){V()},this.destroy=function(){a(c).unbind("click."+A).unbind("keyup."+A),V(),a(".sl-overlay, .sl-wrapper").remove(),this.off("click")},this.refresh=function(){this.destroy(),a(this.selector).simpleLightbox(d)},this}}(jQuery,window,document); diff --git a/dist/simplelightbox.css b/dist/simplelightbox.css index 10042b1..17d1ec5 100644 --- a/dist/simplelightbox.css +++ b/dist/simplelightbox.css @@ -48,7 +48,11 @@ body.hidden-scroll { color: #000; font-size: 3rem; } -/* line 70, ../sass/simplelightbox.scss */ +/* line 69, ../sass/simplelightbox.scss */ +.sl-wrapper .sl-close:focus { + outline: none; +} +/* line 74, ../sass/simplelightbox.scss */ .sl-wrapper .sl-counter { display: none; position: fixed; @@ -58,12 +62,12 @@ body.hidden-scroll { color: #000; font-size: 1rem; } -/* line 80, ../sass/simplelightbox.scss */ +/* line 84, ../sass/simplelightbox.scss */ .sl-wrapper .sl-navigation { width: 100%; display: none; } -/* line 83, ../sass/simplelightbox.scss */ +/* line 87, ../sass/simplelightbox.scss */ .sl-wrapper .sl-navigation button { position: fixed; top: 50%; @@ -77,56 +81,60 @@ body.hidden-scroll { font-family: Arial, Baskerville, monospace; color: #000; } -/* line 95, ../sass/simplelightbox.scss */ +/* line 99, ../sass/simplelightbox.scss */ .sl-wrapper .sl-navigation button.sl-next { right: 5px; font-size: 2rem; } -/* line 100, ../sass/simplelightbox.scss */ +/* line 104, ../sass/simplelightbox.scss */ .sl-wrapper .sl-navigation button.sl-prev { left: 5px; font-size: 2rem; } +/* line 109, ../sass/simplelightbox.scss */ +.sl-wrapper .sl-navigation button:focus { + outline: none; +} @media (min-width: 35.5em) { - /* line 83, ../sass/simplelightbox.scss */ + /* line 87, ../sass/simplelightbox.scss */ .sl-wrapper .sl-navigation button { width: 44px; } - /* line 107, ../sass/simplelightbox.scss */ + /* line 116, ../sass/simplelightbox.scss */ .sl-wrapper .sl-navigation button.sl-next { right: 10px; font-size: 3rem; } - /* line 112, ../sass/simplelightbox.scss */ + /* line 121, ../sass/simplelightbox.scss */ .sl-wrapper .sl-navigation button.sl-prev { left: 10px; font-size: 3rem; } } @media (min-width: 50em) { - /* line 83, ../sass/simplelightbox.scss */ + /* line 87, ../sass/simplelightbox.scss */ .sl-wrapper .sl-navigation button { width: 44px; } - /* line 120, ../sass/simplelightbox.scss */ + /* line 129, ../sass/simplelightbox.scss */ .sl-wrapper .sl-navigation button.sl-next { right: 20px; font-size: 3rem; } - /* line 125, ../sass/simplelightbox.scss */ + /* line 134, ../sass/simplelightbox.scss */ .sl-wrapper .sl-navigation button.sl-prev { left: 20px; font-size: 3rem; } } -/* line 133, ../sass/simplelightbox.scss */ +/* line 142, ../sass/simplelightbox.scss */ .sl-wrapper .sl-image { position: fixed; -ms-touch-action: none; touch-action: none; z-index: 10000; } -/* line 138, ../sass/simplelightbox.scss */ +/* line 147, ../sass/simplelightbox.scss */ .sl-wrapper .sl-image img { margin: 0; padding: 0; @@ -134,35 +142,35 @@ body.hidden-scroll { border: 0 none; } @media (min-width: 35.5em) { - /* line 138, ../sass/simplelightbox.scss */ + /* line 147, ../sass/simplelightbox.scss */ .sl-wrapper .sl-image img { border: 0 none; } } @media (min-width: 50em) { - /* line 138, ../sass/simplelightbox.scss */ + /* line 147, ../sass/simplelightbox.scss */ .sl-wrapper .sl-image img { border: 0 none; } } -/* line 151, ../sass/simplelightbox.scss */ +/* line 160, ../sass/simplelightbox.scss */ .sl-wrapper .sl-image iframe { background: #000; border: 0 none; } @media (min-width: 35.5em) { - /* line 151, ../sass/simplelightbox.scss */ + /* line 160, ../sass/simplelightbox.scss */ .sl-wrapper .sl-image iframe { border: 0 none; } } @media (min-width: 50em) { - /* line 151, ../sass/simplelightbox.scss */ + /* line 160, ../sass/simplelightbox.scss */ .sl-wrapper .sl-image iframe { border: 0 none; } } -/* line 161, ../sass/simplelightbox.scss */ +/* line 170, ../sass/simplelightbox.scss */ .sl-wrapper .sl-image .sl-caption { display: none; padding: 10px; @@ -173,16 +181,16 @@ body.hidden-scroll { left: 0; right: 0; } -/* line 171, ../sass/simplelightbox.scss */ +/* line 180, ../sass/simplelightbox.scss */ .sl-wrapper .sl-image .sl-caption.pos-top { bottom: auto; top: 0; } -/* line 176, ../sass/simplelightbox.scss */ +/* line 185, ../sass/simplelightbox.scss */ .sl-wrapper .sl-image .sl-caption.pos-outside { bottom: auto; } -/* line 181, ../sass/simplelightbox.scss */ +/* line 190, ../sass/simplelightbox.scss */ .sl-wrapper .sl-image .sl-download { display: none; position: absolute; @@ -192,7 +200,7 @@ body.hidden-scroll { z-index: 1060; } -/* line 192, ../sass/simplelightbox.scss */ +/* line 201, ../sass/simplelightbox.scss */ .sl-spinner { display: none; border: 5px solid #333; @@ -212,7 +220,7 @@ body.hidden-scroll { animation: pulsate 1s ease-out infinite; } -/* line 211, ../sass/simplelightbox.scss */ +/* line 220, ../sass/simplelightbox.scss */ .sl-scrollbar-measure { position: absolute; top: -9999px; diff --git a/dist/simplelightbox.min.css b/dist/simplelightbox.min.css index 3f9d3b0..f890104 100644 --- a/dist/simplelightbox.min.css +++ b/dist/simplelightbox.min.css @@ -1 +1 @@ -.sl-wrapper .sl-close,.sl-wrapper .sl-navigation button{height:44px;line-height:44px;font-family:Arial,Baskerville,monospace}body.hidden-scroll{overflow:hidden}.sl-overlay{position:fixed;left:0;right:0;top:0;bottom:0;background:#fff;opacity:.7;display:none;z-index:1050}.sl-wrapper .sl-close,.sl-wrapper .sl-counter{top:30px;display:none;color:#000;position:fixed}.sl-wrapper{z-index:1040}.sl-wrapper button{border:0;background:0 0;font-size:28px;padding:0;cursor:pointer}.sl-wrapper button:hover{opacity:.7}.sl-wrapper .sl-close{right:30px;z-index:1060;margin-top:-14px;margin-right:-14px;width:44px;font-size:3rem}.sl-wrapper .sl-counter{left:30px;z-index:1060;font-size:1rem}.sl-wrapper .sl-navigation{width:100%;display:none}.sl-wrapper .sl-navigation button{position:fixed;top:50%;margin-top:-22px;width:22px;text-align:center;display:block;z-index:1060;color:#000}.sl-wrapper .sl-navigation button.sl-next{right:5px;font-size:2rem}.sl-wrapper .sl-navigation button.sl-prev{left:5px;font-size:2rem}.sl-wrapper .sl-image{position:fixed;-ms-touch-action:none;touch-action:none;z-index:10000}.sl-wrapper .sl-image img{margin:0;padding:0;display:block;border:0}.sl-wrapper .sl-image iframe{background:#000;border:0}@media (min-width:35.5em){.sl-wrapper .sl-navigation button{width:44px}.sl-wrapper .sl-navigation button.sl-next{right:10px;font-size:3rem}.sl-wrapper .sl-navigation button.sl-prev{left:10px;font-size:3rem}.sl-wrapper .sl-image iframe,.sl-wrapper .sl-image img{border:0}}@media (min-width:50em){.sl-wrapper .sl-navigation button{width:44px}.sl-wrapper .sl-navigation button.sl-next{right:20px;font-size:3rem}.sl-wrapper .sl-navigation button.sl-prev{left:20px;font-size:3rem}.sl-wrapper .sl-image iframe,.sl-wrapper .sl-image img{border:0}}.sl-wrapper .sl-image .sl-caption{display:none;padding:10px;color:#fff;background:rgba(0,0,0,.8);position:absolute;bottom:0;left:0;right:0}.sl-wrapper .sl-image .sl-caption.pos-top{bottom:auto;top:0}.sl-wrapper .sl-image .sl-caption.pos-outside{bottom:auto}.sl-wrapper .sl-image .sl-download{display:none;position:absolute;bottom:5px;right:5px;color:#000;z-index:1060}.sl-spinner{display:none;border:5px solid #333;border-radius:40px;height:40px;left:50%;margin:-20px 0 0 -20px;opacity:0;position:fixed;top:50%;width:40px;z-index:1007;-webkit-animation:pulsate 1s ease-out infinite;-moz-animation:pulsate 1s ease-out infinite;-ms-animation:pulsate 1s ease-out infinite;-o-animation:pulsate 1s ease-out infinite;animation:pulsate 1s ease-out infinite}.sl-scrollbar-measure{position:absolute;top:-9999px;width:50px;height:50px;overflow:scroll}@-webkit-keyframes pulsate{0%{transform:scale(.1);opacity:0}50%{opacity:1}100%{transform:scale(1.2);opacity:0}}@keyframes pulsate{0%{transform:scale(.1);opacity:0}50%{opacity:1}100%{transform:scale(1.2);opacity:0}}@-moz-keyframes pulsate{0%{transform:scale(.1);opacity:0}50%{opacity:1}100%{transform:scale(1.2);opacity:0}}@-o-keyframes pulsate{0%{transform:scale(.1);opacity:0}50%{opacity:1}100%{transform:scale(1.2);opacity:0}}@-ms-keyframes pulsate{0%,100%{opacity:0}0%{transform:scale(.1)}50%{opacity:1}100%{transform:scale(1.2)}} +.sl-wrapper .sl-close,.sl-wrapper .sl-navigation button{height:44px;line-height:44px;font-family:Arial,Baskerville,monospace}.sl-wrapper .sl-close:focus,.sl-wrapper .sl-navigation button:focus{outline:0}body.hidden-scroll{overflow:hidden}.sl-overlay{position:fixed;left:0;right:0;top:0;bottom:0;background:#fff;opacity:.7;display:none;z-index:1050}.sl-wrapper .sl-close,.sl-wrapper .sl-counter{top:30px;display:none;color:#000;position:fixed}.sl-wrapper{z-index:1040}.sl-wrapper button{border:0;background:0 0;font-size:28px;padding:0;cursor:pointer}.sl-wrapper button:hover{opacity:.7}.sl-wrapper .sl-close{right:30px;z-index:1060;margin-top:-14px;margin-right:-14px;width:44px;font-size:3rem}.sl-wrapper .sl-counter{left:30px;z-index:1060;font-size:1rem}.sl-wrapper .sl-navigation{width:100%;display:none}.sl-wrapper .sl-navigation button{position:fixed;top:50%;margin-top:-22px;width:22px;text-align:center;display:block;z-index:1060;color:#000}.sl-wrapper .sl-navigation button.sl-next{right:5px;font-size:2rem}.sl-wrapper .sl-navigation button.sl-prev{left:5px;font-size:2rem}.sl-wrapper .sl-image{position:fixed;-ms-touch-action:none;touch-action:none;z-index:10000}.sl-wrapper .sl-image img{margin:0;padding:0;display:block;border:0}.sl-wrapper .sl-image iframe{background:#000;border:0}@media (min-width:35.5em){.sl-wrapper .sl-navigation button{width:44px}.sl-wrapper .sl-navigation button.sl-next{right:10px;font-size:3rem}.sl-wrapper .sl-navigation button.sl-prev{left:10px;font-size:3rem}.sl-wrapper .sl-image iframe,.sl-wrapper .sl-image img{border:0}}@media (min-width:50em){.sl-wrapper .sl-navigation button{width:44px}.sl-wrapper .sl-navigation button.sl-next{right:20px;font-size:3rem}.sl-wrapper .sl-navigation button.sl-prev{left:20px;font-size:3rem}.sl-wrapper .sl-image iframe,.sl-wrapper .sl-image img{border:0}}.sl-wrapper .sl-image .sl-caption{display:none;padding:10px;color:#fff;background:rgba(0,0,0,.8);position:absolute;bottom:0;left:0;right:0}.sl-wrapper .sl-image .sl-caption.pos-top{bottom:auto;top:0}.sl-wrapper .sl-image .sl-caption.pos-outside{bottom:auto}.sl-wrapper .sl-image .sl-download{display:none;position:absolute;bottom:5px;right:5px;color:#000;z-index:1060}.sl-spinner{display:none;border:5px solid #333;border-radius:40px;height:40px;left:50%;margin:-20px 0 0 -20px;opacity:0;position:fixed;top:50%;width:40px;z-index:1007;-webkit-animation:pulsate 1s ease-out infinite;-moz-animation:pulsate 1s ease-out infinite;-ms-animation:pulsate 1s ease-out infinite;-o-animation:pulsate 1s ease-out infinite;animation:pulsate 1s ease-out infinite}.sl-scrollbar-measure{position:absolute;top:-9999px;width:50px;height:50px;overflow:scroll}@-webkit-keyframes pulsate{0%{transform:scale(.1);opacity:0}50%{opacity:1}100%{transform:scale(1.2);opacity:0}}@keyframes pulsate{0%{transform:scale(.1);opacity:0}50%{opacity:1}100%{transform:scale(1.2);opacity:0}}@-moz-keyframes pulsate{0%{transform:scale(.1);opacity:0}50%{opacity:1}100%{transform:scale(1.2);opacity:0}}@-o-keyframes pulsate{0%{transform:scale(.1);opacity:0}50%{opacity:1}100%{transform:scale(1.2);opacity:0}}@-ms-keyframes pulsate{0%,100%{opacity:0}0%{transform:scale(.1)}50%{opacity:1}100%{transform:scale(1.2)}} diff --git a/dist/simplelightbox.scss b/dist/simplelightbox.scss index cbc7f73..bac205c 100644 --- a/dist/simplelightbox.scss +++ b/dist/simplelightbox.scss @@ -10,277 +10,286 @@ $sl-counter-fontsize: 1rem !default; $sl-close-fontsize: 3rem !default; $sl-breakpoint-medium: 35.5em !default; // 568px, when 1em == 16px -$sl-breakpoint-large: 50em !default; // 800px, when 1em == 16px +$sl-breakpoint-large: 50em !default; // 800px, when 1em == 16px -$sl-arrow-fontsize-small: 2rem !default; +$sl-arrow-fontsize-small: 2rem !default; $sl-arrow-fontsize-medium: 3rem !default; -$sl-arrow-fontsize-large: 3rem !default; -$sl-img-border-small: 0 none !default; +$sl-arrow-fontsize-large: 3rem !default; +$sl-img-border-small: 0 none !default; $sl-img-border-medium: 0 none !default; -$sl-img-border-large: 0 none !default; -$sl-iframe-border-small: 0 none !default; +$sl-img-border-large: 0 none !default; +$sl-iframe-border-small: 0 none !default; $sl-iframe-border-medium: 0 none !default; -$sl-iframe-border-large: 0 none !default; +$sl-iframe-border-large: 0 none !default; body.hidden-scroll { - overflow: hidden; + overflow: hidden; } .sl-overlay { - position: fixed; - left: 0; - right: 0; - top: 0; - bottom: 0; - background: $sl-overlay-background; - opacity: 0.7; - display: none; - z-index: 1050; + position: fixed; + left: 0; + right: 0; + top: 0; + bottom: 0; + background: $sl-overlay-background; + opacity: 0.7; + display: none; + z-index: 1050; } .sl-wrapper { - z-index: 1040; - button { - border: 0 none; - background: transparent; - font-size: 28px; - padding: 0; - cursor: pointer; - &:hover { - opacity: 0.7; - } - } + z-index: 1040; + button { + border: 0 none; + background: transparent; + font-size: 28px; + padding: 0; + cursor: pointer; + &:hover { + opacity: 0.7; + } + } - .sl-close { - display: none; - position: fixed; - right: 30px; - top: 30px; - z-index: 1060; - margin-top: -14px; - margin-right: -14px; - height: 44px; - width: 44px; - line-height: 44px; - font-family: $sl-font-family; - color: $sl-navigation-color; - font-size: $sl-close-fontsize; - } + .sl-close { + display: none; + position: fixed; + right: 30px; + top: 30px; + z-index: 1060; + margin-top: -14px; + margin-right: -14px; + height: 44px; + width: 44px; + line-height: 44px; + font-family: $sl-font-family; + color: $sl-navigation-color; + font-size: $sl-close-fontsize; - .sl-counter { - display: none; - position: fixed; - top: 30px; - left: 30px; - z-index: 1060; - color: $sl-navigation-color; - font-size: $sl-counter-fontsize; - } + &:focus { + outline: none; + } + } - .sl-navigation { - width: 100%; - display: none; - button { - position: fixed; - top: 50%; - margin-top: -22px; - height: 44px; - width: 22px; - line-height: 44px; - text-align: center; - display: block; - z-index: 1060; - font-family: $sl-font-family; - color: $sl-navigation-color; - &.sl-next { - right: 5px; - font-size: $sl-arrow-fontsize-small; - } + .sl-counter { + display: none; + position: fixed; + top: 30px; + left: 30px; + z-index: 1060; + color: $sl-navigation-color; + font-size: $sl-counter-fontsize; + } - &.sl-prev { - left: 5px; - font-size: $sl-arrow-fontsize-small; - } - @media (min-width: $sl-breakpoint-medium) { - width: 44px; + .sl-navigation { + width: 100%; + display: none; + button { + position: fixed; + top: 50%; + margin-top: -22px; + height: 44px; + width: 22px; + line-height: 44px; + text-align: center; + display: block; + z-index: 1060; + font-family: $sl-font-family; + color: $sl-navigation-color; + &.sl-next { + right: 5px; + font-size: $sl-arrow-fontsize-small; + } - &.sl-next { - right: 10px; - font-size: $sl-arrow-fontsize-medium; - } + &.sl-prev { + left: 5px; + font-size: $sl-arrow-fontsize-small; + } - &.sl-prev { - left: 10px; - font-size: $sl-arrow-fontsize-medium; - } - } - @media (min-width: $sl-breakpoint-large) { - width: 44px; + &:focus { + outline: none; + } - &.sl-next { - right: 20px; - font-size: $sl-arrow-fontsize-large; - } + @media (min-width: $sl-breakpoint-medium) { + width: 44px; - &.sl-prev { - left: 20px; - font-size: $sl-arrow-fontsize-large; - } - } - } - } + &.sl-next { + right: 10px; + font-size: $sl-arrow-fontsize-medium; + } - .sl-image { - position: fixed; - -ms-touch-action: none; - touch-action: none; - z-index: 10000; - img { - margin: 0; - padding: 0; - display: block; - border: $sl-img-border-small; - @media (min-width: $sl-breakpoint-medium) { - border: $sl-img-border-medium; - } - @media (min-width: $sl-breakpoint-large) { - border: $sl-img-border-large; - } + &.sl-prev { + left: 10px; + font-size: $sl-arrow-fontsize-medium; + } + } + @media (min-width: $sl-breakpoint-large) { + width: 44px; - } - iframe { - background: #000; - border: $sl-iframe-border-small; - @media (min-width: $sl-breakpoint-medium) { - border: $sl-iframe-border-medium; - } - @media (min-width: $sl-breakpoint-large) { - border: $sl-iframe-border-large; - } - } - .sl-caption { - display: none; - padding: 10px; - color: $sl-caption-color; - background: $sl-caption-background; - position: absolute; - bottom: 0; - left: 0; - right: 0; + &.sl-next { + right: 20px; + font-size: $sl-arrow-fontsize-large; + } - &.pos-top { - bottom: auto; - top: 0; - } + &.sl-prev { + left: 20px; + font-size: $sl-arrow-fontsize-large; + } + } + } + } - &.pos-outside { - bottom: auto; - } - } + .sl-image { + position: fixed; + -ms-touch-action: none; + touch-action: none; + z-index: 10000; + img { + margin: 0; + padding: 0; + display: block; + border: $sl-img-border-small; + @media (min-width: $sl-breakpoint-medium) { + border: $sl-img-border-medium; + } + @media (min-width: $sl-breakpoint-large) { + border: $sl-img-border-large; + } - .sl-download { - display: none; - position: absolute; - bottom: 5px; - right: 5px; - color: $sl-navigation-color; - z-index: 1060; - } - } + } + iframe { + background: #000; + border: $sl-iframe-border-small; + @media (min-width: $sl-breakpoint-medium) { + border: $sl-iframe-border-medium; + } + @media (min-width: $sl-breakpoint-large) { + border: $sl-iframe-border-large; + } + } + .sl-caption { + display: none; + padding: 10px; + color: $sl-caption-color; + background: $sl-caption-background; + position: absolute; + bottom: 0; + left: 0; + right: 0; + + &.pos-top { + bottom: auto; + top: 0; + } + + &.pos-outside { + bottom: auto; + } + } + + .sl-download { + display: none; + position: absolute; + bottom: 5px; + right: 5px; + color: $sl-navigation-color; + z-index: 1060; + } + } } .sl-spinner { - display: none; - border: 5px solid #333; - border-radius: 40px; - height: 40px; - left: 50%; - margin: -20px 0 0 -20px; - opacity: 0; - position: fixed; - top: 50%; - width: 40px; - z-index: 1007; - -webkit-animation: pulsate 1s ease-out infinite; - -moz-animation: pulsate 1s ease-out infinite; - -ms-animation: pulsate 1s ease-out infinite; - -o-animation: pulsate 1s ease-out infinite; - animation: pulsate 1s ease-out infinite; + display: none; + border: 5px solid #333; + border-radius: 40px; + height: 40px; + left: 50%; + margin: -20px 0 0 -20px; + opacity: 0; + position: fixed; + top: 50%; + width: 40px; + z-index: 1007; + -webkit-animation: pulsate 1s ease-out infinite; + -moz-animation: pulsate 1s ease-out infinite; + -ms-animation: pulsate 1s ease-out infinite; + -o-animation: pulsate 1s ease-out infinite; + animation: pulsate 1s ease-out infinite; } .sl-scrollbar-measure { - position: absolute; - top: -9999px; - width: 50px; - height: 50px; - overflow: scroll; + position: absolute; + top: -9999px; + width: 50px; + height: 50px; + overflow: scroll; } @-webkit-keyframes pulsate{ - 0% { - transform: scale(.1); - opacity: 0.0; - } - 50% { - opacity: 1; - } - 100% { - transform: scale(1.2); - opacity: 0; - } + 0% { + transform: scale(.1); + opacity: 0.0; + } + 50% { + opacity: 1; + } + 100% { + transform: scale(1.2); + opacity: 0; + } } @keyframes pulsate { - 0% { - transform: scale(.1); - opacity: 0.0; - } - 50% { - opacity: 1; - } - 100% { - transform: scale(1.2); - opacity: 0; - } + 0% { + transform: scale(.1); + opacity: 0.0; + } + 50% { + opacity: 1; + } + 100% { + transform: scale(1.2); + opacity: 0; + } } @-moz-keyframes pulsate{ - 0% { - transform: scale(.1); - opacity: 0.0; - } - 50% { - opacity: 1; - } - 100% { - transform: scale(1.2); - opacity: 0; - } + 0% { + transform: scale(.1); + opacity: 0.0; + } + 50% { + opacity: 1; + } + 100% { + transform: scale(1.2); + opacity: 0; + } } @-o-keyframes pulsate{ - 0% { - transform: scale(.1); - opacity: 0.0; - } - 50% { - opacity: 1; - } - 100% { - transform: scale(1.2); - opacity: 0; - } + 0% { + transform: scale(.1); + opacity: 0.0; + } + 50% { + opacity: 1; + } + 100% { + transform: scale(1.2); + opacity: 0; + } } @-ms-keyframes pulsate{ - 0% { - transform: scale(.1); - opacity: 0.0; - } - 50% { - opacity: 1; - } - 100% { - transform: scale(1.2); - opacity: 0; - } + 0% { + transform: scale(.1); + opacity: 0.0; + } + 50% { + opacity: 1; + } + 100% { + transform: scale(1.2); + opacity: 0; + } } diff --git a/package.json b/package.json index 1325162..0f40244 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "simplelightbox", - "version": "1.10.7", + "version": "1.11.0", "description": "Touch-friendly image lightbox for mobile and desktop with jQuery", "main": "dist/simple-lightbox.js", "repository": {