summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorVictor Häggqvist <[email protected]>2014-06-24 22:22:23 +0200
committerVictor Häggqvist <[email protected]>2014-06-24 22:22:23 +0200
commitcbcf177bdf0b04e2f3b55f82d1609593e7408920 (patch)
tree1b89bedb1daf83ea605c5288d2279041b92aa086
parent2cb7b2c6e7799f14273d2b4b928c57d4ae4a5aac (diff)
fluff
-rw-r--r--Gruntfile.js24
-rw-r--r--LICENSE21
-rw-r--r--README.md4
-rw-r--r--bower.json23
-rw-r--r--dist/imagelightbox.css269
-rw-r--r--dist/imagelightbox.css.map7
-rw-r--r--dist/imagelightbox.js311
-rw-r--r--dist/imagelightbox.min.css1
-rw-r--r--dist/imagelightbox.min.js5
-rw-r--r--js/imagelightbox.js332
-rw-r--r--package.json9
-rw-r--r--sass/imagelightbox.scss214
12 files changed, 65 insertions, 1155 deletions
diff --git a/Gruntfile.js b/Gruntfile.js
index 8d74cc1..4f5091b 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -33,7 +33,7 @@ module.exports = function(grunt) {
},
jshint: {
options: {
- curly: true,
+ curly: false,
eqeqeq: true,
immed: true,
latedef: true,
@@ -44,7 +44,9 @@ module.exports = function(grunt) {
unused: true,
boss: true,
eqnull: true,
- globals: {}
+ globals: {
+ jQuery: true
+ }
},
gruntfile: {
src: 'Gruntfile.js'
@@ -63,8 +65,7 @@ module.exports = function(grunt) {
reload: true
},
files: ['<%= jshint.main.src %>', 'sass/*.scss'],
- // tasks: ['jshint:main', 'sass:dist_exp']
- tasks: ['sass', 'copy']
+ tasks: ['jshint:main', 'sass', 'copy']
}
},
sass: {
@@ -74,17 +75,17 @@ module.exports = function(grunt) {
compass: true
},
files: {
- 'dist/<%= pkg.name %>.min.css': 'sass/*.scss'
+ 'dist/<%= pkg.name %>.min.css': 'sass/<%= pkg.name %>.scss'
}
},
- dist_exp: {
+ dist_map: {
options: {
style: 'expanded',
sourcemap: true,
compass: true
},
files: {
- 'dist/<%= pkg.name %>.css': 'sass/*.scss'
+ 'dist/<%= pkg.name %>.css': 'sass/<%= pkg.name %>.scss'
}
}
},
@@ -96,10 +97,14 @@ module.exports = function(grunt) {
dest: 'demo/',
filter: 'isFile'
}
+ },
+ clean: {
+ dist: ['dist']
}
});
// These plugins provide necessary tasks.
+ grunt.loadNpmTasks('grunt-contrib-clean');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-copy');
grunt.loadNpmTasks('grunt-contrib-jshint');
@@ -108,9 +113,8 @@ module.exports = function(grunt) {
grunt.loadNpmTasks('grunt-contrib-watch');
// Default task.
- // grunt.registerTask('default', ['jshint', 'concat', 'uglify', 'sass']);
- grunt.registerTask('default', ['concat', 'uglify', 'sass']);
+ grunt.registerTask('default', ['clean', 'jshint', 'concat', 'uglify', 'sass']);
- grunt.registerTask('demo', ['copy']);
+ grunt.registerTask('demo', ['default', 'copy']);
};
diff --git a/LICENSE b/LICENSE
new file mode 100644
index 0000000..5e0fc21
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2014 Victor Häggqvist
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
diff --git a/README.md b/README.md
index ce81b24..b7b097c 100644
--- a/README.md
+++ b/README.md
@@ -1,6 +1,6 @@
-Image Lightbox
+Touch Imagelightbox
==============
-Image lightbox was originly created by [Osvaldas Valutis](http://osvaldas.info/image-lightbox-responsive-touch-friendly), though it was only accesible through his site. I put it here to make it more maintainable.
+Imagelightbox was originly created by [Osvaldas Valutis](http://osvaldas.info/image-lightbox-responsive-touch-friendly), though it was only accesible through his site. I put it here to make it more maintainable.
#How to get it
ATM, `git clone` the repo or download the zip.
diff --git a/bower.json b/bower.json
new file mode 100644
index 0000000..0ad364a
--- /dev/null
+++ b/bower.json
@@ -0,0 +1,23 @@
+{
+ "name": "touch-imagelightbox",
+ "version": "0.1.0",
+ "authors": [
+ "Victor Häggqvist <[email protected]>"
+ ],
+ "description": "A touch-friendly image lightbox",
+ "main": "dist/touch-imagelightbox.min.js",
+ "keywords": [
+ "lightbox",
+ "touch",
+ "slideshow"
+ ],
+ "license": "MIT",
+ "homepage": "https://victorhaggqvist.github.io/touch-imagelightbox",
+ "ignore": [
+ "**/.*",
+ "node_modules",
+ "bower_components",
+ "test",
+ "tests"
+ ]
+}
diff --git a/dist/imagelightbox.css b/dist/imagelightbox.css
deleted file mode 100644
index 0f03f50..0000000
--- a/dist/imagelightbox.css
+++ /dev/null
@@ -1,269 +0,0 @@
-html {
- -ms-touch-action: manipulation;
- touch-action: manipulation;
-}
-
-#imagelightbox {
- -ms-touch-action: none;
- touch-action: none;
- -moz-box-shadow: rgba(0, 0, 0, 0.75) 0 0 50px;
- -webkit-box-shadow: rgba(0, 0, 0, 0.75) 0 0 50px;
- box-shadow: rgba(0, 0, 0, 0.75) 0 0 50px;
- cursor: pointer;
- position: fixed;
- z-index: 10000;
-}
-
-#imagelightbox-loading,
-#imagelightbox-loading div {
- -moz-border-radius: 50%;
- -webkit-border-radius: 50%;
- border-radius: 50%;
-}
-
-#imagelightbox-loading {
- -moz-box-shadow: rgba(0, 0, 0, 0.75) 0 0 40px;
- -webkit-box-shadow: rgba(0, 0, 0, 0.75) 0 0 40px;
- box-shadow: rgba(0, 0, 0, 0.75) 0 0 40px;
- background: #444;
- background: rgba(0, 0, 0, 0.5);
- height: 20px;
- left: 50%;
- margin: -1.25em 0 0 -1.25em;
- padding: 10px;
- position: fixed;
- top: 50%;
- width: 20px;
- z-index: 10003;
-}
-#imagelightbox-loading div {
- -moz-animation: imagelightbox-loading .5s ease infinite;
- -o-animation: imagelightbox-loading .5s ease infinite;
- -webkit-animation: imagelightbox-loading .5s ease infinite;
- animation: imagelightbox-loading .5s ease infinite;
- background-color: #fff;
- height: 20px;
- width: 20px;
-}
-
-@-webkit-keyframes imagelightbox-loading {
- from {
- opacity: .5;
- -webkit-transform: scale(0.75);
- }
-
- 50% {
- opacity: 1;
- -webkit-transform: scale(1);
- }
-
- to {
- opacity: .5;
- -webkit-transform: scale(0.75);
- }
-}
-@-moz-keyframes imagelightbox-loading {
- from {
- opacity: .5;
- -moz-transform: scale(0.75);
- }
-
- 50% {
- opacity: 1;
- -moz-transform: scale(1);
- }
-
- to {
- opacity: .5;
- -moz-transform: scale(0.75);
- }
-}
-@-o-keyframes imagelightbox-loading {
- from {
- opacity: .5;
- -o-transform: scale(0.75);
- }
-
- 50% {
- opacity: 1;
- -o-transform: scale(1);
- }
-
- to {
- opacity: .5;
- -o-transform: scale(0.75);
- }
-}
-@keyframes imagelightbox-loading {
- from {
- opacity: .5;
- transform: scale(0.75);
- }
-
- 50% {
- opacity: 1;
- transform: scale(1);
- }
-
- to {
- opacity: .5;
- transform: scale(0.75);
- }
-}
-#imagelightbox-overlay {
- background: #fff;
- background: rgba(255, 255, 255, 0.9);
- bottom: 0;
- left: 0;
- position: fixed;
- right: 0;
- top: 0;
- z-index: 9998;
-}
-
-#imagelightbox-close {
- -moz-border-radius: 50%;
- -moz-transition: color .3s ease;
- -ms-transition: color .3s ease;
- -o-transition: color .3s ease;
- -webkit-border-radius: 50%;
- -webkit-transition: color .3s ease;
- background-color: #666;
- border-radius: 50%;
- height: 40px;
- position: fixed;
- right: 40px;
- text-align: left;
- text-indent: -9999px;
- top: 40px;
- transition: color .3s ease;
- width: 40px;
- z-index: 10002;
-}
-#imagelightbox-close:hover {
- background-color: #111;
-}
-#imagelightbox-close:before, #imagelightbox-close:after {
- background-color: #fff;
- bottom: 20%;
- content: '';
- left: 50%;
- margin-left: -1px;
- position: absolute;
- top: 20%;
- width: 2px;
-}
-#imagelightbox-close:before {
- -moz-transform: rotate(45deg);
- -ms-transform: rotate(45deg);
- -webkit-transform: rotate(45deg);
- transform: rotate(45deg);
-}
-#imagelightbox-close:after {
- -moz-transform: rotate(-45deg);
- -ms-transform: rotate(-45deg);
- -webkit-transform: rotate(-45deg);
- transform: rotate(-45deg);
-}
-
-#imagelightbox-caption {
- background-color: #666;
- bottom: 0;
- color: #fff;
- left: 0;
- padding: 10px;
- position: fixed;
- right: 0;
- text-align: center;
- z-index: 10001;
-}
-
-#imagelightbox-nav {
- -moz-border-radius: 20px;
- -webkit-border-radius: 20px;
- border-radius: 20px;
- -moz-transform: translateX(-50%);
- -ms-transform: translateX(-50%);
- -webkit-transform: translateX(-50%);
- transform: translateX(-50%);
- background-color: #444;
- background-color: rgba(0, 0, 0, 0.5);
- bottom: 60px;
- left: 50%;
- padding: 5px 2px 1px;
- position: fixed;
- z-index: 10001;
-}
-#imagelightbox-nav a {
- -moz-border-radius: 50%;
- -webkit-border-radius: 50%;
- border-radius: 50%;
- border: 1px solid #fff;
- display: inline-block;
- height: 20px;
- margin: 0 5px;
- width: 20px;
-}
-#imagelightbox-nav a.active {
- background-color: #fff;
-}
-
-#imagelightbox-loading,
-#imagelightbox-overlay,
-#imagelightbox-close,
-#imagelightbox-caption,
-#imagelightbox-nav {
- -webkit-animation: fade-in .25s linear;
- -moz-animation: fade-in .25s linear;
- -o-animation: fade-in .25s linear;
- animation: fade-in .25s linear;
-}
-
-@-webkit-keyframes fade-in {
- from {
- opacity: 0;
- }
-
- to {
- opacity: 1;
- }
-}
-@-moz-keyframes fade-in {
- from {
- opacity: 0;
- }
-
- to {
- opacity: 1;
- }
-}
-@-o-keyframes fade-in {
- from {
- opacity: 0;
- }
-
- to {
- opacity: 1;
- }
-}
-@keyframes fade-in {
- from {
- opacity: 0;
- }
-
- to {
- opacity: 1;
- }
-}
-@media only screen and (max-width: 660px) {
- #imagelightbox-close {
- right: 20px;
- top: 20px;
- }
-
- #imagelightbox-nav {
- bottom: 20px;
- }
-}
-
-/*# sourceMappingURL=imagelightbox.css.map */
diff --git a/dist/imagelightbox.css.map b/dist/imagelightbox.css.map
deleted file mode 100644
index d03c468..0000000
--- a/dist/imagelightbox.css.map
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-"version": 3,
-"mappings": "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",
-"sources": ["../sass/imagelightbox.scss","../../../.rvm/gems/ruby-2.1.2/gems/compass-core-1.0.0.alpha.19/stylesheets/compass/_support.scss","../../../.rvm/gems/ruby-2.1.2/gems/compass-core-1.0.0.alpha.19/stylesheets/compass/css3/_box-shadow.scss","../../../.rvm/gems/ruby-2.1.2/gems/compass-core-1.0.0.alpha.19/stylesheets/compass/css3/_border-radius.scss","../../../.rvm/gems/ruby-2.1.2/gems/compass-core-1.0.0.alpha.19/stylesheets/compass/css3/_transform.scss"],
-"names": [],
-"file": "imagelightbox.css"
-}
diff --git a/dist/imagelightbox.js b/dist/imagelightbox.js
deleted file mode 100644
index e261eb9..0000000
--- a/dist/imagelightbox.js
+++ /dev/null
@@ -1,311 +0,0 @@
-/*! imagelightbox - v0.1.0 - 2014-06-09
-* https://github.com/victorhaggqvist/imagelightbox
-* Copyright (c) 2014 Osvaldas Valutis (www.osvaldas.info); Licensed MIT
-* Contributors Victor Häggqvist (victorhaggqvist.com) */
-;( function( $, window, document, undefined )
-{
- 'use strict';
-
- var cssTransitionSupport = function()
- {
- var s = document.body || document.documentElement, s = s.style;
- if( s.WebkitTransition == '' ) return '-webkit-';
- if( s.MozTransition == '' ) return '-moz-';
- if( s.OTransition == '' ) return '-o-';
- if( s.transition == '' ) return '';
- return false;
- },
-
- isCssTransitionSupport = cssTransitionSupport() === false ? false : true,
-
- cssTransitionTranslateX = function( element, positionX, speed )
- {
- var options = {}, prefix = cssTransitionSupport();
- options[ prefix + 'transform' ] = 'translateX(' + positionX + ')';
- options[ prefix + 'transition' ] = prefix + 'transform ' + speed + 's linear';
- element.css( options );
- },
-
- hasTouch = ( 'ontouchstart' in window ),
- hasPointers = window.navigator.pointerEnabled || window.navigator.msPointerEnabled,
- wasTouched = function( event )
- {
- if( hasTouch )
- return true;
-
- if( !hasPointers || typeof event === 'undefined' || typeof event.pointerType === 'undefined' )
- return false;
-
- if( typeof event.MSPOINTER_TYPE_MOUSE !== 'undefined' )
- {
- if( event.MSPOINTER_TYPE_MOUSE != event.pointerType )
- return true;
- }
- else
- if( event.pointerType != 'mouse' )
- return true;
-
- return false;
- };
-
- $.fn.imageLightbox = function( options )
- {
- var options = $.extend(
- {
- selector: 'id="imagelightbox"',
- allowedTypes: 'png|jpg|jpeg|gif',
- animationSpeed: 250,
- preloadNext: true,
- enableKeyboard: true,
- quitOnEnd: false,
- quitOnImgClick: false,
- quitOnDocClick: true,
- onStart: false,
- onEnd: false,
- onLoadStart: false,
- onLoadEnd: false
- },
- options ),
-
- targets = $([]),
- target = $(),
- image = $(),
- imageWidth = 0,
- imageHeight = 0,
- swipeDiff = 0,
- inProgress = false,
-
- isTargetValid = function( element )
- {
- return $( element ).prop( 'tagName' ).toLowerCase() == 'a' && ( new RegExp( '\.(' + options.allowedTypes + ')$', 'i' ) ).test( $( element ).attr( 'href' ) );
- },
-
- setImage = function()
- {
- if( !image.length ) return false;
-
- var screenWidth = $( window ).width() * 0.8,
- screenHeight = $( window ).height() * 0.9,
- tmpImage = new Image();
-
- tmpImage.src = image.attr( 'src' );
- tmpImage.onload = function()
- {
- imageWidth = tmpImage.width;
- imageHeight = tmpImage.height;
-
- if( imageWidth > screenWidth || imageHeight > screenHeight )
- {
- var ratio = imageWidth / imageHeight > screenWidth / screenHeight ? imageWidth / screenWidth : imageHeight / screenHeight;
- imageWidth /= ratio;
- imageHeight /= ratio;
- }
-
- image.css(
- {
- 'width': imageWidth + 'px',
- 'height': imageHeight + 'px',
- 'top': ( $( window ).height() - imageHeight ) / 2 + 'px',
- 'left': ( $( window ).width() - imageWidth ) / 2 + 'px'
- });
- };
- },
-
- loadImage = function( direction )
- {
- if( inProgress ) return false;
-
- direction = typeof direction === 'undefined' ? false : direction == 'left' ? 1 : -1;
-
- if( image.length )
- {
- if( direction !== false && ( targets.length < 2 || ( options.quitOnEnd === true && ( ( direction === -1 && targets.index( target ) == 0 ) || ( direction === 1 && targets.index( target ) == targets.length - 1 ) ) ) ) )
- {
- quitLightbox();
- return false;
- }
- var params = { 'opacity': 0 };
- if( isCssTransitionSupport ) cssTransitionTranslateX( image, ( 100 * direction ) - swipeDiff + 'px', options.animationSpeed / 1000 );
- else params.left = parseInt( image.css( 'left' ) ) + 100 * direction + 'px';
- image.animate( params, options.animationSpeed, function(){ removeImage(); });
- swipeDiff = 0;
- }
-
- inProgress = true;
- if( options.onLoadStart !== false ) options.onLoadStart();
-
- setTimeout( function()
- {
- image = $( '<img ' + options.selector + ' />' )
- .attr( 'src', target.attr( 'href' ) )
- .load( function()
- {
- image.appendTo( 'body' );
- setImage();
-
- var params = { 'opacity': 1 };
-
- image.css( 'opacity', 0 );
- if( isCssTransitionSupport )
- {
- cssTransitionTranslateX( image, -100 * direction + 'px', 0 );
- setTimeout( function(){ cssTransitionTranslateX( image, 0 + 'px', options.animationSpeed / 1000 ) }, 50 );
- }
- else
- {
- var imagePosLeft = parseInt( image.css( 'left' ) );
- params.left = imagePosLeft + 'px';
- image.css( 'left', imagePosLeft - 100 * direction + 'px' );
- }
-
- image.animate( params, options.animationSpeed, function()
- {
- inProgress = false;
- if( options.onLoadEnd !== false ) options.onLoadEnd();
- });
- if( options.preloadNext )
- {
- var nextTarget = targets.eq( targets.index( target ) + 1 );
- if( !nextTarget.length ) nextTarget = targets.eq( 0 );
- $( '<img />' ).attr( 'src', nextTarget.attr( 'href' ) ).load();
- }
- })
- .error( function()
- {
- if( options.onLoadEnd !== false ) options.onLoadEnd();
- })
-
- var swipeStart = 0,
- swipeEnd = 0,
- imagePosLeft = 0;
-
- image.on( hasPointers ? 'pointerup MSPointerUp' : 'click', function( e )
- {
- e.preventDefault();
- if( options.quitOnImgClick )
- {
- quitLightbox();
- return false;
- }
- if( wasTouched( e.originalEvent ) ) return true;
- var posX = ( e.pageX || e.originalEvent.pageX ) - e.target.offsetLeft;
- target = targets.eq( targets.index( target ) - ( imageWidth / 2 > posX ? 1 : -1 ) );
- if( !target.length ) target = targets.eq( imageWidth / 2 > posX ? targets.length : 0 );
- loadImage( imageWidth / 2 > posX ? 'left' : 'right' );
- })
- .on( 'touchstart pointerdown MSPointerDown', function( e )
- {
- if( !wasTouched( e.originalEvent ) || options.quitOnImgClick ) return true;
- if( isCssTransitionSupport ) imagePosLeft = parseInt( image.css( 'left' ) );
- swipeStart = e.originalEvent.pageX || e.originalEvent.touches[ 0 ].pageX;
- })
- .on( 'touchmove pointermove MSPointerMove', function( e )
- {
- if( !wasTouched( e.originalEvent ) || options.quitOnImgClick ) return true;
- e.preventDefault();
- swipeEnd = e.originalEvent.pageX || e.originalEvent.touches[ 0 ].pageX;
- swipeDiff = swipeStart - swipeEnd;
- if( isCssTransitionSupport ) cssTransitionTranslateX( image, -swipeDiff + 'px', 0 );
- else image.css( 'left', imagePosLeft - swipeDiff + 'px' );
- })
- .on( 'touchend touchcancel pointerup MSPointerUp', function( e )
- {
- if( !wasTouched( e.originalEvent ) || options.quitOnImgClick ) return true;
- if( Math.abs( swipeDiff ) > 50 )
- {
- target = targets.eq( targets.index( target ) - ( swipeDiff < 0 ? 1 : -1 ) );
- if( !target.length ) target = targets.eq( swipeDiff < 0 ? targets.length : 0 );
- loadImage( swipeDiff > 0 ? 'right' : 'left' );
- }
- else
- {
- if( isCssTransitionSupport ) cssTransitionTranslateX( image, 0 + 'px', options.animationSpeed / 1000 );
- else image.animate({ 'left': imagePosLeft + 'px' }, options.animationSpeed / 2 );
- }
- });
-
- }, options.animationSpeed + 100 );
- },
-
- removeImage = function()
- {
- if( !image.length ) return false;
- image.remove();
- image = $();
- },
-
- quitLightbox = function()
- {
- if( !image.length ) return false;
- image.animate({ 'opacity': 0 }, options.animationSpeed, function()
- {
- removeImage();
- inProgress = false;
- if( options.onEnd !== false ) options.onEnd();
- });
- };
-
- $( window ).on( 'resize', setImage );
-
- if( options.quitOnDocClick )
- {
- $( document ).on( hasTouch ? 'touchend' : 'click', function( e )
- {
- if( image.length && !$( e.target ).is( image ) ) quitLightbox();
- })
- }
-
- if( options.enableKeyboard )
- {
- $( document ).on( 'keyup', function( e )
- {
- if( !image.length ) return true;
- e.preventDefault();
- if( e.keyCode == 27 ) quitLightbox();
- if( e.keyCode == 37 || e.keyCode == 39 )
- {
- target = targets.eq( targets.index( target ) - ( e.keyCode == 37 ? 1 : -1 ) );
- if( !target.length ) target = targets.eq( e.keyCode == 37 ? targets.length : 0 );
- loadImage( e.keyCode == 37 ? 'left' : 'right' );
- }
- });
- }
-
- $( document ).on( 'click', this.selector, function( e )
- {
- if( !isTargetValid( this ) ) return true;
- e.preventDefault();
- if( inProgress ) return false;
- inProgress = false;
- if( options.onStart !== false ) options.onStart();
- target = $( this );
- loadImage();
- });
-
- this.each( function()
- {
- if( !isTargetValid( this ) ) return true;
- targets = targets.add( $( this ) );
- });
-
- this.switchImageLightbox = function( index )
- {
- var tmpTarget = targets.eq( index );
- if( tmpTarget.length )
- {
- var currentIndex = targets.index( target );
- target = tmpTarget;
- loadImage( index < currentIndex ? 'left' : 'right' );
- }
- return this;
- };
-
- this.quitImageLightbox = function()
- {
- quitLightbox();
- return this;
- };
-
- return this;
- };
-})( jQuery, window, document );
diff --git a/dist/imagelightbox.min.css b/dist/imagelightbox.min.css
deleted file mode 100644
index 10de688..0000000
--- a/dist/imagelightbox.min.css
+++ /dev/null
@@ -1 +0,0 @@
-html{-ms-touch-action:manipulation;touch-action:manipulation}#imagelightbox{-ms-touch-action:none;touch-action:none;-moz-box-shadow:rgba(0,0,0,0.75) 0 0 50px;-webkit-box-shadow:rgba(0,0,0,0.75) 0 0 50px;box-shadow:rgba(0,0,0,0.75) 0 0 50px;cursor:pointer;position:fixed;z-index:10000}#imagelightbox-loading,#imagelightbox-loading div{-moz-border-radius:50%;-webkit-border-radius:50%;border-radius:50%}#imagelightbox-loading{-moz-box-shadow:rgba(0,0,0,0.75) 0 0 40px;-webkit-box-shadow:rgba(0,0,0,0.75) 0 0 40px;box-shadow:rgba(0,0,0,0.75) 0 0 40px;background:#444;background:rgba(0,0,0,0.5);height:20px;left:50%;margin:-1.25em 0 0 -1.25em;padding:10px;position:fixed;top:50%;width:20px;z-index:10003}#imagelightbox-loading div{-moz-animation:imagelightbox-loading .5s ease infinite;-o-animation:imagelightbox-loading .5s ease infinite;-webkit-animation:imagelightbox-loading .5s ease infinite;animation:imagelightbox-loading .5s ease infinite;background-color:#fff;height:20px;width:20px}@-webkit-keyframes imagelightbox-loading{from{opacity:.5;-webkit-transform:scale(0.75)}50%{opacity:1;-webkit-transform:scale(1)}to{opacity:.5;-webkit-transform:scale(0.75)}}@-moz-keyframes imagelightbox-loading{from{opacity:.5;-moz-transform:scale(0.75)}50%{opacity:1;-moz-transform:scale(1)}to{opacity:.5;-moz-transform:scale(0.75)}}@-o-keyframes imagelightbox-loading{from{opacity:.5;-o-transform:scale(0.75)}50%{opacity:1;-o-transform:scale(1)}to{opacity:.5;-o-transform:scale(0.75)}}@keyframes imagelightbox-loading{from{opacity:.5;transform:scale(0.75)}50%{opacity:1;transform:scale(1)}to{opacity:.5;transform:scale(0.75)}}#imagelightbox-overlay{background:#fff;background:rgba(255,255,255,0.9);bottom:0;left:0;position:fixed;right:0;top:0;z-index:9998}#imagelightbox-close{-moz-border-radius:50%;-moz-transition:color .3s ease;-ms-transition:color .3s ease;-o-transition:color .3s ease;-webkit-border-radius:50%;-webkit-transition:color .3s ease;background-color:#666;border-radius:50%;height:40px;position:fixed;right:40px;text-align:left;text-indent:-9999px;top:40px;transition:color .3s ease;width:40px;z-index:10002}#imagelightbox-close:hover{background-color:#111}#imagelightbox-close:before,#imagelightbox-close:after{background-color:#fff;bottom:20%;content:'';left:50%;margin-left:-1px;position:absolute;top:20%;width:2px}#imagelightbox-close:before{-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg)}#imagelightbox-close:after{-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}#imagelightbox-caption{background-color:#666;bottom:0;color:#fff;left:0;padding:10px;position:fixed;right:0;text-align:center;z-index:10001}#imagelightbox-nav{-moz-border-radius:20px;-webkit-border-radius:20px;border-radius:20px;-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-webkit-transform:translateX(-50%);transform:translateX(-50%);background-color:#444;background-color:rgba(0,0,0,0.5);bottom:60px;left:50%;padding:5px 2px 1px;position:fixed;z-index:10001}#imagelightbox-nav a{-moz-border-radius:50%;-webkit-border-radius:50%;border-radius:50%;border:1px solid #fff;display:inline-block;height:20px;margin:0 5px;width:20px}#imagelightbox-nav a.active{background-color:#fff}#imagelightbox-loading,#imagelightbox-overlay,#imagelightbox-close,#imagelightbox-caption,#imagelightbox-nav{-webkit-animation:fade-in .25s linear;-moz-animation:fade-in .25s linear;-o-animation:fade-in .25s linear;animation:fade-in .25s linear}@-webkit-keyframes fade-in{from{opacity:0}to{opacity:1}}@-moz-keyframes fade-in{from{opacity:0}to{opacity:1}}@-o-keyframes fade-in{from{opacity:0}to{opacity:1}}@keyframes fade-in{from{opacity:0}to{opacity:1}}@media only screen and (max-width: 660px){#imagelightbox-close{right:20px;top:20px}#imagelightbox-nav{bottom:20px}}
diff --git a/dist/imagelightbox.min.js b/dist/imagelightbox.min.js
deleted file mode 100644
index 3d825d7..0000000
--- a/dist/imagelightbox.min.js
+++ /dev/null
@@ -1,5 +0,0 @@
-/*! imagelightbox - v0.1.0 - 2014-06-09
-* https://github.com/victorhaggqvist/imagelightbox
-* Copyright (c) 2014 Osvaldas Valutis (www.osvaldas.info); Licensed MIT
-* Contributors Victor Häggqvist (victorhaggqvist.com) */
-!function(a,b,c){"use strict";var d=function(){var a=c.body||c.documentElement,a=a.style;return""==a.WebkitTransition?"-webkit-":""==a.MozTransition?"-moz-":""==a.OTransition?"-o-":""==a.transition?"":!1},e=d()===!1?!1:!0,f=function(a,b,c){var e={},f=d();e[f+"transform"]="translateX("+b+")",e[f+"transition"]=f+"transform "+c+"s linear",a.css(e)},g="ontouchstart"in b,h=b.navigator.pointerEnabled||b.navigator.msPointerEnabled,i=function(a){if(g)return!0;if(!h||"undefined"==typeof a||"undefined"==typeof a.pointerType)return!1;if("undefined"!=typeof a.MSPOINTER_TYPE_MOUSE){if(a.MSPOINTER_TYPE_MOUSE!=a.pointerType)return!0}else if("mouse"!=a.pointerType)return!0;return!1};a.fn.imageLightbox=function(d){var d=a.extend({selector:'id="imagelightbox"',allowedTypes:"png|jpg|jpeg|gif",animationSpeed:250,preloadNext:!0,enableKeyboard:!0,quitOnEnd:!1,quitOnImgClick:!1,quitOnDocClick:!0,onStart:!1,onEnd:!1,onLoadStart:!1,onLoadEnd:!1},d),j=a([]),k=a(),l=a(),m=0,n=0,o=0,p=!1,q=function(b){return"a"==a(b).prop("tagName").toLowerCase()&&new RegExp(".("+d.allowedTypes+")$","i").test(a(b).attr("href"))},r=function(){if(!l.length)return!1;var c=.8*a(b).width(),d=.9*a(b).height(),e=new Image;e.src=l.attr("src"),e.onload=function(){if(m=e.width,n=e.height,m>c||n>d){var f=m/n>c/d?m/c:n/d;m/=f,n/=f}l.css({width:m+"px",height:n+"px",top:(a(b).height()-n)/2+"px",left:(a(b).width()-m)/2+"px"})}},s=function(b){if(p)return!1;if(b="undefined"==typeof b?!1:"left"==b?1:-1,l.length){if(b!==!1&&(j.length<2||d.quitOnEnd===!0&&(-1===b&&0==j.index(k)||1===b&&j.index(k)==j.length-1)))return u(),!1;var c={opacity:0};e?f(l,100*b-o+"px",d.animationSpeed/1e3):c.left=parseInt(l.css("left"))+100*b+"px",l.animate(c,d.animationSpeed,function(){t()}),o=0}p=!0,d.onLoadStart!==!1&&d.onLoadStart(),setTimeout(function(){l=a("<img "+d.selector+" />").attr("src",k.attr("href")).load(function(){l.appendTo("body"),r();var c={opacity:1};if(l.css("opacity",0),e)f(l,-100*b+"px",0),setTimeout(function(){f(l,"0px",d.animationSpeed/1e3)},50);else{var g=parseInt(l.css("left"));c.left=g+"px",l.css("left",g-100*b+"px")}if(l.animate(c,d.animationSpeed,function(){p=!1,d.onLoadEnd!==!1&&d.onLoadEnd()}),d.preloadNext){var h=j.eq(j.index(k)+1);h.length||(h=j.eq(0)),a("<img />").attr("src",h.attr("href")).load()}}).error(function(){d.onLoadEnd!==!1&&d.onLoadEnd()});var c=0,g=0,n=0;l.on(h?"pointerup MSPointerUp":"click",function(a){if(a.preventDefault(),d.quitOnImgClick)return u(),!1;if(i(a.originalEvent))return!0;var b=(a.pageX||a.originalEvent.pageX)-a.target.offsetLeft;k=j.eq(j.index(k)-(m/2>b?1:-1)),k.length||(k=j.eq(m/2>b?j.length:0)),s(m/2>b?"left":"right")}).on("touchstart pointerdown MSPointerDown",function(a){return!i(a.originalEvent)||d.quitOnImgClick?!0:(e&&(n=parseInt(l.css("left"))),void(c=a.originalEvent.pageX||a.originalEvent.touches[0].pageX))}).on("touchmove pointermove MSPointerMove",function(a){return!i(a.originalEvent)||d.quitOnImgClick?!0:(a.preventDefault(),g=a.originalEvent.pageX||a.originalEvent.touches[0].pageX,o=c-g,void(e?f(l,-o+"px",0):l.css("left",n-o+"px")))}).on("touchend touchcancel pointerup MSPointerUp",function(a){return!i(a.originalEvent)||d.quitOnImgClick?!0:void(Math.abs(o)>50?(k=j.eq(j.index(k)-(0>o?1:-1)),k.length||(k=j.eq(0>o?j.length:0)),s(o>0?"right":"left")):e?f(l,"0px",d.animationSpeed/1e3):l.animate({left:n+"px"},d.animationSpeed/2))})},d.animationSpeed+100)},t=function(){return l.length?(l.remove(),void(l=a())):!1},u=function(){return l.length?void l.animate({opacity:0},d.animationSpeed,function(){t(),p=!1,d.onEnd!==!1&&d.onEnd()}):!1};return a(b).on("resize",r),d.quitOnDocClick&&a(c).on(g?"touchend":"click",function(b){l.length&&!a(b.target).is(l)&&u()}),d.enableKeyboard&&a(c).on("keyup",function(a){return l.length?(a.preventDefault(),27==a.keyCode&&u(),void((37==a.keyCode||39==a.keyCode)&&(k=j.eq(j.index(k)-(37==a.keyCode?1:-1)),k.length||(k=j.eq(37==a.keyCode?j.length:0)),s(37==a.keyCode?"left":"right")))):!0}),a(c).on("click",this.selector,function(b){return q(this)?(b.preventDefault(),p?!1:(p=!1,d.onStart!==!1&&d.onStart(),k=a(this),void s())):!0}),this.each(function(){return q(this)?void(j=j.add(a(this))):!0}),this.switchImageLightbox=function(a){var b=j.eq(a);if(b.length){var c=j.index(k);k=b,s(c>a?"left":"right")}return this},this.quitImageLightbox=function(){return u(),this},this}}(jQuery,window,document); \ No newline at end of file
diff --git a/js/imagelightbox.js b/js/imagelightbox.js
deleted file mode 100644
index d82b133..0000000
--- a/js/imagelightbox.js
+++ /dev/null
@@ -1,332 +0,0 @@
-/*jslint browser: true*/
-;( function( $, window, document, undefined ) {
- 'use strict';
- var options,
- cssTransitionSupport = function() {
- var d = document.body || document.documentElement, s = d.style;
- if ( s.WebkitTransition === '' )
- return '-webkit-';
- if ( s.MozTransition === '' )
- return '-moz-';
- if ( s.OTransition === '' )
- return '-o-';
- if ( s.transition === '' )
- return '';
- return false;
- },
-
- isCssTransitionSupport = cssTransitionSupport() === false ? false : true,
-
- cssTransitionTranslateX = function( element, positionX, speed ) {
- options = {};
- var prefix = cssTransitionSupport();
- options[ prefix + 'transform' ] = 'translateX(' + positionX + ')';
- options[ prefix + 'transition' ] = prefix + 'transform ' + speed + 's linear';
- element.css( options );
- },
-
- hasTouch = ( 'ontouchstart' in window ),
- hasPointers = window.navigator.pointerEnabled || window.navigator.msPointerEnabled,
- wasTouched = function( event ) {
- if( hasTouch )
- return true;
-
- if( !hasPointers || typeof event === 'undefined' || typeof event.pointerType === 'undefined' )
- return false;
-
- if( typeof event.MSPOINTER_TYPE_MOUSE !== 'undefined' ) {
- if( event.MSPOINTER_TYPE_MOUSE !== event.pointerType )
- return true;
- } else {
- if( event.pointerType !== 'mouse' )
- return true;
- }
-
- return false;
- };
-
- $.fn.imageLightbox = function( options ) {
- options = $.extend(
- {
- selector: 'id="imagelightbox"',
- allowedTypes: 'png|jpg|jpeg|gif',
- animationSpeed: 250,
- preloadNext: true,
- enableKeyboard: true,
- quitOnEnd: false,
- quitOnImgClick: false,
- quitOnDocClick: true,
- onStart: false,
- onEnd: false,
- onLoadStart: false,
- onLoadEnd: false
- },
- options);
-
- var targets = $([]),
- target = $(),
- image = $(),
- imageWidth = 0,
- imageHeight = 0,
- swipeDiff = 0,
- inProgress = false,
-
- isTargetValid = function( element ) {
- this.regexValidObject = /(\.(' + options.allowedTypes + ')$)/;
- return $( element ).prop( 'tagName' ).toLowerCase() === 'a' && this.regexValidObject.test($(element).attr('href') );
- },
-
- setImage = function() {
- if( !image.length ) return false;
-
- var screenWidth = $( window ).width() * 0.8,
- screenHeight = $( window ).height() * 0.9,
- tmpImage = new Image();
-
- tmpImage.src = image.attr( 'src' );
- tmpImage.onload = function() {
- imageWidth = tmpImage.width;
- imageHeight = tmpImage.height;
-
- if( imageWidth > screenWidth || imageHeight > screenHeight ) {
- var ratio = imageWidth / imageHeight > screenWidth / screenHeight ? imageWidth / screenWidth : imageHeight / screenHeight;
- imageWidth /= ratio;
- imageHeight /= ratio;
- }
-
- image.css(
- {
- 'width': imageWidth + 'px',
- 'height': imageHeight + 'px',
- 'top': ( $( window ).height() - imageHeight ) / 2 + 'px',
- 'left': ( $( window ).width() - imageWidth ) / 2 + 'px'
- }
- );
- };
- },
-
- loadImage = function( direction ) {
- if( inProgress ) return false;
-
- direction = typeof direction === 'undefined' ? false : direction === 'left' ? 1 : -1;
-
- // BIG if
- if( image.length ) {
- if( direction !== false &&
- ( targets.length < 2 ||
- ( options.quitOnEnd === true &&
- (
- ( direction === -1 &&
- targets.index( target ) === 0
- ) ||
- ( direction === 1 &&
- targets.index( target ) === targets.length - 1
- ) ) ) )
- )
- {
- quitLightbox();
- return false;
- }
- var params = { 'opacity': 0 };
- if( isCssTransitionSupport ){
- cssTransitionTranslateX( image, ( 100 * direction ) - swipeDiff + 'px', options.animationSpeed / 1000 );
- } else {
- params.left = parseInt( image.css( 'left' ) ) + 100 * direction + 'px';
- }
- image.animate( params, options.animationSpeed, function(){ removeImage(); });
- swipeDiff = 0;
- }
-
- inProgress = true;
- if( options.onLoadStart !== false ) options.onLoadStart();
-
- setTimeout( function() {
- image = $( '<img ' + options.selector + ' />' )
- .attr( 'src', target.attr( 'href' ) )
- .load( function()
- {
- image.appendTo( 'body' );
- setImage();
-
- var params = { 'opacity': 1 };
-
- image.css( 'opacity', 0 );
- if( isCssTransitionSupport )
- {
- cssTransitionTranslateX( image, -100 * direction + 'px', 0 );
- setTimeout( function(){
- cssTransitionTranslateX( image, 0 + 'px', options.animationSpeed / 1000 );
- }, 50 );
- }
- else
- {
- var imagePosLeft = parseInt( image.css( 'left' ) );
- params.left = imagePosLeft + 'px';
- image.css( 'left', imagePosLeft - 100 * direction + 'px' );
- }
-
- image.animate( params, options.animationSpeed, function()
- {
- inProgress = false;
- if( options.onLoadEnd !== false ) options.onLoadEnd();
- });
- if( options.preloadNext )
- {
- var nextTarget = targets.eq( targets.index( target ) + 1 );
- if( !nextTarget.length ) nextTarget = targets.eq( 0 );
- $( '<img />' ).attr( 'src', nextTarget.attr( 'href' ) ).load();
- }
- })
- .error( function() {
- if( options.onLoadEnd !== false )
- options.onLoadEnd();
- });
-
- var swipeStart = 0,
- swipeEnd = 0,
- imagePosLeft = 0;
-
- image.on( hasPointers ? 'pointerup MSPointerUp' : 'click', function( e ) {
- e.preventDefault();
- if( options.quitOnImgClick ) {
- quitLightbox();
- return false;
- }
-
- if( wasTouched( e.originalEvent ) )
- return true;
-
- var posX = ( e.pageX || e.originalEvent.pageX ) - e.target.offsetLeft;
- target = targets.eq( targets.index( target ) - ( imageWidth / 2 > posX ? 1 : -1 ) );
-
- if( !target.length )
- target = targets.eq( imageWidth / 2 > posX ? targets.length : 0 );
-
- loadImage( imageWidth / 2 > posX ? 'left' : 'right' );
- })
- .on( 'touchstart pointerdown MSPointerDown', function( e ) {
- if( !wasTouched( e.originalEvent ) || options.quitOnImgClick )
- return true;
- if( isCssTransitionSupport )
- imagePosLeft = parseInt( image.css( 'left' ) );
-
- swipeStart = e.originalEvent.pageX || e.originalEvent.touches[ 0 ].pageX;
- })
- .on( 'touchmove pointermove MSPointerMove', function( e ) {
- if( !wasTouched( e.originalEvent ) || options.quitOnImgClick )
- return true;
-
- e.preventDefault();
- swipeEnd = e.originalEvent.pageX || e.originalEvent.touches[ 0 ].pageX;
- swipeDiff = swipeStart - swipeEnd;
-
- if( isCssTransitionSupport )
- cssTransitionTranslateX( image, -swipeDiff + 'px', 0 );
- else
- image.css( 'left', imagePosLeft - swipeDiff + 'px' );
- })
- .on( 'touchend touchcancel pointerup MSPointerUp', function( e ) {
- if( !wasTouched( e.originalEvent ) || options.quitOnImgClick )
- return true;
- if( Math.abs( swipeDiff ) > 50 ) {
- target = targets.eq( targets.index( target ) - ( swipeDiff < 0 ? 1 : -1 ) );
-
- if( !target.length )
- target = targets.eq( swipeDiff < 0 ? targets.length : 0 );
- loadImage( swipeDiff > 0 ? 'right' : 'left' );
- } else {
- if( isCssTransitionSupport )
- cssTransitionTranslateX( image, 0 + 'px', options.animationSpeed / 1000 );
- else
- image.animate({ 'left': imagePosLeft + 'px' }, options.animationSpeed / 2 );
- }
- });
-
- }, options.animationSpeed + 100 );
- },
-
- removeImage = function() {
- if( !image.length )
- return false;
- image.remove();
- image = $();
- },
-
- quitLightbox = function() {
- if( !image.length )
- return false;
- image.animate({ 'opacity': 0 }, options.animationSpeed, function() {
- removeImage();
- inProgress = false;
- if( options.onEnd !== false )
- options.onEnd();
- });
- };
-
- $( window ).on( 'resize', setImage );
-
- if( options.quitOnDocClick ) {
- $( document ).on( hasTouch ? 'touchend' : 'click', function( e ) {
- if( image.length && !$( e.target ).is( image ) ) quitLightbox();
- });
- }
-
- if( options.enableKeyboard ) {
- $( document ).on( 'keyup', function( e ) {
- if( !image.length )
- return true;
-
- e.preventDefault();
-
- if( e.keyCode === 27 )
- quitLightbox();
-
- if( e.keyCode === 37 || e.keyCode === 39 ) {
- target = targets.eq( targets.index( target ) - ( e.keyCode === 37 ? 1 : -1 ) );
-
- if( !target.length )
- target = targets.eq( e.keyCode === 37 ? targets.length : 0 );
-
- loadImage( e.keyCode === 37 ? 'left' : 'right' );
- }
- });
- }
-
- $( document ).on( 'click', this.selector, function( e ) {
- if( !isTargetValid( this ) )
- return true;
- e.preventDefault();
-
- if( inProgress )
- return false;
- inProgress = false;
-
- if( options.onStart !== false )
- options.onStart();
- target = $( this );
- loadImage();
- });
-
- this.each( function() {
- if( !isTargetValid( this ) ) return true;
- targets = targets.add( $( this ) );
- });
-
- this.switchImageLightbox = function( index ) {
- var tmpTarget = targets.eq( index );
- if( tmpTarget.length ) {
- var currentIndex = targets.index( target );
- target = tmpTarget;
- loadImage( index < currentIndex ? 'left' : 'right' );
- }
- return this;
- };
-
- this.quitImageLightbox = function() {
- quitLightbox();
- return this;
- };
-
- return this;
- };
-})( jQuery, window, document );
diff --git a/package.json b/package.json
index b95cd7e..9f272de 100644
--- a/package.json
+++ b/package.json
@@ -1,5 +1,5 @@
{
- "name": "imagelightbox",
+ "name": "touch-imagelightbox",
"version": "0.1.0",
"description": "A touch-friendly image lightbox",
"scripts": {
@@ -7,7 +7,7 @@
},
"repository": {
"type": "git",
- "url": "github.com/victorhaggqvist/imagelightbox"
+ "url": "github.com/victorhaggqvist/touch-imagelightbox"
},
"keywords": [
"lightbox",
@@ -20,11 +20,12 @@
],
"license": "MIT",
"bugs": {
- "url": "https://github.com/victorhaggqvist/imagelightbox/issues"
+ "url": "https://github.com/victorhaggqvist/touch-imagelightbox/issues"
},
- "homepage": "https://github.com/victorhaggqvist/imagelightbox",
+ "homepage": "https://github.com/victorhaggqvist/touch-imagelightbox",
"devDependencies": {
"grunt": "~0.4.2",
+ "grunt-contrib-clean": "^0.5.0",
"grunt-contrib-concat": "~0.3.0",
"grunt-contrib-copy": "^0.5.0",
"grunt-contrib-jshint": "~0.7.2",
diff --git a/sass/imagelightbox.scss b/sass/imagelightbox.scss
deleted file mode 100644
index 0ae16c0..0000000
--- a/sass/imagelightbox.scss
+++ /dev/null
@@ -1,214 +0,0 @@
-@import 'compass/css3';
-@import 'variables';
-
-@mixin touch-action($value) {
- -ms-touch-action: $value;
- touch-action: $value;
-}
-
-html {
- // killing 300ms touch delay in IE
- @include touch-action(manipulation);
-}
-
-#imagelightbox {
- @include touch-action(none);
- @include box-shadow(rgba(0, 0, 0, .75) 0 0 50px);
- cursor: pointer;
- position: fixed;
- z-index: 10000;
-}
-
-// Loading Indication
-#imagelightbox-loading,
-#imagelightbox-loading div {
- @include border-radius(50%);
-}
-
-#imagelightbox-loading {
- @include box-shadow(rgba(0, 0, 0, .75) 0 0 $loadingbox-size*2);
-
- background: #444; // Fallback
- background: rgba(0, 0, 0, .5);
- height: $loadingbox-size;
- left: 50%;
- margin: -20px 0 0 -20px;
- padding: 10px;
- position: fixed;
- top: 50%;
- width: $loadingbox-size;
- z-index: 10003;
-
- div {
- -moz-animation: imagelightbox-loading .5s ease infinite;
- -o-animation: imagelightbox-loading .5s ease infinite;
- -webkit-animation: imagelightbox-loading .5s ease infinite;
- animation: imagelightbox-loading .5s ease infinite;
-
- background-color: #fff;
- height: 20px;
- width: 20px;
- }
-}
-
-@-webkit-keyframes imagelightbox-loading {
- 0% { opacity: .5; -webkit-transform: scale(.75); }
- 50% { opacity: 1; -webkit-transform: scale(1); }
- 100% { opacity: .5; -webkit-transform: scale(.75); }
-}
-
-@-moz-keyframes imagelightbox-loading {
- 0% { opacity: .5; -moz-transform: scale(.75); }
- 50% { opacity: 1; -moz-transform: scale(1); }
- 100% { opacity: .5; -moz-transform: scale(.75); }
-}
-
-@-o-keyframes imagelightbox-loading {
- 0% { opacity: .5; -o-transform: scale(.75); }
- 50% { opacity: 1; -o-transform: scale(1); }
- 100% { opacity: .5; -o-transform: scale(.75); }
-}
-
-@keyframes imagelightbox-loading {
- 0% { opacity: .5; transform: scale(.75); }
- 50% { opacity: 1; transform: scale(1); }
- 100% { opacity: .5; transform: scale(.75); }
-}
-
-#imagelightbox-overlay {
- background: #fff;
- background: rgba(255, 255, 255, .9);
- bottom: 0;
- left: 0;
- position: fixed;
- right: 0;
- top: 0;
- z-index: 9998;
-}
-
-
-// Close button
-#imagelightbox-close {
- @include border-radius(50%);
-
-
- background-color: #666;
- height: $closebutton-size;
- position: fixed;
- right: $closebutton-size;
- text-align: left;
- text-indent: -9999px;
- top: $closebutton-size;
- -moz-transition: color .3s ease;
- -ms-transition: color .3s ease;
- -o-transition: color .3s ease;
- -webkit-transition: color .3s ease;
- transition: color .3s ease;
- width: $closebutton-size;
- z-index: 10002;
-
- &:hover {
- background-color: #111;
- }
-
- &:before,
- &:after {
- background-color: #fff;
- bottom: 20%;
- content: '';
- left: 50%;
- margin-left: -1px;
- position: absolute;
- top: 20%;
- width: 2px;
- }
-
- &:before {
- @include rotate(45deg);
- }
-
- &:after {
- @include rotate(-45deg);
- }
-}
-
-#imagelightbox-caption {
- background-color: #666;
- bottom: 0;
- color: #fff;
- left: 0;
- padding: 10px;
- position: fixed;
- right: 0;
- text-align: center;
- z-index: 10001;
-}
-
-// The nav bubbles
-#imagelightbox-nav {
- @include border-radius(20px);
- @include translateX(-50%);
-
- background-color: #444;
- background-color: rgba(0, 0, 0, .5);
- bottom: 60px; // 60
- left: 50%;
- padding: 5px 2px 1px;
- position: fixed;
- z-index: 10001;
-
- a {
- @include border-radius(50%);
- border: 1px solid #fff;
- display: inline-block;
- height: 20px;
- margin: 0 5px;
- width: 20px;
-
- .active {
- background-color: #fff;
- }
- }
-}
-
-#imagelightbox-loading,
-#imagelightbox-overlay,
-#imagelightbox-close,
-#imagelightbox-caption,
-#imagelightbox-nav {
- -moz-animation: fade-in .25s linear;
- -o-animation: fade-in .25s linear;
- -webkit-animation: fade-in .25s linear;
- animation: fade-in .25s linear;
-}
-
-@-webkit-keyframes fade-in {
- 0% { opacity: 0; }
- 100% { opacity: 1; }
-}
-
-@-moz-keyframes fade-in {
- 0% { opacity: 0; }
- 100% { opacity: 1; }
-}
-
-@-o-keyframes fade-in {
- 0% { opacity: 0; }
- 100% { opacity: 1; }
-}
-
-@keyframes fade-in {
- 0% { opacity: 0; }
- 100% { opacity: 1; }
-}
-
-@media only screen and (max-width: 660px) {
- #imagelightbox-close {
- right: 20px;
- top: 20px;
- }
-
- #imagelightbox-nav {
- bottom: 20px;
- }
-}