yetangitu/canvas-based-HTML5-Comic-Book-Reader
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

added basic styling to the loading status box

Browse source
This commit is contained in:
Bala Clark 2010-07-10 17:34:27 +01:00
parent b23a6f26b2
commit 59bf8bcfc2
2 changed files with 16 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

4
ComicBook.js
View file

@ -131,7 +131,7 @@ function ComicBook(id, srcs, opts) {
var i = 0; // the current page counter for this method var i = 0; // the current page counter for this method
$(canvas).before('<div id="status"><p></p></div>'); $(canvas).after('<div id="status"><p></p></div>');
// I am using recursion instead of a forEach loop so that the next image is // I am using recursion instead of a forEach loop so that the next image is
// only loaded when the previous one has completely finished // only loaded when the previous one has completely finished
@ -158,7 +158,7 @@ function ComicBook(id, srcs, opts) {
// start rendering the comic when the buffer level has been reached // start rendering the comic when the buffer level has been reached
if (loaded === buffer) { ComicBook.prototype.drawPage(); } if (loaded === buffer) { ComicBook.prototype.drawPage(); }
if (loaded === no_pages) { $("#status").remove(); } if (loaded === no_pages) { $("#status").fadeOut(150).remove(); }
}; };
} }

16
styles.css
View file

@ -1,5 +1,17 @@
body { body {
background-color: #000;
color: #fff;
font-size: 12px; font-size: 12px;
} }
#status {
background-color: #000;
color: #fff;
position: fixed;
top: 0;
right: 0;
background-color: #111;
margin: 5px;
padding: 8px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}