html5-memo.com
negic
Recent Entries Reactでシンプルなwebサイトが作れそうなテンプレートを作った 2015/12/13 advent_calendar, react react-mixinのmixinファイルの中で 「_（アンダーライン）」をメソッド名の先頭に使ったらエラーはいた 2015/10/12 react, react-mixin webpack.configをCoffeeScriptで書く 2015/06/10 coffeescript, webpack CSSで印刷を禁止させる 2015/02/26 css, print Advent Calendar 2014 読むリスト 2014/12/15 advent_calendar all entries Tags adobe advent_calendar android asciiart audio audition book
Fixed Positioning in Mobile Browsers
Fixed positioned elements (typically headers or footers) are extremely common conventions for native mobile platforms, so naturally fixed elements found their way into mobile browsers. Web designers are used to fixing elements to the window using CSS’s position: fixed, however, in the land of mobile browsers, support for fixed positioning is far less universal and is way more quirky. I set up a de
iOS、Androidにおけるposition:fixed;の制限 | The Monaca Blog
こんにちは、鴨田です。 スマートフォンアプリを作成する際、 やはりタイトルバーやフッターメニューは欠かせないところです。 jQuery MobileやiUIなどのライブラリを使えば、大して苦労はしないのですが、 ライブラリを使いたくない場合もあると思います。 仮に独自で実装する場合は、上部と下部に固定する必要があり、 HTMLになじみのある人であれば、すぐに”position:fixed;”を使えばいいだろう、 と気づくと思います。 確かにそうなのですが、実は”position:fixed;”を使用するには、 ある程度の条件が存在します。 ■iOSの場合 iOS 5以降でしか対応していません。 ■Androidの場合 Android 2.2以降でしか対応していません。 また、viewportでuser-scalable=yesにしていると、 固定されず、”position
user-scalable=noとposition: fixedを使用すると、-webkit-transformが動かなくなる - jsdo.it - Share JavaScript, HTML5 and CSS
fixedなしバージョンはこちら。 http://jsrun.it/esperia/plhF ( http://jsdo.it/esperia/plhF ) ※jsrun.itの方か、Smart Phoneボタン押さないとちゃんとうごかないです Androidでuser-scalable=noの時、-webkit-transformを使って回転させる要素とは別の要素にposition: fixedをつけた場合、回転させたい要素にも影響する問題。 Android 2.2, 2.3で確認しました。position: fixedがあったら回転しません。なかったら意図した動作になります。 バグですかね… <!doctype html> <html> <head> <title></title> <meta name="viewport" content="user-scalable=no" />
iPhone、Android position:fixed 対応状況と対応方法 – LIQUID BLOG
iPhone、Androidなどのスマートフォンは、これまで position:fixed に対応していませんでした。 固定メニューの実装などに困っていたのですが、iOS 5で対応していました！ iOS 5 iPhoneやiPad、iPod TouchのMobile Safariは、iOS 5から position:fixed に対応しました！ 他にも、overflow:scroll などに対応しています。 via New Mobile Safari stuff in iOS5: position:fixed, overflow:scroll, new input type support, web workers, ECMAScript 5 Android 2.3 viewport で、content=”user-scalable=no” にすると対応できます。 Android 4.1
[スマートフォン]ヘッダーを固定配置にするJavaScript | サイブリッジラボブログ
はじめまして、今回初登場のアシスタントデザイナーのまこっちゃんです。 今後ともよろしくお願いいたします。 最近はスマートフォンサイト制作全盛期ですよね。今後はスマートフォンでリッチなサイトが、現れるのではないかとわくわくしています。 今回は、スマートフォンサイト制作中に躓いた固定ヘッダーにつきまして、『固定ヘッダーのJavaScriptは何がベストか』を考えていきます。 Mobile Webkit では【position:fixed;】が効かない！ 皆さんもPCサイトで一度は固定ヘッダーのサイトを制作された事があるかと思いますが、スマートフォンサイト制作で試された方もいらっしゃるのではないでしょうか。 PCサイトの固定ヘッダーで使用される【position:fixed;】がiPhone・iPadなどでは効かないという問題点に気をつけましょう。 iscroll まず、スマートフォン向けに使わ
![[スマートフォン]ヘッダーを固定配置にするJavaScript | サイブリッジラボブログ](https://cdn-ak-scissors.b.st-hatena.com/image/square/e82e2c864f8e014b0448593dedfe46486c4e1fd5/height=288;version=1;width=512/http%3A%2F%2Fwww.cybridge.jp%2Fimg%2Fcommon%2Flogo_cybridge_m.gif)
スマートフォンとposition:fixedのバグ
スマートフォンとposition:fixedのバグ iPhoneではiOS5からAndroidでは2.2からposition:fixedに対応されてスマートフォンでも固定配置が利用できつつあります。と思いきや色々と落とし穴が多いのでまとめておきます。 Androidではuser-scalable=noが必須 <meta name="viewport" content="user-scalable=no" /> Androidではviewportにuser-scalable=noの指定がないとposition:fixedが動きません。iPhoneではuser-scalable=noの指定がなくてもposition:fixedが動きますがけっこう挙動が微妙なのでuser-scalable=noは指定しておいたほうが良いでしょう。 サンプル（user-scalable=noあり） サンプル（us
Sencha Presents Sencha Touch
業界初のHTML5モバイルアプリ用フレームワーク Sencha Touchを使えばタッチスクリーンを装備したApple iOSや Android端末上でネイティブアプリのようなWebアプリが開発可能です。 Web標準技術に準拠 Sencha TouchはHTML5、CSS3、JavaScriptに特化した世界初のアプリケーションフレームワークです。SSencha Touchはこれらの技術が持つ力を最大限に引き出し、かつ柔軟で最適化されたアプリケーション開発を可能にします。Sencha Touchでは、音声や動画を組み込む為のコンポーネントやデータをオフラインでも利用可能にするlocalStorageプロキシーなどでHTML5の機能が利用されています。またSencha TouchのスタイルシートではCSS3を最大限活用してとても堅牢なスタイリングレイヤーを実現しています。 このライブラリはそ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
New community features for Google Chat and an update on Currents
YUIライブラリのScrollViewウィジェットを使ってiPhoneでもposition:fixed;が効いてるっぽく見せる