Skip to content

Commit a070a51

Browse files
committed
Fixed iOS 8.4.1 requiring two clicks on the close button to close
1 parent f721eb7 commit a070a51

6 files changed

Lines changed: 52 additions & 39 deletions

File tree

.gitignore

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,3 @@
11
node_modules/
2-
strip-*.zip
2+
strip-*.zip
3+
*.log

dist/css/strip.css

Lines changed: 23 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*!
2-
* Strip - A Less Intrusive Responsive Lightbox - v1.6.0
2+
* Strip - A Less Intrusive Responsive Lightbox - v1.6.1
33
* (c) 2014-2015 Nick Stakenburg
44
*
55
* http://www.stripjs.com
@@ -285,9 +285,9 @@
285285
margin-top: -120px;
286286
background-position: 50% 50%;
287287
background-repeat: no-repeat;
288-
background-image: url('strip-skins/strip/error.svg?rev=4');
288+
background-image: url('strip-skins/strip/error.svg');
289289
}
290-
.strp-no-svg .strp-error { background-image: url('strip-skins/strip/error.png?rev=4'); }
290+
.strp-no-svg .strp-error { background-image: url('strip-skins/strip/error.png'); }
291291

292292
/* Spinner - loading icon, wrapped by a div that moves it */
293293
.strp-spinner-move {
@@ -350,11 +350,11 @@
350350
*/
351351
/* < > */
352352
.strp-window-skin-strip .strp-nav-button-background { background-color: transparent; }
353-
.strp-window-skin-strip .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous.svg?rev=4'); }
354-
.strp-window-skin-strip .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next.svg?rev=4'); }
353+
.strp-window-skin-strip .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous.svg'); }
354+
.strp-window-skin-strip .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next.svg'); }
355355
/* IE7-8/no-svg (using a faded png) */
356-
.strp-window-skin-strip.strp-no-svg .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-faded.png?rev=4'); opacity: 1; }
357-
.strp-window-skin-strip.strp-no-svg .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-faded.png?rev=4'); opacity: 1; }
356+
.strp-window-skin-strip.strp-no-svg .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-faded.png'); opacity: 1; }
357+
.strp-window-skin-strip.strp-no-svg .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-faded.png'); opacity: 1; }
358358

359359
.strp-window-skin-strip .strp-nav .strp-nav-button-icon { opacity: .6; } /* normal state */
360360
.strp-window-skin-strip.strp-mobile-touch .strp-nav .strp-nav-button-icon { opacity: 1; } /* mobile-touch always has normal states at full opacity */
@@ -364,9 +364,9 @@
364364
.strp-window-skin-strip .strp-nav-hover .strp-nav-button-icon { opacity: 1; }
365365
/* IE7-8/no-svg (unfaded png) */
366366
.strp-window-skin-strip.strp-no-svg .strp-nav.strp-nav-previous:hover .strp-nav-button-icon,
367-
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous.png?rev=4'); }
367+
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous.png'); }
368368
.strp-window-skin-strip.strp-no-svg .strp-nav.strp-nav-next:hover .strp-nav-button-icon,
369-
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next.png?rev=4'); }
369+
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next.png'); }
370370

371371
/* Reduce < > button size on narrow screens (iPhone 6 and smaller) */
372372
@media all and (max-width: 375px) and (orientation: portrait),
@@ -379,17 +379,17 @@
379379
}
380380

381381
/* < > */
382-
.strp-window-skin-strip .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-small.svg?rev=4'); }
383-
.strp-window-skin-strip .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-small.svg?rev=4'); }
382+
.strp-window-skin-strip .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-small.svg'); }
383+
.strp-window-skin-strip .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-small.svg'); }
384384
/* IE7-8/no-svg (using a faded png) */
385-
.strp-window-skin-strip.strp-no-svg .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-small-faded.png?rev=4'); }
386-
.strp-window-skin-strip.strp-no-svg .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-small-faded.png?rev=4'); }
385+
.strp-window-skin-strip.strp-no-svg .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-small-faded.png'); }
386+
.strp-window-skin-strip.strp-no-svg .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-small-faded.png'); }
387387

