タグ

2012年4月14日のブックマーク (3件)

  • position: fixedもmetaタグも使わずにiPhone用ウェブサイトをアプリっぽく見せる(twitterっぽく) - Yusuke Sugomori's Blog

    9/22 追記 改)position: fixedもmetaタグも使わずにiPhone用ウェブサイトをアプリっぽく見せる(twitterっぽく)にて、 よりすっきりしたコードを紹介しています。ぜひそちらを参考にしてください。 まずはiPhoneのSafariでtwitterにアクセスしてみてください。普通のウェブサイトとはスクロールしたときの動きが何か違います。特徴的なのは、 ヘッダーが固定されている 一番上までスクロールしてもURLバーが出ない 代わりに、スクロールされるのはタイムライン部分だけヘッダーの固定についてはiOS5からCSSの position: fixed がサポートされたので困ることはなくなるかもしれませんが、これでも一番上までスクロールするとURLバーが見えてしまいます。 一方、twitterではiOS4でもヘッダーは固定され、かつ一番上までスクロールしてもURLバーは

    position: fixedもmetaタグも使わずにiPhone用ウェブサイトをアプリっぽく見せる(twitterっぽく) - Yusuke Sugomori's Blog
    tkawa
    tkawa 2012/04/14
    Twitterが使っている手法。なんかスクロールに違和感がある気も
  • 画像置換に -9999px はつかわない

    画像置換という言葉を知っているでしょうか?テキストを「text-indent:-9999px」と指定して、画面の外に飛ばしてしまい背景画像をその代わりに表示する技術です。 画像置換の歴史 画像置換は長いこと使われているCSSのテクニックに1つでしょう。では、このテクニック自体はどのようにして、生まれてきたのでしょうか? 意外にも、このテクニックは元はC.Z.Robertson氏が1999年に考案し、それを「Todd Fahner」氏やTwitterのDouglas Bowman氏がチュートリアルで説明し、一般的に広めたものです。この時点ではテキストを非表示にするために「display:none」を利用しており、音声リーダーでは読み上げされないなどの問題がありました。 その後、このアクセシビリティ上の問題を解決するために「-9999px」というテクニックを生み出したのです。 現在の画像置換

    tkawa
    tkawa 2012/04/14
  • Kickstrap: Enhancements for Bootstrap

    Kickstrap A full version of Twitter's Bootstrap with themes, enhancements, and other goodies. Issues · · Follow @yourwebsitesUX Tweet Release Candidate due April 15th Kickstrap v. 0.9 RC will be released April 15th. Until v. 1.0, I recommend only using Kickstrap in development environments. There will be several modifications made to the overall logic of Kickstrap's implementation and workflow dur

    tkawa
    tkawa 2012/04/14