mirror of
https://github.com/futurepress/epub.js.git
synced 2025-10-04 15:09:16 +02:00
IE css fixes
This commit is contained in:
parent
b329e634ef
commit
38a88f6cc9
4 changed files with 169 additions and 150 deletions
|
@ -30,9 +30,11 @@ body {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
-webkit-transition: -webkit-transform .4s, width .2s;
|
-webkit-transition: -webkit-transform .4s, width .2s;
|
||||||
-moz-transition: -webkit-transform .4s, width .2s;
|
-moz-transition: -webkit-transform .4s, width .2s;
|
||||||
|
-ms-transition: -webkit-transform .4s, width .2s;
|
||||||
|
|
||||||
-moz-box-shadow: inset 0 0 50px rgba(0,0,0,.1);
|
-moz-box-shadow: inset 0 0 50px rgba(0,0,0,.1);
|
||||||
-webkit-box-shadow: inset 0 0 50px rgba(0,0,0,.1);
|
-webkit-box-shadow: inset 0 0 50px rgba(0,0,0,.1);
|
||||||
|
-ms-box-shadow: inset 0 0 50px rgba(0,0,0,.1);
|
||||||
box-shadow: inset 0 0 50px rgba(0,0,0,.1);
|
box-shadow: inset 0 0 50px rgba(0,0,0,.1);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -50,6 +52,7 @@ body {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
-webkit-transition: opacity .5s;
|
-webkit-transition: opacity .5s;
|
||||||
-moz-transition: opacity .5s;
|
-moz-transition: opacity .5s;
|
||||||
|
-ms-transition: opacity .5s;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -84,6 +87,7 @@ body {
|
||||||
/* margin: 1px -1px -1px 1px; */
|
/* margin: 1px -1px -1px 1px; */
|
||||||
-moz-box-shadow: inset 0 0 6px rgba(155,155,155,.8);
|
-moz-box-shadow: inset 0 0 6px rgba(155,155,155,.8);
|
||||||
-webkit-box-shadow: inset 0 0 6px rgba(155,155,155,.8);
|
-webkit-box-shadow: inset 0 0 6px rgba(155,155,155,.8);
|
||||||
|
-ms-box-shadow: inset 0 0 6px rgba(155,155,155,.8);
|
||||||
box-shadow: inset 0 0 6px rgba(155,155,155,.8);
|
box-shadow: inset 0 0 6px rgba(155,155,155,.8);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -150,6 +154,7 @@ body {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
-webkit-transition: -webkit-transform .5s;
|
-webkit-transition: -webkit-transform .5s;
|
||||||
-moz-transition: -moz-transform .5s;
|
-moz-transition: -moz-transform .5s;
|
||||||
|
-ms-transition: -moz-transform .5s;
|
||||||
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
@ -164,6 +169,7 @@ body {
|
||||||
/* left: 300px; */
|
/* left: 300px; */
|
||||||
-webkit-transform: translate(300px, 0);
|
-webkit-transform: translate(300px, 0);
|
||||||
-moz-transform: translate(300px, 0);
|
-moz-transform: translate(300px, 0);
|
||||||
|
-ms-transform: translate(300px, 0);
|
||||||
}
|
}
|
||||||
|
|
||||||
#main.single {
|
#main.single {
|
||||||
|
@ -185,6 +191,7 @@ body {
|
||||||
height: 14px;
|
height: 14px;
|
||||||
-moz-box-shadow: 0px 1px 3px rgba(0,0,0,.6);
|
-moz-box-shadow: 0px 1px 3px rgba(0,0,0,.6);
|
||||||
-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,.6);
|
-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,.6);
|
||||||
|
-ms-box-shadow: 0px 1px 3px rgba(0,0,0,.6);
|
||||||
box-shadow: 0px 1px 3px rgba(0,0,0,.6);
|
box-shadow: 0px 1px 3px rgba(0,0,0,.6);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -259,6 +266,9 @@ input::-webkit-input-placeholder {
|
||||||
input:-moz-placeholder {
|
input:-moz-placeholder {
|
||||||
color: #454545;
|
color: #454545;
|
||||||
}
|
}
|
||||||
|
input:-ms-placeholder {
|
||||||
|
color: #454545;
|
||||||
|
}
|
||||||
|
|
||||||
#divider {
|
#divider {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
@ -296,6 +306,7 @@ input:-moz-placeholder {
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
-webkit-transition: visibility 0 ease .5s;
|
-webkit-transition: visibility 0 ease .5s;
|
||||||
-moz-transition: visibility 0 ease .5s;
|
-moz-transition: visibility 0 ease .5s;
|
||||||
|
-ms-transition: visibility 0 ease .5s;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -306,6 +317,7 @@ input:-moz-placeholder {
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
-webkit-transition: visibility 0 ease 0;
|
-webkit-transition: visibility 0 ease 0;
|
||||||
-moz-transition: visibility 0 ease 0;
|
-moz-transition: visibility 0 ease 0;
|
||||||
|
-ms-transition: visibility 0 ease 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sidebar.open #tocView {
|
#sidebar.open #tocView {
|
||||||
|
@ -379,6 +391,7 @@ input:-moz-placeholder {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
-webkit-user-select: none;
|
-webkit-user-select: none;
|
||||||
-moz-user-select: none;
|
-moz-user-select: none;
|
||||||
|
-ms-user-select: none;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -543,6 +556,7 @@ input:-moz-placeholder {
|
||||||
background: rgba(255,255,255,0.8);
|
background: rgba(255,255,255,0.8);
|
||||||
-webkit-transition: all 0.3s;
|
-webkit-transition: all 0.3s;
|
||||||
-moz-transition: all 0.3s;
|
-moz-transition: all 0.3s;
|
||||||
|
-ms-transition: all 0.3s;
|
||||||
transition: all 0.3s;
|
transition: all 0.3s;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -612,6 +626,7 @@ input:-moz-placeholder {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
-webkit-transition: all 0.3s;
|
-webkit-transition: all 0.3s;
|
||||||
-moz-transition: all 0.3s;
|
-moz-transition: all 0.3s;
|
||||||
|
-ms-transition: all 0.3s;
|
||||||
transition: all 0.3s;
|
transition: all 0.3s;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -683,13 +698,16 @@ input:-moz-placeholder {
|
||||||
#main {
|
#main {
|
||||||
-webkit-transform: translate(0, 0);
|
-webkit-transform: translate(0, 0);
|
||||||
-moz-transform: translate(0, 0);
|
-moz-transform: translate(0, 0);
|
||||||
|
-ms-transform: translate(0, 0);
|
||||||
-webkit-transition: -webkit-transform .3s;
|
-webkit-transition: -webkit-transform .3s;
|
||||||
-moz-transition: -moz-transform .3s;
|
-moz-transition: -moz-transform .3s;
|
||||||
|
-ms-transition: -moz-transform .3s;
|
||||||
}
|
}
|
||||||
|
|
||||||
#main.closed {
|
#main.closed {
|
||||||
-webkit-transform: translate(260px, 0);
|
-webkit-transform: translate(260px, 0);
|
||||||
-moz-transform: translate(260px, 0);
|
-moz-transform: translate(260px, 0);
|
||||||
|
-ms-transform: translate(260px, 0);
|
||||||
}
|
}
|
||||||
|
|
||||||
#titlebar {
|
#titlebar {
|
||||||
|
|
|
@ -31,6 +31,12 @@
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<!-- File Storage -->
|
||||||
|
<!-- <script src="js/libs/localforage.min.js"></script> -->
|
||||||
|
|
||||||
|
<!-- Full Screen -->
|
||||||
|
<script src="js/libs/screenfull.min.js"></script>
|
||||||
|
|
||||||
<!-- Render -->
|
<!-- Render -->
|
||||||
<script src="js/epub.min.js"></script>
|
<script src="js/epub.min.js"></script>
|
||||||
|
|
||||||
|
@ -44,14 +50,8 @@
|
||||||
<script src="js/plugins/search.js"></script>
|
<script src="js/plugins/search.js"></script>
|
||||||
|
|
||||||
<!-- Highlights -->
|
<!-- Highlights -->
|
||||||
<script src="js/libs/jquery.highlight.js"></script>
|
<!-- <script src="js/libs/jquery.highlight.js"></script> -->
|
||||||
<script src="js/hooks/extensions/highlight.js"></script>
|
<!-- <script src="js/hooks/extensions/highlight.js"></script> -->
|
||||||
|
|
||||||
<!-- File Storage -->
|
|
||||||
<!-- <script src="js/libs/fileStorage.min.js"></script> -->
|
|
||||||
|
|
||||||
<!-- Full Screen -->
|
|
||||||
<script src="js/libs/screenfull.min.js"></script>
|
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
@ -111,7 +111,7 @@
|
||||||
<h3>Settings</h3>
|
<h3>Settings</h3>
|
||||||
<div>
|
<div>
|
||||||
<p>
|
<p>
|
||||||
<input type="checkbox" id="sidebarReflow" name="sidebarReflow">Reflow text when sidebars are open.</input>
|
<input type="checkbox" id="sidebarReflow" name="sidebarReflow">Reflow text when sidebars are open.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="closer icon-cancel-circled"></div>
|
<div class="closer icon-cancel-circled"></div>
|
||||||
|
|
|
@ -42,19 +42,20 @@ EPUBJS.reader.ControlsController = function(book) {
|
||||||
$fullscreen.on("click", function() {
|
$fullscreen.on("click", function() {
|
||||||
screenfull.toggle($('#container')[0]);
|
screenfull.toggle($('#container')[0]);
|
||||||
});
|
});
|
||||||
|
if(screenfull.raw) {
|
||||||
document.addEventListener(screenfull.raw.fullscreenchange, function() {
|
document.addEventListener(screenfull.raw.fullscreenchange, function() {
|
||||||
fullscreen = screenfull.isFullscreen;
|
fullscreen = screenfull.isFullscreen;
|
||||||
if(fullscreen) {
|
if(fullscreen) {
|
||||||
$fullscreen
|
$fullscreen
|
||||||
.addClass("icon-resize-small")
|
.addClass("icon-resize-small")
|
||||||
.removeClass("icon-resize-full");
|
.removeClass("icon-resize-full");
|
||||||
} else {
|
} else {
|
||||||
$fullscreen
|
$fullscreen
|
||||||
.addClass("icon-resize-full")
|
.addClass("icon-resize-full")
|
||||||
.removeClass("icon-resize-small");
|
.removeClass("icon-resize-small");
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
$settings.on("click", function() {
|
$settings.on("click", function() {
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue