iOS8.1のSafariで$(window).height()を使うときの注意点 - 備忘録β版
表示領域を取得するときにお馴染みの $(window).height(); をiPhoneのSafariで考えなしに使うと痛い目を見るのでメモとして残しておく。 環境 iPhone 5s（iOS8.1） jQuery 1.11.1 注意すべきところ iPhoneのSafariが他のブラウザと比べて特徴的なのがURLバー（を含む上下のバー）がスクロールで小さくなったりする部分。これが本当にやっかいな挙動をする。 縦（portrait）表示の時は良いとして、問題なのは横（landscape）表示のとき。 URLバー（を含む上下のバー）は、縦から横に回転させたとき隠れ、スクロールすると表示される。 このURLバー（を含む上下のバー）が表示されているか否かで、表示領域の高さは変わるはずなのに、$(window).height()は同じ値を返す。 iPhone 5sで実行した時返す値 取得方法 UR
iOSはoverflow:hidden;でスクロールを無効にできない - Qiita
// スクロールを無効にする $(window).on('touchmove.noScroll', function(e) { e.preventDefault(); }); // スクロール無効を解除する $(window).off('.noScroll'); スマホの独自イベントのtouchmoveイベントを切ってスクロールを止める。 解除したい時はoffする。 イベント名に、.noScrollと名前を付けることで、他の部分でtouchmoveイベントを使っていたとしても、そのtouchmoveイベントまでイベントをoff()してしまうこともなく、.noScrollの名前のイベントのみをoff()することができる。 参考 iphoneでスクロールをさせない処理をする。 特定のエリアのみスクロールを無効にする方法 ドロワーメニューを左側に表示するときにコンテンツ側を固定するときなど //
iOSのMobile Safari上でのfocus()が妙な件を調べてみた - mixi engineer blog
こんにちは。ミクシィUX統括部にて、mixi Touchの開発を担当しております戸高です。 JavaScriptでの開発を行う事が多いのですが、iOSのブラウザ（Mobile Safari）のfocusの挙動について少しクセがあり、 調べてみましたので、お知らせいたします。 通常、<textarea>や<input type=”text”>等のフォーム要素に対して、フォーカスを与えたい場合、focus()メソッドを使用します。 iOSのブラウザ（以下、Mobile Safari）にて、以下のコードを実行してみます。 （分かりやすい様にjQueryを使用させて頂きました） なお、検証端末にはiPhone4S iOS5.0(9A334)を使用しています。 HTML <!DOCTYPE html> <html> <head> <meta http-equiv=”Content-Type” con
iOS8のバグ-webkit-overflow-scrollingで要素が消える不具合 | 2eb
iOSで慣性スクロールを有効にするCSS「-webkit-overflow-scrolling:touch;」を追加するとiOS8で発生することがある要素が消えるバグとその解決方法を紹介しています。iPhoneやiPadなど、iOSで慣性スクロールを有効にするCSS「-webkit-overflow-scrolling:touch;」を追加することで、疑似フレームを使用した要素も滑らかにスクロールさせることができます。 操作性が格段によくなるので、是非とも指定したいプロパティなのですが…複数の条件が重なると不具合が発生してしまいます。 発動条件は［iOS8でページ読み込み時に非表示の要素に-webkit-overflow-scrolling:touch;を指定している］場合のようで（実際はもっと複雑かも）、スクロールしようとタッチした瞬間にその要素が消えてしまうという悲惨なバグです！！:
iOS8 Safari -webkit-overflow-scrolling: touch; issue
I'm having this same issue! So far I can't find a true solution, but there is a less-than-ideal workaround: Assuming #container has the -webkit-overflow-scrolling: touch property set, this jQuery should help you out: $('#container').css('-webkit-overflow-scrolling','auto'); Or for javascript (untested): document.getElementById('container').style.webkitOverflowScrolling = 'auto'; This will disable
ソシオメディア | iOS6 Mobile Safari : ローテーションで余白が生じる現象への対処
はじめは問題なく表示されているが… デバイスを一度横向きにして戻すと余白ができる スマートフォンの普及にともない、スマートフォン向けウェブアプリケーションのUIデザインを依頼いただくことが多くなってきました。 先日、ある一般消費者向け検索サービスのスマートフォン対応に際し、UIデザインとプロトタイプ制作のお手伝いをさせていただきました。 ちょうど同時期に iOS6 のリリースがあったのですが、プロトタイプのコーディングをしているなかで、「端末を回転させているうちに余計な余白ができてしまう」という iOS6 特有の不具合に出くわしました。 スマートフォン向けのいくつかのウェブサイト/アプリケーションに同様の現象が見られましたので、不具合解消の一助になればと思い、現象の発生条件と対処法を紹介させていただきます。 iOS6 の Mobile Safari で、画面をランドスケープ表示（横向き）か
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://blog.bluearrowslab.com/smartphone/topicks/190/