added toolbars...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2013-01-22 01:26:37 +04:00
parent 1102bf96b7
commit d43d1c4c4d
2 changed files with 55 additions and 0 deletions

View File

@ -36,6 +36,9 @@ $(document).ready(function(){
return true
}
})
$('.button.cover').click(goToMagazineCover)
$('.button.next-article').click(nextArticle)
$('.button.prev-article').click(prevArticle)
// XXX add splash screen...
// XXX
@ -454,6 +457,14 @@ function createPage(article, template){
<div class="viewer">
<!-- XXX add toolbars here... -->
<div class="top-toolbar">
mooo
<div class="button cover">Issue Cover</div>
<div class="button prev-article">Prev Article</div>
<div class="button next-article">Next Article</div>
</div>
<div class="bottom-toolbar">
</div>
<div class="scaler">
<div class="aligner">

View File

@ -133,11 +133,55 @@ body {
background: silver;
}
.top-toolbar, .bottom-toolbar {
display: block;
position: absolute;
z-index: 1000;
text-align: center;
overflow: hidden;
background: black;
opacity: 0.4;
height: 50px;
left: 0px;
}
.top-toolbar {
top: 0px;
width: 100%;
}
.bottom-toolbar {
bottom: 0px;
width: 100%;
}
.button {
display: inline-block;
color: white;
font-size: 25px;
font-weight: bold;
cursor: hand;
vertical-align: center;
width: auto;
margin-left: 20px;
margin-right: 20px;
}
/* modes */
.page-view-mode.viewer {
}
.page-view-mode .top-toolbar,
.page-view-mode .bottom-toolbar {
height: 0px;
}
.page-view-mode .page .content {
}
.page-view-mode .current.page .content {