Skip to content

Commit

Permalink
improved demo
Browse files Browse the repository at this point in the history
  • Loading branch information
@nicolas-t
nicolas-t committed Jul 19, 2015
1 parent c22c0e0 commit 4f5b79b
Show file tree
Hide file tree
Showing 10 changed files with 39 additions and 27 deletions.
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": "chocolat",
"version": "0.4.7",
"version": "0.4.8",
"main": [
"dist/css/chocolat.css",
"dist/js/jquery.chocolat.js"
Expand Down
8 changes: 5 additions & 3 deletions dist/css/chocolat.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,7 @@ html, body, div, span{
height:50px;
overflow: hidden;
z-index: 17;
margin-bottom: 10px;
}
.chocolat-wrapper .chocolat-close{
width:50px;
Expand All @@ -119,14 +120,15 @@ html, body, div, span{
bottom:0;
left: 0;
right: 0;
line-height:50px;
height:50px;
line-height:40px;
height:40px;
font-size:12px;
z-index: 17;
padding-left: 15px;
padding-right: 15px;
background: rgba(0, 0, 0, 0.2);
text-align: right;
margin-top: 10px;
}
.chocolat-wrapper .chocolat-set-title{
display: inline-block;
Expand All @@ -144,7 +146,7 @@ html, body, div, span{
}
.chocolat-wrapper .chocolat-fullscreen{
width: 16px;
height: 50px;
height: 40px;
background: url(../images/fullscreen.png) 50% 50% no-repeat;
display: block;
margin:auto;
Expand Down
Binary file added dist/images/fullscreen-black.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
32 changes: 20 additions & 12 deletions dist/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,13 +8,20 @@
<style>
body {
text-align: center;
font-family: Arial;
font-size: 12px;
}
h2 {
padding-top:20px;
font-size: 14px;
font-weight: normal;
border-top:1px solid #eeeeee;
}
a {
border:0;
color: #2645FF;
text-decoration: none;
}
</style>
<title>Chocolat — demo</title>
<script>
Expand Down Expand Up @@ -75,40 +82,41 @@ <h2>
</div>

<h2>
Display in a container, looping :
Display in a container, cover, with thumbnails :
</h2>

<div id="example2" data-chocolat-title="set title">
<div id="example3" data-chocolat-title="set title">
<a class="chocolat-image" href="demo-images/3.jpg" title="Rose">
A
<img src="demo-images/3.jpg" style="width:75px; height:50px" alt="">
</a>
<a class="chocolat-image" href="demo-images/4.jpg" title="Black">
B
<img src="demo-images/4.jpg" style="width:75px; height:50px" alt="">
</a>
<a class="chocolat-image" href="demo-images/5.jpg" title="Yellow">
C
<img src="demo-images/5.jpg" style="width:75px; height:50px" alt="">
</a>
</div>
<!-- Container (notice the relative width) : -->
<div id="container1" style="width: 80%; max-width:1000px; height: 600px;background: #E0E0E0;margin:auto;"></div>
<div id="container2" style="width: 80%; max-width:1000px; height: 600px;background: #E0E0E0;margin:auto;"></div>

<h2>
Display in a container, cover, with thumbnails :
Display in a container, looping :
</h2>

<div id="example3" data-chocolat-title="set title">
<div id="example2" data-chocolat-title="set title">
<a class="chocolat-image" href="demo-images/3.jpg" title="Rose">
<img src="demo-images/3.jpg" style="width:75px; height:50px" alt="">
A
</a>
<a class="chocolat-image" href="demo-images/4.jpg" title="Black">
<img src="demo-images/4.jpg" style="width:75px; height:50px" alt="">
B
</a>
<a class="chocolat-image" href="demo-images/5.jpg" title="Yellow">
<img src="demo-images/5.jpg" style="width:75px; height:50px" alt="">
C
</a>
</div>
<!-- Container (notice the relative width) : -->
<div id="container2" style="width: 80%; max-width:1000px; height: 600px;background: #E0E0E0;margin:auto;"></div>
<div id="container1" style="width: 80%; max-width:1000px; height: 600px;background: #E0E0E0;margin:auto;"></div>


<h2>
API use, in container, see code source <br>
Expand Down
6 changes: 3 additions & 3 deletions dist/js/jquery.chocolat.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -306,13 +306,13 @@
},

getOutMarginW : function() {
var left = this.elems.left.outerWidth();
var right = this.elems.right.outerWidth();
var left = this.elems.left.outerWidth(true);
var right = this.elems.right.outerWidth(true);
return left + right;
},

getOutMarginH : function() {
return this.elems.top.outerHeight() + this.elems.bottom.outerHeight();
return this.elems.top.outerHeight(true) + this.elems.bottom.outerHeight(true);
},

markup : function() {
Expand Down
2 changes: 1 addition & 1 deletion dist/js/jquery.chocolat.min.js
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "chocolat",
"version": "0.4.7",
"version": "0.4.8",
"description": " Responsive jQuery Lightbox Plugin",
"main": [
"css/chocolat.css",
Expand Down
8 changes: 5 additions & 3 deletions src/css/chocolat.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,7 @@ html, body, div, span{
height:50px;
overflow: hidden;
z-index: 17;
margin-bottom: 10px;
}
.chocolat-wrapper .chocolat-close{
width:50px;
Expand All @@ -119,14 +120,15 @@ html, body, div, span{
bottom:0;
left: 0;
right: 0;
line-height:50px;
height:50px;
line-height:40px;
height:40px;
font-size:12px;
z-index: 17;
padding-left: 15px;
padding-right: 15px;
background: rgba(0, 0, 0, 0.2);
text-align: right;
margin-top: 10px;
}
.chocolat-wrapper .chocolat-set-title{
display: inline-block;
Expand All @@ -144,7 +146,7 @@ html, body, div, span{
}
.chocolat-wrapper .chocolat-fullscreen{
width: 16px;
height: 50px;
height: 40px;
background: url(../images/fullscreen.png) 50% 50% no-repeat;
display: block;
margin:auto;
Expand Down
Binary file added src/images/fullscreen-black.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 3 additions & 3 deletions src/js/jquery.chocolat.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -306,13 +306,13 @@
},

getOutMarginW : function() {
var left = this.elems.left.outerWidth();
var right = this.elems.right.outerWidth();
var left = this.elems.left.outerWidth(true);
var right = this.elems.right.outerWidth(true);
return left + right;
},

getOutMarginH : function() {
return this.elems.top.outerHeight() + this.elems.bottom.outerHeight();
return this.elems.top.outerHeight(true) + this.elems.bottom.outerHeight(true);
},

markup : function() {
Expand Down

0 comments on commit 4f5b79b

Please sign in to comment.