stop the flicker

11 years ago · 6088ca23e6
2 changed files with 11 additions and 0 deletions
--- a/docs-assets/css/docs.css
+++ b/docs-assets/css/docs.css
@ -544,6 +544,11 @@ hr {
    -webkit-transition: background-image 0.1s linear;
    transition: background-image 0.1s linear;
  }
+  .device:after {
+    content: '';
+    background-image: url("../img/iphone5s.png");
+    opacity: 0;
+  }
  .device.device-fixed {
    position: fixed;
    right: auto;
--- a/lib/sass/docs.scss
+++ b/lib/sass/docs.scss
@ -590,6 +590,12 @@ hr {
    background-repeat: no-repeat;
    @include transition(background-image .1s linear);

+    // Pre-load device backgrounds so we stop the flicker.
+    &:after {
+      content: '';
+      background-image: url("../img/iphone5s.png");
+      opacity: 0;
+    }
    &.device-fixed {
      position: fixed;
      right: auto;