388388
/* IE7-8/no-svg (unfaded png) */
389389
.strp-window-skin-strip.strp-no-svg .strp-nav.strp-nav-previous:hover .strp-nav-button-icon,
390-
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-small.png?rev=4'); }
390+
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-small.png'); }
391391
.strp-window-skin-strip.strp-no-svg .strp-nav.strp-nav-next:hover .strp-nav-button-icon,
392-
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-small.png?rev=4'); }
392+
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-small.png'); }
393393

394394
/* also reduce padding
395395
navbutton = 58 = 48 + (2 * 5 margin)
@@ -403,10 +403,16 @@
403403
}
404404

405405
/* X */
406-
.strp-window-skin-strip .strp-close .strp-close-icon { background-image: url('strip-skins/strip/close.svg?rev=4'); opacity: .8; }
406+
.strp-window-skin-strip .strp-close .strp-close-icon { background-image: url('strip-skins/strip/close.svg'); opacity: .8; }
407407
.strp-window-skin-strip .strp-close:hover .strp-close-icon { opacity: 1; }
408+
/* iOS 8.4.1 bug: when opacity changes it'll require 2 taps
409+
force a single opacity to fix this
410+
*/
411+
.strp-window-skin-strip.strp-mobile-touch .strp-close .strp-close-icon,
412+
.strp-window-skin-strip.strp-mobile-touch .strp-close:hover .strp-close-icon { opacity: 1; }
413+
408414
/* IE7-8/no-svg */
409-
.strp-window-skin-strip.strp-no-svg .strp-close .strp-close-icon { background-image: url('strip-skins/strip/close.png?rev=4'); opacity: 1; }
415+
.strp-window-skin-strip.strp-no-svg .strp-close .strp-close-icon { background-image: url('strip-skins/strip/close.png'); opacity: 1; }
410416

411417

412418
/* here's how to have content slide in with the window when opening and closing */

