続・iOSのSafariで特定のfont-sizeのときの謎の隙間 - Webtech Walker
前書いたiOSのSafariで幅計算がおかしくなる件、もうちょい調査してみた。 どうもfont-sizeが11px、10px、9pxのときにマルチバイト一文字につき、offsetWidthの値がそれぞれ1pxづつ大きい値になるというバグっぽい。 「あ」の文字のspan要素のoffsetWidthをJSで取得するデモ。 DEMO これiPhoneで見るとこうなる。 なんかIEでもfont-sizeが11px指定のときに12pxで表示されるというバグがあった気がするけど、このバグはさらに凶悪で、フォントサイズは指定したサイズになるけどoffsetWidthだけ指定のサイズより大きくなるというもの。それであのようなずれが生じるみたいです。 JSでoffsetWidthの値の変化がとれるということはバグがあるかどうか判定できそうだということでやってみた。 var mbFontsizeWidthCa
ke-tai.org > Blog Archive > 90秒で理解するiPhone JavaScript（マルチタッチ編）
90秒で理解するiPhone JavaScript（マルチタッチ編） Tweet 2008/7/28 月曜日 matsui Posted in iPhone | 10 Comments » 仕事でiPhone向けサイトを作ることになるかもしれず、色々と調査中です。 まずはiPhoneならではの機能ということで、マルチタッチについて調べてみました。 ここまでわかったことをメモ代わりに記載したいと思います。 今回はひとまず座標の取得までです。 ゆくゆくは、こちらのムービーのように凝ったギミックを作りこみたいと思っています。 マルチタッチの座標を取得するのは思ったより簡単で、抑えるポイントは4つだけです。 Safari自体のスクロールや拡大・縮小は動作しないようにした方が無難 タッチのイベントは、リスナーまたは「onTouchXXX」から取得 タッチ数は「event.touches.length
iOSのSafariで特定のfont-sizeのときの謎の隙間 - Webtech Walker
iOSのSafariでなぜか特定のfont-size（11px、10px、9px）のときだけマルチバイトの幅計算がおかしいのか、折り返し位置がずれるという件。 DEMO これをiPhoneで見るとこんな感じになる。 こんな感じ。11px、10px、9pxのときに右側に隙間が空いてるがわかると思います。これは特にpaddingとかとってるわけではなくて、このfont-sizeのときだけなぜか隙間が空くんです。8pxは大丈夫なので11px以下というわけではないみたい。さらにマルチバイトでなければ隙間はできない。謎。 ちなみにiOS4.3でも直ってなかった。Androidは大丈夫。 解決方法知ってる人がいたら教えてほしい。 追記：letter-spacing: -0.001em; で直るっぽい
iPhone/iPod touchのSafariやUIWebViewのJavaScriptで使えるタッチイベントのメモ - 電子趣味の部屋
画面の固定 スクロールすると座標計算がややこしくなるので、画面を固定する。 ・横方向 metaタグを追加 <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />・縦方向 touchmoveイベント中でevent.preventDefault()を実行する。 イベントの種類 onTouchStart onTouchMove onTouchEnd onTouchCancel イベントの設定方法 addEventListenerで設定する。 document.addEventListener("touchstart", touchHandler, false); document.addEventList
Safariのツールバーを出なくする - iPod touchで遊ぶ (iPhoneもね）
すでにいくつかのサイトでも話題になっているが、iPhone/iPod touchのSafariでwebアプリを開いたときに、上のアドレスバーや、下のメニューバーを出なくする設定が発見されている。 <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />上の設定が、webアプリモードにするもので、これを書いた場合、ホーム画面にアイコンを置いたブックマークから起動すると、webアプリモードになり、アドレスバーやメニューバーが表示されなくなる。 下の設定は、一番上の電波状態や時刻が表示されているバーの部分を、半透明にする設定で、上のアプリモードの設定があるときのみ有効のようだ
iPhoneのSafari対応について - プログラミングノート
Safari対応サイトを作った際にあまり調べていなかったので、ちょっと調べてみました。OS 3.0から使える機能も増えていて、簡単なアプリならネイティブアプリ作らなくても実現できますね。選択肢が増えるのは良いことです。 ブラウザの仕様 Web標準技術が使えるので、PCサイト開発の延長で作れる。 ブラウザ互換などは気にしなくて良いので、HTML5+CSS3で作りこむのもあり。 制限 リソースの制限 デコード後のGIF, PNG, TIFF 2MBまで デコード後のJPEG 32MB アニメーションGIF 2MBまで Canvas 要素 2MB その他リソースファイルはそれぞれ10MBまで その他制限 cookieサポート Flash, Javaアプレット, SVG(サポートされているようです), XSLTは非サポート サードパーティー製のプラグインは非サポート JavaScript実行時間
iPad用のサイト作成に覚えておくこと色々:phpspot開発日誌
Technical Note TN2262: Preparing Your Web Content for iPad appleのサイトにiPad用のサイト作成準備のためのページが上がっていました。 USの発売日に３０万台発売ということで、日本でもそれなりに売れることが予想出来ますが、今後iPad用にページを最適化する場合に覚えておくとよさそうです。 メモついでにご紹介。 UserAgent UAはiPadが入ってWebKitベースなので、AppleWebKit となるみたいです。 Mozilla/5.0 (iPad; U; CPU OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B334b Safari/531.21.10 プラグインは使わない Fla
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
