[技術討論] 點樣可以無顯示browser scrollbar ?

個客要求site landing page顯示一個animated site logo

inital 成logo 透明同埋放大
更住animate 到100%就不透明兼原有size

但個logo 放大時打過viewport 就會顯示browser scroll bar。 我想強制不顯示。
上網搵過話將body overflow:hidden 就得,但事實係唔得嘅
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.   <head>
  4.     <meta charset="utf-8">
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1">
  7.     <title>Downtown Chiropractic Limited 脊萃醫療</title>

  8.     <link rel="stylesheet" type="text/css" href="assets/css/style.css" />

  9.   </head>
  10.   <body>
  11.     <div class="wrapper logo-animate">
  12.     <a href="home.html"><img class="logo" src="assets/images/logo_sm.png" width=350 /></a>
  13.     </div>
  14.    
  15.   </body>
  16. </html>
複製代碼
  1. .body {
  2.     overflow: hidden;
  3. }

  4. .wrapper {
  5.     position: absolute;
  6.     top: 0;
  7.     left: 0;
  8.     width: 350px;
  9.     height: 175px;
  10.     bottom: 0;
  11.     right: 0;
  12.     margin: auto;
  13. }


  14. .logo {
  15.     animation-name: zoomin;
  16.     animation-duration: 1.5s;
  17.     animation-timing-function: ease-in;
  18.     animation-delay: 0;
  19. }


  20. @keyframes zoomin {
  21.     0% {
  22.         opacity: 0;
  23.         height: 500%;
  24.         width: 500%

  25.     }

  26.     100% {
  27.         opacity: 1;
  28.         height: 100%;
  29.         width: 100%;
  30.     }
  31. }
複製代碼

.body {
    overflow: hidden;
}

body前面請remove一點

TOP

<body>   change to <body class="body">

TOP

change to
gamezz 發表於 2017-2-27 15:06


留意, #2/#3只可選其一
兩樣一齊改哂會唔得

TOP

留意, #2/#3只可選其一
兩樣一齊改哂會唔得
KinChungE 發表於 2017-2-27 15:50


"淨咩丫,撈埋一齊丫笨"

body, .body
{
   overflow: hidden;
}

TOP

.body {
    overflow: hidden;
}

body前面請remove一點
KinChungE 發表於 2017-2-27 12:47



    @#@#@###¥#, 睇唔到個 dot

TOP

如果將Animation 部份轉用 transform:scale() 會唔會更好?
雖然舊browser未必睇唔到

TOP

如果將Animation 部份轉用 transform:scale() 會唔會更好?
雖然舊browser未必睇唔到
ho0406 發表於 2017-2-27 23:39


scale會一開出黎已經放大左, 唔會load左出黎再慢慢放大
其實scale支援既browser仲多過animation

TOP