dist/js/strip.pkgd.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*!
2-
* Strip - A Less Intrusive Responsive Lightbox - v1.6.0
2+
* Strip - A Less Intrusive Responsive Lightbox - v1.6.1
33
* (c) 2014-2015 Nick Stakenburg
44
*
55
* http://www.stripjs.com
@@ -25,7 +25,7 @@
2525
}(this, function($) {
2626

2727
var Strip = {
28-
version: '1.6.0'
28+
version: '1.6.1'
2929
};
3030

3131
Strip.Skins = {

dist/js/strip.pkgd.min.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "@staaky/strip",
33
"title": "Strip",
4-
"version": "1.6.0",
4+
"version": "1.6.1",
55
"description": "A Less Intrusive Responsive Lightbox",
66
"homepage": "http://stripjs.com",
77
"author": {

src/css/strip.css

Lines changed: 22 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -285,9 +285,9 @@
285285
margin-top: -120px;
286286
background-position: 50% 50%;
287287
background-repeat: no-repeat;
288-
background-image: url('strip-skins/strip/error.svg?rev=4');
288+
background-image: url('strip-skins/strip/error.svg');
289289
}
290-
.strp-no-svg .strp-error { background-image: url('strip-skins/strip/error.png?rev=4'); }
290+
.strp-no-svg .strp-error { background-image: url('strip-skins/strip/error.png'); }
291291

292292
/* Spinner - loading icon, wrapped by a div that moves it */
293293
.strp-spinner-move {
@@ -350,11 +350,11 @@
350350
*/
351351
/* < > */
352352
.strp-window-skin-strip .strp-nav-button-background { background-color: transparent; }
353-
.strp-window-skin-strip .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous.svg?rev=4'); }
354-
.strp-window-skin-strip .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next.svg?rev=4'); }
353+
.strp-window-skin-strip .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous.svg'); }
354+
.strp-window-skin-strip .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next.svg'); }
355355
/* IE7-8/no-svg (using a faded png) */
356-
.strp-window-skin-strip.strp-no-svg .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-faded.png?rev=4'); opacity: 1; }
357-
.strp-window-skin-strip.strp-no-svg .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-faded.png?rev=4'); opacity: 1; }
356+
.strp-window-skin-strip.strp-no-svg .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-faded.png'); opacity: 1; }
357+
.strp-window-skin-strip.strp-no-svg .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-faded.png'); opacity: 1; }
358358

359359
.strp-window-skin-strip .strp-nav .strp-nav-button-icon { opacity: .6; } /* normal state */
360360
.strp-window-skin-strip.strp-mobile-touch .strp-nav .strp-nav-button-icon { opacity: 1; } /* mobile-touch always has normal states at full opacity */
@@ -364,9 +364,9 @@
364364
.strp-window-skin-strip .strp-nav-hover .strp-nav-button-icon { opacity: 1; }
365365
/* IE7-8/no-svg (unfaded png) */
366366
.strp-window-skin-strip.strp-no-svg .strp-nav.strp-nav-previous:hover .strp-nav-button-icon,
367-
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous.png?rev=4'); }
367+
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous.png'); }
368368
.strp-window-skin-strip.strp-no-svg .strp-nav.strp-nav-next:hover .strp-nav-button-icon,
369-
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next.png?rev=4'); }
369+
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next.png'); }
370370

371371
/* Reduce < > button size on narrow screens (iPhone 6 and smaller) */
372372
@media all and (max-width: 375px) and (orientation: portrait),
@@ -379,17 +379,17 @@
379379
}
380380

381381
/* < > */
382-
.strp-window-skin-strip .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-small.svg?rev=4'); }
383-
.strp-window-skin-strip .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-small.svg?rev=4'); }
382+
.strp-window-skin-strip .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-small.svg'); }
383+
.strp-window-skin-strip .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-small.svg'); }
384384
/* IE7-8/no-svg (using a faded png) */
385-
.strp-window-skin-strip.strp-no-svg .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-small-faded.png?rev=4'); }
386-
.strp-window-skin-strip.strp-no-svg .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-small-faded.png?rev=4'); }
385+
.strp-window-skin-strip.strp-no-svg .strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-small-faded.png'); }
386+
.strp-window-skin-strip.strp-no-svg .strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-small-faded.png'); }
387387

388388
/* IE7-8/no-svg (unfaded png) */
389389
.strp-window-skin-strip.strp-no-svg .strp-nav.strp-nav-previous:hover .strp-nav-button-icon,
390-
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-small.png?rev=4'); }
390+
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-previous .strp-nav-button-icon { background-image: url('strip-skins/strip/previous-small.png'); }
391391
.strp-window-skin-strip.strp-no-svg .strp-nav.strp-nav-next:hover .strp-nav-button-icon,
392-
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-small.png?rev=4'); }
392+
.strp-window-skin-strip.strp-no-svg .strp-nav-hover.strp-nav-next .strp-nav-button-icon { background-image: url('strip-skins/strip/next-small.png'); }
393393

394394
/* also reduce padding
395395
navbutton = 58 = 48 + (2 * 5 margin)
@@ -403,10 +403,16 @@
403403
}
404404

405405
/* X */
406-
.strp-window-skin-strip .strp-close .strp-close-icon { background-image: url('strip-skins/strip/close.svg?rev=4'); opacity: .8; }
406+
.strp-window-skin-strip .strp-close .strp-close-icon { background-image: url('strip-skins/strip/close.svg'); opacity: .8; }
407407
.strp-window-skin-strip .strp-close:hover .strp-close-icon { opacity: 1; }
408+
/* iOS 8.4.1 bug: when opacity changes it'll require 2 taps
409+
force a single opacity to fix this
410+
*/
411+
.strp-window-skin-strip.strp-mobile-touch .strp-close .strp-close-icon,
412+
.strp-window-skin-strip.strp-mobile-touch .strp-close:hover .strp-close-icon { opacity: 1; }
413+
408414
/* IE7-8/no-svg */
409-
.strp-window-skin-strip.strp-no-svg .strp-close .strp-close-icon { background-image: url('strip-skins/strip/close.png?rev=4'); opacity: 1; }
415+
.strp-window-skin-strip.strp-no-svg .strp-close .strp-close-icon { background-image: url('strip-skins/strip/close.png'); opacity: 1; }
410416

411417

412418
/* here's how to have content slide in with the window when opening and closing */

0 commit comments

Comments
 (0)