JavaScriptも使わず元画像も変更せずに画像をグレースケール表示させる ちょっと調べ物をしたのでメモ。 画像1枚だけで、グレースケール、 マウスホバーでカラー画像に、 みたいなのを実装したい、出来れ ばJavaScriptも使用せず、みたい な内容です。2012.06.27 | 10時25分29秒cssやプログラミングWebデザイン
ソースも公開されているオンラインのJavaScript構文チェックツール・jsLint.it Githubでソースも公開されている JavaScript構文チェックツール・ jsLint.itのご紹介。結構軽量で 使い勝手が良さそうだったので自 分のサーバーに入れて使いたいと 思います。2012.06.25 | 9時55分55秒cssやプログラミングオープンソースソフトウェア
Webベースのダイナミックでクールなプレゼンテーションを実装する為のJavaScriptフレームワーク・Mosho Web上でプレゼンする為のJavaScript フレームワーク、Moshoのご紹介です。 impress.jsライクなダイナミックな 動きのプレゼンテーションをHTMLで 実装する事が可能です。シンプルで 良かったのでお勧め。2012.06.16 | 10時44分48秒cssやプログラミングWebデザイン
Twitter BootstrapをjQuery Mobileで使ったデザインテーマ集・jQuery-Mobile-Bootstrap-Theme なかなか良かったので備忘録です。 Twitter Bootstrapのデザインを、 jQuery Mobileのテーマに起用した サンプルソースが公開されていま した。フレームワーク的にも使える かもしれない。2012.05.31 | 10時06分55秒cssやプログラミングiPhone / iPadjQueryWebデザイン
タブやフォームなどのUIもレスポンシブWebデザインに対応させた960グリッドシステム搭載のCSSフレームワーク・Gumby Framework 良く使われるUIキット付属の CSSフレームワークです。960 グリッドシステムも搭載して いますので、様々なレイアウト にも対応できる柔軟なフレーム ワークになるかもしれません。2012.05.19 | 11時59分44秒cssやプログラミングWebデザイン
CSSのプロパティを検索してブラウザのバージョンごとの対応状況を確認出来るリファレンスサイト・Browser Support プロパティがどのブラウザに対応 しているかを調べられる、という 検索式のリファレンスサイトです。 バージョン別になっているので、 動かなくて困った、という時に調 べて見ては如何でしょう。2012.05.13 | 10時16分09秒cssやプログラミングWebサービスその他
Media Queriesで設定したブレークポイントをJavaScriptと:after擬似要素でチェックする 便利そうだったので備忘録。Media Queriesで設定したブレークポイント を簡単なJSのコードでチェックする、 という方法です。CSSの:after擬似 要素を併用してチェックします。シ ンプルで良いのでは。2012.05.05 | 10時53分49秒cssやプログラミングiPhone / iPadWebデザイン
mootoolsをベースとしたオープンソースのモバイル向けフレームワーク・Moobile いつもjQueryなのでたまには別のライブラリ の話題でもご紹介。mootoolsをベースとした モバイル向けフレームワーク・Moobileです。 mooltoolsベースのものは個人的には初見です が、他にもあるんですかね・・あま...2012.04.23 | 10時37分32秒cssやプログラミングiPhone / iPadWebデザイン
ベーシック且つシンプルなレスポンシブWebデザイン対応CSSフレームワーク・Exegesis-Framework シンプルでベーシックなレスポンシブ Webデザイン対応のCSSフレームワーク をご紹介。シンプルなのでフレーム ワークとしてとても使いやすいイメージ でした。これはこれで覚えておくと いいかも。2012.04.20 | 11時17分05秒cssやプログラミングWebデザイン
擬似クラスや属性セレクタ等でフィルタリング可能なCSSセレクターのシンプルなリファレンス 作りが良かったので参考としてメモ。 CSSのセレクターを、擬似クラスとか 属性とかでフィルタできるリファレ ンスサイトです。自分のチートシート の作りが微妙なので使いやすそうなら 参考にしたい。2012.04.11 | 10時28分56秒cssやプログラミングWebデザイン
CSS3で作る、ドロップダウン⇔アコーディオンの切り替えをするレスポンシブWebデザイン対応のグローバルメニュー JSを使わず、CSSのみでドロップダウン メニューとアコーディオンメニューを 特定のブレークポイントで切り替える レスポンシブWebデザイン対応のグロー バルメニューのサンプルです。これは なかなか良いのでは。2012.04.10 | 10時50分32秒cssやプログラミングWebデザイン
スマフォのフリックにも対応しているカルーセルを実装できるJSライブラリ・inflickity フリックに対応したカルーセルを 実装するライブラリ・inflickity です。動きもかなり軽快ですので、 使いどころも多々ありそうです。 よくあるUIキットにも似たような ものが含まれてますけど、こうして 単体で使えるのも欲し...2012.04.08 | 11時27分32秒cssやプログラミングiPhone / iPadWebデザイン
商用利用もWebフォントも無料で利用出来るサンセリフ系フォント・Subtle Sans 英字フォントですが、なかなか良さそう だったのでシェア。商用利用もWebフォント も無料でリンクなども不要と、結構自由 に使えるのと、個人的にサンセリフの 利用頻度が高いので即DLしてみましたよ。 太さも3種用意されています。2012.04.05 | 10時43分38秒cssやプログラミングWebデザインメディア関連
著作権放棄のレスポンシブWebデザイン対応CSSフレームワーク・ingrid シンプルで良さそうだったのでメモ。 パブリックドメインのCSSフレームワ ークです。レスポンシブWebデザイン にも対応していますし、グリッドレイ アウトにも利用出来るのでなかなか 汎用性があるのでは無いかなと。2012.03.27 | 10時35分56秒cssやプログラミングiPhone / iPadWebデザイン
jQuery UIのデザインをオリジナルに変更したサンプル 分かりやすいタイトルが思い浮かばない ので適当な感じになりましたが。jQuery UIのデザインをちょっと今風に変更した サンプルが配布されていたので備忘録。 jQuery UI、凄く機能的で良いんですが、 用意されているデザイン...2012.03.06 | 9時58分14秒cssやプログラミングjQueryWebデザイン
iPadやiPhoneなどのスワイプ操作にも対応の、シンプルなHTML製プレゼンテーションを作成する為のフレームワーク・slides シンプルなHTMLプレゼンテーションを作成 する為のフレームワークのご紹介です。最近 は変わった動きのするプレゼンツールをよく 見かけますが、シンプルなタイプはあまり 見かけませんので選択肢の一つとして。 スマフォのスワイプ操作に...2012.02.29 | 11時46分40秒cssやプログラミングiPhone / iPadWebデザイン
JavaScript無しで作るレスポンシブなコンテンツスライダー・CSS3 Responsive Slider 使えそうだったので参考にしました。 JavaScriptを使わず、CSSのみで動作 させるレスポンシブWebデザイン対応 のコンテンツスライダーのサンプル です。軽量化にも繋がりそうですね。2012.02.27 | 11時05分10秒cssやプログラミングiPhone / iPadWebデザイン
モリサワのWebフォントが無料キャンペーンやってたので試してみたよ モリサワのフォントをWebフォント として使えるようになりました。 現在キャンペーン中で、期間限定 で無料で利用する事が出来ます。 いつもお世話になっているフォント なので普及活動などしてみようか と思います。2012.02.23 | 16時47分35秒cssやプログラミングWebデザイン
どんな要素でも全画面表示に出来るFullscreen APIをブログの記事に使ってみる ※動作サンプル有 どんな要素でも全画面表示に出来る Fullscreen APIというものがありま して、主に動画で使われている事が 多いですが、今回はブログコンテン ツのリーダビリティに貢献させる 目的で使って見ます。2012.02.07 | 11時09分03秒cssやプログラミングjQueryWebデザイン
[書評]jQuery Mobile スマートフォンサイト デザイン入門 ASCII様よりご献本頂きました。書評を 持って御礼とさせていただきます。よ うやく正式版がリリースされたjQuery Mobileですが、まだまだ実践向けの 情報の書かれたブログ記事なども少な いですが、こちらはかなり実践向け...2012.01.31 | 10時59分35秒cssやプログラミングiPhone / iPadjQueryプライベート個人的な日記
Webサイトの制作スピードを、より向上させる目的で作られたスターターキット・99lime 結構参考になったので備忘録がてら ご紹介。Webサイトの制作スピードを より向上させるために、汎用的なUI を集めて、マークアップも綺麗な状態 で済むように設計されたスターター キット、というかフレームワークです。2012.01.21 | 9時57分30秒cssやプログラミングjQueryWebデザイン
スマフォのHTML5環境向けに作られたjQueryライクな軽量フレームワーク・jQ.Mobiの日本語サンプル作った なかなか良さそうだったので備忘録。iOSやAndroidなど、スマートフォンでのHTML5環境に合わせて作られた軽量モバイルフレームワークです。jQuery互換なので慣れてる方は使い方もすぐに覚えられると思います。特に軽量なのが嬉しいですね...2012.01.18 | 10時52分02秒cssやプログラミングiPhone / iPadオープンソースソフトウェア