Move code to the right place and give it a better style.
Highlight the background on hover.
This commit is contained in:
parent
6bb14af71c
commit
14eae7cb9f
@ -82,6 +82,7 @@ span#info {
|
||||
width: 350px;
|
||||
top: 62px;
|
||||
bottom: 18px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#sidebar.released {
|
||||
@ -90,7 +91,6 @@ span#info {
|
||||
-o-transition: left 0.25s ease-in-out 1s;
|
||||
-moz-transition: left 0.25s ease-in-out 1s;
|
||||
-webkit-transition: left 0.25s ease-in-out 1s;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#sidebar.pinned,
|
||||
@ -105,9 +105,14 @@ span#info {
|
||||
#pinIcon {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 56px;
|
||||
width: 11px;
|
||||
height: 12px;
|
||||
right: 55px;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
background: center no-repeat;
|
||||
}
|
||||
|
||||
#pinIcon:hover {
|
||||
background-color: rgba(255,255,255,0.35);
|
||||
}
|
||||
|
||||
#pinIcon.released {
|
||||
|
@ -34,45 +34,6 @@
|
||||
|
||||
</head>
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
function pinCleanup(sidebar, pinIcon) {
|
||||
sidebar.className = sidebar.className.replace( /(?:^|\s)released(?!\S)/ , '' );
|
||||
sidebar.className = sidebar.className.replace( /(?:^|\s)pinned(?!\S)/ , '' );
|
||||
pinIcon.className = pinIcon.className.replace( /(?:^|\s)released(?!\S)/ , '' );
|
||||
pinIcon.className = pinIcon.className.replace( /(?:^|\s)pinned(?!\S)/ , '' );
|
||||
}
|
||||
|
||||
function pinActivate(sidebar, pinIcon) {
|
||||
sidebar.className += " pinned";
|
||||
pinIcon.className += " pinned";
|
||||
}
|
||||
|
||||
function pinDeactivate(sidebar, pinIcon) {
|
||||
sidebar.className += " released";
|
||||
pinIcon.className += " released";
|
||||
}
|
||||
|
||||
function pinToggle() {
|
||||
var sidebar = document.getElementById("sidebar");
|
||||
var pinIcon = document.getElementById("pinIcon");
|
||||
|
||||
var pinState = pinIcon.className;
|
||||
|
||||
pinCleanup(sidebar, pinIcon);
|
||||
|
||||
if (pinState == "pinned")
|
||||
pinDeactivate(sidebar, pinIcon);
|
||||
else
|
||||
pinActivate(sidebar, pinIcon);
|
||||
|
||||
sidebar.className = sidebar.className.trim();
|
||||
pinIcon.className = pinIcon.className.trim();
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<body>
|
||||
<div id="controls">
|
||||
<button id="previous" onclick="PDFView.page--;" oncontextmenu="return false;">
|
||||
@ -161,7 +122,7 @@
|
||||
|
||||
<div id="sidebar" class="released">
|
||||
<div id="sidebarBox">
|
||||
<div id="pinIcon" class="released" onClick="javascript:pinToggle()"></div>
|
||||
<div id="pinIcon" class="released" onClick="PDFView.pinSidebar()"></div>
|
||||
<div id="sidebarScrollView">
|
||||
<div id="sidebarView"></div>
|
||||
</div>
|
||||
|
@ -170,6 +170,7 @@ var PDFView = {
|
||||
currentScale: kUnknownScale,
|
||||
currentScaleValue: null,
|
||||
initialBookmark: document.location.hash.substring(1),
|
||||
pinState: false,
|
||||
|
||||
setScale: function pdfViewSetScale(val, resetAutoSettings) {
|
||||
if (val == this.currentScale)
|
||||
@ -572,6 +573,24 @@ var PDFView = {
|
||||
break;
|
||||
}
|
||||
},
|
||||
|
||||
pinSidebar: function pdfViewPinSidebar() {
|
||||
|
||||
var sidebar = document.getElementById("sidebar");
|
||||
var pinIcon = document.getElementById("pinIcon");
|
||||
|
||||
sidebar.className = sidebar.className.replace( /(?:^|\s)released(?!\S)/ , '' );
|
||||
sidebar.className = sidebar.className.replace( /(?:^|\s)pinned(?!\S)/ , '' );
|
||||
pinIcon.className = pinIcon.className.replace( /(?:^|\s)released(?!\S)/ , '' );
|
||||
pinIcon.className = pinIcon.className.replace( /(?:^|\s)pinned(?!\S)/ , '' );
|
||||
|
||||
var newClass = this.pinState ? " pinned" : " released";
|
||||
|
||||
sidebar.className += newClass;
|
||||
pinIcon.className += newClass;
|
||||
|
||||
this.pinState = !this.pinState;
|
||||
},
|
||||
|
||||
getVisiblePages: function pdfViewGetVisiblePages() {
|
||||
var pages = this.pages;
|
||||
|
Loading…
x
Reference in New Issue
Block a user