Skip to content

Commit

Permalink
27.2.0
Browse files Browse the repository at this point in the history
fix image load with no src specified
minor changes
  • Loading branch information
jssor committed Jul 3, 2018
1 parent 899e993 commit e24a778
Show file tree
Hide file tree
Showing 10 changed files with 79 additions and 55 deletions.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ Responsive Javascript Image/Text Slider/Slideshow/Gallery/Carousel/HTML5 Ad
2. [https://www.jssor.com/development](https://www.jssor.com/development)
2. [Slides HTML Code](https://www.jssor.com/development/define-slides-html-code.html)
2. [API: Options](https://www.jssor.com/development/api-options.html)
2. [API: Methods, properties & Events](https://www.jssor.com/development/api-methods-properties-events.html)
2. [API: Methods, Properties & Events](https://www.jssor.com/development/api-methods-properties-events.html)
2. [API: UI Definition](https://www.jssor.com/development/api-ui-definition.html)
2. [https://www.jssor.com/help](https://www.jssor.com/help)
2. [https://www.jssor.com/tutorial](https://www.jssor.com/tutorial)
Expand Down
2 changes: 1 addition & 1 deletion bower.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
"url": "https://github.com/jssor/slider.git"
},
"description": "touch swipe image slider/slideshow/gallery/carousel/banner mobile responsive bootstrap",
"version": "27.1.0",
"version": "27.2.0",
"homepage": "https://www.jssor.com",
"keywords": [
"javascript",
Expand Down
2 changes: 1 addition & 1 deletion component.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
"name": "jssor-slider",
"repo": "jssor/slider",
"description": "touch swipe image slider/slideshow/gallery/carousel/banner mobile responsive bootstrap",
"version": "27.1.0",
"version": "27.2.0",
"homepage": "https://www.jssor.com",
"keywords": [
"javascript",
Expand Down
23 changes: 17 additions & 6 deletions demos-jquery/full-window-for-mobile.html
Original file line number Diff line number Diff line change
Expand Up @@ -91,29 +91,40 @@
}
}

/*ios disable scrolling and bounce effect*/
//$Jssor$.$AddEvent(document, "touchmove", function(event){event.touches.length < 2 && $Jssor$.$CancelEvent(event);});
function OnOrientationChange() {
ScaleSlider();
window.setTimeout(ScaleSlider, 800);
}

ScaleSlider();

$(window).bind("load", ScaleSlider);
$(window).bind("resize", ScaleSlider);
$(window).bind("orientationchange", ScaleSlider);
$(window).bind("orientationchange", OnOrientationChange);
/*#endregion responsive code end*/
});
</script>
<style>
html, body {
position:absolute;
html {
position:fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
}

body {
position: relative;
margin: 0;
padding: 0;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
}


/* jssor slider loading skin spin css */
.jssorl-009-spin img {
animation-name: jssorl-009-spin;
Expand Down
18 changes: 10 additions & 8 deletions demos-jquery/full-window-for-pc.html
Original file line number Diff line number Diff line change
Expand Up @@ -48,8 +48,8 @@
0.1: flex mode, allow up to 10% to bleed outside, this is better way to make full window slider, especially for mobile devices
*/

var MAX_WIDTH = 3000;
var MAX_HEIGHT = 3000;
var MAX_WIDTH = 10000;
var MAX_HEIGHT = 10000;
var MAX_BLEEDING = 1;

function ScaleSlider() {
Expand Down Expand Up @@ -91,14 +91,16 @@
}
}

/*ios disable scrolling and bounce effect*/
//$Jssor$.$AddEvent(document, "touchmove", function(event){event.touches.length < 2 && $Jssor$.$CancelEvent(event);});
function OnOrientationChange() {
ScaleSlider();
window.setTimeout(ScaleSlider, 800);
}

ScaleSlider();

$(window).bind("load", ScaleSlider);
$(window).bind("resize", ScaleSlider);
$(window).bind("orientationchange", ScaleSlider);
$(window).bind("orientationchange", OnOrientationChange);
/*#endregion responsive code end*/
});
</script>
Expand Down Expand Up @@ -157,11 +159,11 @@
<div>
<img data-u="image" src="../img/gallery/960x640/001.jpg" />
<div style="position:absolute;top:195px;left:330px;width:300px;height:250px;z-index:0;background-color:rgba(255,188,5,0.8);font-size:16px;color:#ffffff;line-height:30px;text-align:left;padding:10px;box-sizing:border-box;">Layout Settings <br /><br />
Slider Size: 960 x 640<br />
Slider Size: 1366 x 768<br />
Scale To: Full Window (Flex Mode) <br />
Bleeding: 100% <br />
Max Width: 3000<br />
Max Height: 3000
Max Width: 10000<br />
Max Height: 10000
</div>
</div>
<div>
Expand Down
32 changes: 19 additions & 13 deletions demos/full-window-for-mobile.html
Original file line number Diff line number Diff line change
Expand Up @@ -90,29 +90,40 @@
}
}

/*ios disable scrolling and bounce effect*/
//$Jssor$.$AddEvent(document, "touchmove", function(event){event.touches.length < 2 && $Jssor$.$CancelEvent(event);});
function OnOrientationChange() {
ScaleSlider();
window.setTimeout(ScaleSlider, 800);
}

ScaleSlider();

$Jssor$.$AddEvent(window, "load", ScaleSlider);
$Jssor$.$AddEvent(window, "resize", ScaleSlider);
$Jssor$.$AddEvent(window, "orientationchange", ScaleSlider);
$Jssor$.$AddEvent(window, "orientationchange", OnOrientationChange);
/*#endregion responsive code end*/
};
</script>
<style>
html, body {
position:absolute;
html {
position:fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
}

body {
position: relative;
margin: 0;
padding: 0;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
}


/* jssor slider loading skin spin css */
.jssorl-009-spin img {
animation-name: jssorl-009-spin;
Expand All @@ -122,16 +133,11 @@
}

@keyframes jssorl-009-spin {
from {
transform: rotate(0deg);
}
from { transform: rotate(0deg); }

to {
transform: rotate(360deg);
}
to { transform: rotate(360deg); }
}


.jssorb064 {position:absolute;}
.jssorb064 .i {position:absolute;cursor:pointer;}
.jssorb064 .i .b {fill:#000;fill-opacity:.5;stroke:#fff;stroke-width:400;stroke-miterlimit:10;stroke-opacity:0.5;}
Expand Down
49 changes: 27 additions & 22 deletions demos/full-window-for-pc.html
Original file line number Diff line number Diff line change
Expand Up @@ -47,8 +47,8 @@
0.1: flex mode, allow up to 10% to bleed outside, this is better way to make full window slider, especially for mobile devices
*/

var MAX_WIDTH = 3000;
var MAX_HEIGHT = 3000;
var MAX_WIDTH = 10000;
var MAX_HEIGHT = 10000;
var MAX_BLEEDING = 1;

function ScaleSlider() {
Expand Down Expand Up @@ -89,48 +89,53 @@
}
}

/*ios disable scrolling and bounce effect*/
//$Jssor$.$AddEvent(document, "touchmove", function(event){event.touches.length < 2 && $Jssor$.$CancelEvent(event);});
function OnOrientationChange() {
ScaleSlider();
window.setTimeout(ScaleSlider, 800);
}

ScaleSlider();

$Jssor$.$AddEvent(window, "load", ScaleSlider);
$Jssor$.$AddEvent(window, "resize", ScaleSlider);
$Jssor$.$AddEvent(window, "orientationchange", ScaleSlider);
$Jssor$.$AddEvent(window, "orientationchange", OnOrientationChange);
/*#endregion responsive code end*/
};
</script>
<style>
html, body {
position:absolute;
html {
position:fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
}

body {
position: relative;
margin: 0;
padding: 0;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
}


/* jssor slider loading skin spin css */
.jssorl-009-spin img {
animation-name: jssorl-009-spin;
animation-duration: 1.6s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}

@keyframes jssorl-009-spin {
from {
transform: rotate(0deg);
}

to {
transform: rotate(360deg);
}
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}


.jssorb064 {position:absolute;}
.jssorb064 .i {position:absolute;cursor:pointer;}
.jssorb064 .i .b {fill:#000;fill-opacity:.5;stroke:#fff;stroke-width:400;stroke-miterlimit:10;stroke-opacity:0.5;}
Expand All @@ -146,20 +151,20 @@
.jssora051.jssora051ds {opacity:.3;pointer-events:none;}
</style>
<div style="position:relative;top:0;left:0;width:100%;height:100%;overflow:hidden;">
<div id="jssor_1" style="position:relative;margin:0 auto;top:0px;left:0px;width:960px;height:640px;overflow:hidden;visibility:hidden;">
<div id="jssor_1" style="position:relative;margin:0 auto;top:0px;left:0px;width:1366px;height:768px;overflow:hidden;visibility:hidden;">
<!-- Loading Screen -->
<div data-u="loading" class="jssorl-009-spin" style="position:absolute;top:0px;left:0px;width:100%;height:100%;text-align:center;background-color:rgba(0,0,0,0.7);">
<img style="margin-top:-19px;position:relative;top:50%;width:38px;height:38px;" src="../svg/loading/static-svg/spin.svg" />
</div>
<div data-u="slides" style="cursor:default;position:relative;top:0px;left:0px;width:960px;height:640px;overflow:hidden;">
<div data-u="slides" style="cursor:default;position:relative;top:0px;left:0px;width:1366px;height:768px;overflow:hidden;">
<div>
<img data-u="image" src="../img/gallery/960x640/001.jpg" />
<div style="position:absolute;top:195px;left:330px;width:300px;height:250px;z-index:0;background-color:rgba(255,188,5,0.8);font-size:16px;color:#ffffff;line-height:30px;text-align:left;padding:10px;box-sizing:border-box;">Layout Settings <br /><br />
Slider Size: 960 x 640<br />
Slider Size: 1366 x 768<br />
Scale To: Full Window (Flex Mode) <br />
Bleeding: 100% <br />
Max Width: 3000<br />
Max Height: 3000
Max Width: 10000<br />
Max Height: 10000
</div>
</div>
<div>
Expand Down
2 changes: 1 addition & 1 deletion js/jssor.slider.min.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "jssor-slider",
"version": "27.1.0",
"version": "27.2.0",
"description": "touch swipe image slider/slideshow/gallery/carousel/banner mobile responsive bootstrap",
"main": "js/jssor.slider.min.js",
"homepage": "https://www.jssor.com",
Expand Down
2 changes: 1 addition & 1 deletion transitions/slideshow-transition-builder-controller.min.js

Large diffs are not rendered by default.

0 comments on commit e24a778

Please sign in to comment.