Skip to content

Commit

Permalink
New option for src of image. e.g data attribute #70
Browse files Browse the repository at this point in the history
  • Loading branch information
root committed May 15, 2017
1 parent 6b0a398 commit 8b13765
Show file tree
Hide file tree
Showing 8 changed files with 285 additions and 265 deletions.
4 changes: 3 additions & 1 deletion README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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 |
Expand Down Expand Up @@ -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**
Expand Down Expand Up @@ -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)
Expand Down
2 changes: 1 addition & 1 deletion bower.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "simplelightbox",
"version": "1.10.7",
"version": "1.11.0",
"homepage": "http://andreknieriem.de/simple-lightbox",
"authors": [
"André Rinas <[email protected]> (http://andreknieriem.de)"
Expand Down
17 changes: 9 additions & 8 deletions dist/simple-lightbox.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ $.fn.simpleLightbox = function( options )
{

var options = $.extend({
sourceAttr: 'href',
overlay: true,
spinner: true,
nav: true,
Expand Down Expand Up @@ -137,7 +138,7 @@ $.fn.simpleLightbox = function( options )
wrapper = $('<div>').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);
Expand All @@ -160,9 +161,9 @@ $.fn.simpleLightbox = function( options )
index = objects.index(elem);
curImg = $( '<img/>' )
.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);
Expand Down Expand Up @@ -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;
$( '<img />' ).attr( 'src', objects.eq(next).attr( 'href' ) ).on('load', function(){
$( '<img />' ).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'));
});
$( '<img />' ).attr( 'src', objects.eq(prev).attr( 'href' ) ).on('load', function(){
$( '<img />' ).attr( 'src', objects.eq(prev).attr( options.sourceAttr ) ).on('load', function(){
if(loaded.indexOf($(this).attr('src')) == -1){
loaded.push($(this).attr('src'));
}
Expand Down Expand Up @@ -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();
Expand Down
2 changes: 1 addition & 1 deletion dist/simple-lightbox.min.js
View file

Large diffs are not rendered by default.

56 changes: 32 additions & 24 deletions dist/simplelightbox.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand All @@ -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%;
Expand All @@ -77,92 +81,96 @@ 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;
display: block;
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;
Expand All @@ -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;
Expand All @@ -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;
Expand All @@ -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;
Expand Down
2 changes: 1 addition & 1 deletion dist/simplelightbox.min.css
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading

0 comments on commit 8b13765

Please sign in to comment.