diff options
| author | Masahiro FUJIMOTO <mfujimot@gmail.com> | 2021-12-05 01:51:40 +0900 |
|---|---|---|
| committer | Masahiro FUJIMOTO <mfujimot@gmail.com> | 2021-12-13 22:52:57 +0900 |
| commit | 48e8f90e628c15e1678699454a27d74d48f0fd95 (patch) | |
| tree | 7c8644fdf9ed4c4cd5895648493871910d35ab71 /files/ja/web/css/-webkit-overflow-scrolling/index.html | |
| parent | dbd07415adace3594616b0a4a1863cf9d8a9983b (diff) | |
| download | translated-content-48e8f90e628c15e1678699454a27d74d48f0fd95.tar.gz translated-content-48e8f90e628c15e1678699454a27d74d48f0fd95.tar.bz2 translated-content-48e8f90e628c15e1678699454a27d74d48f0fd95.zip | |
WebKit 固有のプロパティを変換準備
Diffstat (limited to 'files/ja/web/css/-webkit-overflow-scrolling/index.html')
| -rw-r--r-- | files/ja/web/css/-webkit-overflow-scrolling/index.html | 87 |
1 files changed, 0 insertions, 87 deletions
diff --git a/files/ja/web/css/-webkit-overflow-scrolling/index.html b/files/ja/web/css/-webkit-overflow-scrolling/index.html deleted file mode 100644 index 9f5655ffa1..0000000000 --- a/files/ja/web/css/-webkit-overflow-scrolling/index.html +++ /dev/null @@ -1,87 +0,0 @@ ---- -title: '-webkit-overflow-scrolling' -slug: Web/CSS/-webkit-overflow-scrolling -tags: - - CSS - - CSS プロパティ - - Reference - - WebKit 拡張 - - リファレンス - - 標準外 -translation_of: Web/CSS/-webkit-overflow-scrolling ---- -<div>{{CSSRef}} {{Non-standard_header}}</div> - -<p><code>-webkit-overflow-scrolling</code> は <a href="/ja/docs/Web/CSS">CSS</a> のプロパティは、指定された要素で<ruby>惰性付き<rp> (</rp><rt>momentum-based</rt><rp>) </rp></ruby>のスクロールを使用するかどうかを制御します。</p> - -<p>{{cssinfo}}</p> - -<h2 id="Values" name="Values">値</h2> - -<dl> - <dt><code>auto</code></dt> - <dd>「通常」のスクロールで、タッチパネルから指を離すとすぐにコンテンツはスクロールが停止します。</dd> - <dt><code>touch</code></dt> - <dd>惰性付きのスクロールで、コンテンツはスクロールのジェスチャーが終了し、タッチパネルから指を離した後もスクロールを続けます。スクロールを続ける速度と期間は、スクロールのジェスチャーがどれだけすばやく行われたかによります。また、新しい重ね合わせコンテキストを生成します。</dd> -</dl> - -<h3 id="Formal_syntax" name="Formal_syntax">形式文法</h3> - -{{csssyntax}} - -<h2 id="Examples" name="Examples">例</h2> - -<h3 id="HTML">HTML</h3> - -<pre class="brush: html"><div class="scroll-touch"> - <p> - This paragraph has momentum scrolling - </p> -</div> -<div class="scroll-auto"> - <p> - This paragraph does not. - </p> -</div></pre> - -<h3 id="CSS">CSS</h3> - -<pre class="brush: css">div { - width: 100%; - overflow: auto; -} - -p { - width: 200%; - background: #f5f9fa; - border: 2px solid #eaf2f4; - padding: 10px; -} - -.scroll-touch { - -webkit-overflow-scrolling: touch; /* Lets it scroll lazy */ -} - -.scroll-auto { - -webkit-overflow-scrolling: auto; /* Stops scrolling immediately */ -} -</pre> - -<h3 id="Result" name="Result">結果</h3> - -<p>{{EmbedLiveSample('Examples')}}</p> - -<h2 id="Specifications" name="Specifications">仕様書</h2> - -<p>仕様書では定義されていません。 Apple には <a href="https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html#//apple_ref/css/property/-webkit-overflow-scrolling">Safari CSS Reference に説明</a>があります。</p> - -<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat("css.properties.-webkit-overflow-scrolling")}}</p> - -<h2 id="See_Also" name="See_Also">関連情報</h2> - -<ul> - <li><a href="http://css-tricks.com/snippets/css/momentum-scrolling-on-ios-overflow-elements/">CSS-Tricks article with demo</a></li> - <li><a href="https://www.smashingmagazine.com/2018/08/scroll-bouncing-websites/">Smashing Magazine- describing the effect of scroll bouncing and how it works on different web browsers</a></li> -</ul> |