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

  • puzzel.jp

    ユーザー目線でのデザインが得意で、プロダクトの成長をより加速させるためのデザインも得意です。 toC ユーザー向けのプロダクトのデザインを注力していましたが直近は、toB ユーザー向けのプロダクトのデザインに注力しています。 他、ロゴや Web サイトデザイン/マークアップ、写真撮影、映像撮影・編集、デザインの講師など。 自己紹介 (note) About - puzzel.jp 2010年10月からスタートした、puzzel.jp。 開設時から1つまえのサイトが残っています。 デザイントレンドによって変わっていたり、ガラケー対応のサイトだったりと、時代を感じることができます。 History: 2010, 2011, 2012, 2013, 2014, 2016, 2020 Chompy, Inc. 2021 - 2023フードデリバリーサービス Chompy の UI / UX デザイ

  • 簡単に実装できる、ボタン画像のマウスオーバーイベント 10+ - NxWorld

    画像のオンオフ切り替えといったようなマウスオーバーイベントで、簡単に実装できるものをいくつか紹介します。 CSS3やjQueryを使ってちょっと変わった動きを取り入れるサイトも見かけることも多くなりましたが、今回は普段も使用頻度が高いと思う定番のものに絞りました。 サンプルで使用する画像とDEMOについて 各マウスオーバーの動きを実装するにあたって上のような3タイプのボタン画像を用いており、各ボタンはそれぞれ以下のようになっています。 type A 単体のボタン画像 type B オンとオフを1枚の画像にした、スプライト型 type C オンとオフをそれぞれ別の画像にし、オフ時のものは_off、オン時のものは_onを拡張子前に入れています。 また、サンプルも用意したので実際の動きはこちらで確認して下さい。 CSS:マウスオーバー時に透過させる CSSのopacity(IEはfilter)の

    簡単に実装できる、ボタン画像のマウスオーバーイベント 10+ - NxWorld
    works_ma
    works_ma 2012/12/14
     参考
  • jQueryで全画面表示するギャラリーを作るチュートリアル

    Posted: 2011.04.28 / Category: javascript / Tag: jQuery, ギャラリー 最近はFlashで作ったのかと思ってしまうようなjavascriptなギャラリーをちらほら見るようになりましたね。 この記事ではあまり凝ったことをすると大変、、というか作れるスキルがないので、jQueryを使用したシンプルなフル画面ギャラリーの作成方法をチュートリアル形式でお送りいたします。 画像の準備をしよう ギャラリーページなので当然のことながら画像は準備しておきましょう。 小さい画像(サムネイル)と大きい画像を用意します。 小さい画像は100×67、大きい画像は画面いっぱいに表示するのでそこそこ大きいのにします。 画像サイズが変わっても基的にcssを修正するだけで済むようにします。 html + cssを作成しよう 連番画像をjQueryで配置しても良かった

    jQueryで全画面表示するギャラリーを作るチュートリアル
    works_ma
    works_ma 2012/12/14
    参考に