JavaScriptでAndroid4.4対応のUI実装のとき思い出す非対応機能
2018年前半、まだクライアントワークで対応することがあるAndroid4.4でサポートされていないJavaScriptやCSSの備忘録です。 端末やOSのシェア率を調べることができるスマタブinfoによると、 2018 …
「スマートフォン」の記事一覧
ピンチイン（ピンチアウト）の倍率を取得するJavaScript
pinch-in / pinch-out で、拡大縮小の割合を計算するスクリプトです。 写真を拡大縮小して見るスクリプトの一部です。 サンプルは、タッチデバイスで動作します。 マルチタッチを感知すると白背景にかわり、ピン …
iOS Safari で fixed 配下の overflow-scrolling要素がフリーズするバグ
iOS Safari 8, 9, 10 では overflow-scrolling: touch; を指定している要素の親に position: fixed; を指定している要素があると 要素を最後までスクロールしたあと …
フォーカス中にループを実行させるJavascript
フォームにフォーカスしている間だけループで任意の処理を実行し続けるJavascriptを作りました。 スマートフォンの、日本語入力中リアルタイム文字カウントなどに使えます。 ver1.7以上のjQueryが必要です。 i …
YoutubeやGoogleMapsをリキッド表示にするCSS
absoluteで絶対位置配置した要素のサイズを相対指定の応用で YoutubeやGoogleMapsAPIなどiframeで埋め込む要素を縦横比固定でリキッド表示するCSSです。 スマートフォンやレスポンシブ対応のとき …
localhostで構築中のWordPressをWi-Fi接続したスマートフォンで確認
2014年以降、レスポンシブデザインが増えてきたので Wordpressの表示や動作の確認も、開発しているパソコンのブラウザだけでなくスマートフォンやタブレットなど多岐にわたるようになりました。 そんなとき、スマホサイト …
半角を0.5文字カウントしてmaxlengthを設定するJavascript
スマートフォン用に、全角文字の場合は1文字、半角文字の場合は0.5文字でカウントして制限文字数をもうけるJavascriptを作りました。 ver1.7以上のjQueryが必要です。 iOS 7 + Android 2. …
拡大縮小もできてiPhoneでフォームにforcusしたときズームしないようにする
iOSのSafariには、 フォーム要素へフォーカスするとページ全体が拡大され、入力が終わっても拡大されたままという ありがた迷惑な独自仕様があります。 （ダブルタップやピンチインすると元の倍率に戻せますが、毎回なので煩 …
iPhoneは -webkit-transform: translate… とその子孫に position: fixed; が効かない
<a href="http://demos seroquel 50 mg.jquerymobile.com/1.4.3/panel/”>jQuery mobileのPanelのpushの …
スマートフォンで撮影した写真をjavascriptのFile APIでinputへセット
iOS6のSafariから対応の、HTML5のFileReaderをつかって スマートフォンのカメラを起動し、撮影した画像を <input type=”file”>へセットしたり &l …