2013年8月28日のブックマーク (4件)

  • スマートフォンサイト制作にdisplay:tableとdisplay:table-cellが便利!

    2012/10/18:画像に一部誤りがありましたので、修正致しました。 こんにちは。 スマートフォンサイト制作案件が増えて楽しいKanaです。 スマートフォンサイトのコーディングは、古いブラウザ (ie6とかie6とかie6とか!)のことを考えるとできなかったCSSの指定ができるので、とても楽しいですね! スマートフォンサイトの制作はリキッドレイアウト。 ナビゲーションの数が奇数!…均等にするにはwidth指定面倒だな〜画像とテキストを横に並べなきゃ…縦方向の揃え位置を指定できたらいいのに…。と思ったことはありませんか? そんな時の強い味方がdisplay:tableと、display:table-cellです。 スマートフォンサイトのコーディングを頻繁にされている方は、既にご存知かもしれませんが、これからスマートフォンサイト作るよ!という方には、とても便利だと思います! display:

    スマートフォンサイト制作にdisplay:tableとdisplay:table-cellが便利!
    ml0021234
    ml0021234 2013/08/28
    スマホ css Tips
  • フレッシュ&便利なjQueryプラグインまとめ 20 | BANSNA

    海外サイトより、フレッシュで便利なjQueryプラグインを集めました。 自分用メモみたいなものですが今回は20個ほど紹介したいと思います。 テキストを湾曲にする 画像をパラパラ飛ばす 画像をミニュチュア風にする のように画像をめくる jQueryモバイル可動式レイアウト スライドショー いろいろな影をつける 擬似透明生成jQueryのプラグイン レスポンシブアニメーション 背景画像の変わりに動画を再生 ダイヤル式グラフ 可変グリッド マルチタッチジェスチャー ドラッグアンドドロップで移動させる 可変グリッド2 小さなスクロールバー もっとも軽いシンプルスライダー 表示サイズによって画像を変える テーブルクロス グリッドレイアウトデザイン ※ブラウザによってはきちんと表示できないものもありますので“自己責任”でお願いします。 ツイート

    ml0021234
    ml0021234 2013/08/28
    jQuery プラグイン
  • text-shadowを使ってテキストにさまざまなスタイルを与える全23種類のスタイルシートのまとめ | コリス

    Text Shadow Compilation デモは全部で23種類、かっこいいスタイルをはじめ、使い方が限定されたアレなものまで、さまざまなスタイルがあります。 基HTML HTMLの基はclassを付与したh1要素のみです。 classを変更して、利用してください。 <h1 class="basic">Basic</h1> 以下、各デモのキャプチャとスタイルシートです。

    ml0021234
    ml0021234 2013/08/28
    text-shadow
  • ヌルヌルの秘訣はCSS!Googleスマホ版で採用されている使い心地のよいスライドメニューを再現した『jSlideMenu』

    以前『スマホサイトにおすすめ。jQueryプラグイン『PageSlide』を使ってFacebook風メニューを再現してみました 』という記事を書きましたが、今回は『Qiita [キータ] – プログラマの技術情報共有サービス 』にてGoogleでも採用されているCSS3のアニメーションを使ったスライドメニューというものを発見したのでご紹介します。 jQueryプラグイン『jSlideMenu』 なんでも作者の方はGoogle先生のソースコードを調査し、あのヌルヌル動くスライド部分のアニメーションがJSではなく実はCSS3のtranslateで行われていることを突き止めたんだとか。 CSSGoogleから学ぶ ヌルヌルサクサクなスライドメニュー – Qiita [キータ] スマートフォンのブラウザではjavascriptでのアニメーションはどうしてもガタガタになってしまうし、ちらつきや

    ヌルヌルの秘訣はCSS!Googleスマホ版で採用されている使い心地のよいスライドメニューを再現した『jSlideMenu』
    ml0021234
    ml0021234 2013/08/28
    スマホ スライドメニュー