最近バタバタしていて更新が滞っています。そろそろFC2の広告が出そうなのでちょっとした小ネタを。 私のPCにはIE9が入っていて、IE7や8での表示確認には「IE Tester」というソフトを使っていました。ところが、IE9でIE7と8の表示を確認できることを先日知りました。 方法は簡単。まずは設定ボタンから開発者ツールを開きます。 するとブラウザの下の方に開発者ツールが現れます。Chromeでいうデベロッパーツールですね。 そこに、ブラウザーモードというのがあり、これでIE7や8での表示を確認することができます。IE6の確認はできませんがもういいです。 「今頃知ったのか」と笑われそうですが、個人的には結構便利だと思ったので紹介してみました。 いちいちバージョンごとで確認が必要なIEって本当に手のかかるブラウザです。IEがしっかりしていればCSS3ももっと浸透すると思うので残念です。
Font Custom アイコンフォントをコマンドラインで生成できる「Font Custom」 ベクター形式のアイコンをフォントファイルに1個にまとめてフォントのように扱えるけど実はアイコン、なアイコンフォントをコマンドラインでジェネレートできるツールです。 SVGファイルをまとめておいてコマンドラインを叩くとCSSとフォントファイルが生成されます。 単にフォントファイルにまとめるだけでなく、CSSを利用して次のようにテキストの横にアイコンを表示することができます。 フォントなので、テキストの色変更やサイズ変更に対応でき、CSSのフィルタにも対応可能です。 フォントアイコンでサイト作成を効率化したい方は覚えておくとよさそうですね。 関連エントリ フリーのアイコンフォント10まとめ メジャーなアプリケーションのアイコンフォント「Pictonic」 オシャレなアイコンが詰まったアイコンフォント
Flashのような美しいアニメーションで、複数のテキストをスライドやフェードなどで表示するjQueryのプラグインを紹介します。 デモページ ※キャプチャは、スライドとフェードのミックス。 animateText.jsの使い方 Step 1: 外部ファイル 「jquery.js」と当スクリプトを外部ファイルとして記述します。 <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script type="text/javascript" src="/animateText.js/js/animateText.js"> </script> ※linear以外のアニメーションも使用する時は「jquery-ui.js」も外部ファイルに加え
App Folders plugin for jQuery | iOS-like folders to display complex information. iOSのアイコンフォルダ風のUIを作れるjQueryプラグイン「App Folders」。 クリックすると開くあのクールなフォルダをブラウザで再現したUIを実装プラグインです。 iPhoneサイトでは既にユーザが使い方について理解していると思うので、使い方によっては使い勝手のよいサイト作りに活用できそう 関連エントリ スマホ用サイトに使えそうなドロップダウン実装jQueryプラグイン「DropKick」 モバイルブラウザでの高速クリックを実現するjQueryプラグイン「jQuery Fastbutton」 スマホサイトでも使えそうなかっこいいドロップダウンメニュー実装jQueryプラグイン「ddSlick」 スマホの入力が超楽にな
Photobooth.js HTML5でWebcamの内容にエフェクトを付けて撮影できる「Photobooth.js」 MacのPhotoBoothのようにリアルタイムエフェクトがかけられ、その場で撮影が可能というものです。 カスタマイズできるのは色彩・色合・彩度。更に指定範囲のみの撮影などにも対応 試しに撮影してみました。これは新しいですね。 単にWebcamで撮影するものは数あれど、こういうのは初めて見た気がします 関連エントリ WebCamで撮影をHTML5で実現するデモ CanvasとWebcamで作られたブラウザ上で動作する面白デモx2 自分でスタイリングして好きなアイコンを選んでセットでDLできる「Iconbench」
個人でも商用でも、そしてクライアントのプロジェクトでも無料で利用できる、スマートフォン・タブレット向けのサイトが簡単に作成できるjQuery Mobileを使ったテンプレートを紹介します。 Cooky -Free Mobile Site Template Cookyの特徴とラインセス Cookyのデモ(ページ) Cookyのデモ(エフェクト・テンプレート) Cookyの特徴とライセンス Cookyはスマートフォン・タブレット向けのサイトが簡単につくれるよう、ページやエレメントが一式揃ったテンプレートです。 その名の通り、特に飲食をベースにしたビジネスやブログなどを想定してデザインされています。 ValidなHTML5+CSS3で実装された11ページ。 グリッド、アコーディオン、リスト、ボタンなども用意。 レスポンシブ対応のスライダー。 コンタクトフォーム。 jQuery Mobile, G
タブ、ドロップダウン、アコーディオン、カルーセルなど、今まではスクリプトに依存しないと実装できなかったものをスタイルシートベースで実装するBootstrapのプラグインを紹介します。 Bootstapのプラグインですが、CSSの「:checked」を使ったテクニックを学ぶのにも役立ちます。 Bootleg.css 仕組みは簡単に説明すると、見えない状態のラジオボタンを使い、そのオン・オフのチェック状態でコンテンツを表示・非表示します。 デモと共に、「:checked」擬似要素の使い方を紹介します。 モーダル ボタンをラジオボタンにし、そのチェック状態でモーダルを表示・非表示します。 HTML <-- Button to trigger modal --> <label for="modal1" role="button" class="btn">Launch demo modal</lab
動画を背景にするとこんなにカッコいい、というデモと実装jQueryプラグイン 2012年12月10日- Make an HTML5 video a background - body bg demo 動画を背景にするとこんなにカッコいい、というデモと実装jQueryプラグイン。 Youtubeの動画を背景にするjQueryプラグインがあったりしますが、今回は自前の動画を背景に使ったサイトが簡単に作れます。 動画フォーマットも各種指定することで色々な端末に対応することができそう 実装コード。各種動画ファイルをフォーマットベースにオプション指定 若干重いですが、将来的にはこういったサイトも当たり前のように登場していることでしょう。 関連エントリ フリーのオープンソースなHTML5動画プレイヤーいろいろ
iPhoneやiPadのホーム画面に作れるフォルダっぽい動作のコンテンツを実装出来る、というスクリプト。動作はかなり再現出来てる気がします。 iOSのホーム画面に作られるフォルダっぽいのを作る、というjQueryプラグインです。 ※ドラッグで動かせる、というのは残念ながら付いてないです。 フォルダをクリックすると開く的なやつです。 ↑ 開いた箇所はハイライトされる コード <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js'></script> <script src="jquery.app-folders.js"></script> 本体とライブラリw読み込む $('.foo').appFolders({ opacity: .2, // セレ
毎月、請求書の作成に追われていませんか? フリーランスとして働く私も、わずらわしい請求書は後回しにしてしまいがちで、いつも月末になって慌てて作業をしています。エクセルでひな型は作っていても、金額を入力し、印刷して押印・郵送までするのはかなり手間がかかりますよね。 本来ならお金に関わる大切なことなので、間違いのないように行うべき作業なはず。何とか早く正確にできないかと考えていた私に一筋の光を与えてくれたのが、「MakeLeaps」というオンライン請求書・見積書作成サービスでした。 今回はMakeLeapsを実際に使用してみて、良かった点、気になった点などを紹介します。■シンプルな管理画面で登録もラクラク MakeLeapsを使用するためには、まずトップページにアクセスし、基本情報の登録(無料)が必要です。請求書の自社欄に表示される個人情報の登録と、会社のロゴや社印、個人印の画像をアップロード
おはようございます二次元!KiDDです。本日ご紹介するのは、青春時代の恋愛をもう一度やり直せる恋愛アドベンチャー、恋愛リプレイです。 恋愛リプレイは、恋愛に憧れる幼なじみの美少女3人ともう1度恋愛をやり直せる萌えゲーム。 イラストレーターの加茂さんが描いた柔らかい感じの美少女が「Live2D」でヌルヌルと動きます。もちろんボイスありですよ! 触ってみれば分かりますが顔のニヤニヤが止まりません・・・。ボイスもそうですが(イヤホン必須ですよ!)、女の子の動きが可愛すぎてもう辛抱たまらん!これは神ゲーだ!! プレイ動画 タップでのコミュニケーションは仲良くなると反応もかわります。 あの頃に戻れるゲーム それでは早速ゲーm・・・恋愛をやり直しましょう! 「あの頃に戻りたいですか?」と画面に表示されるので思いっきりタップします。 名前を入力すれば恋愛リプレイの始まりです。 名前は自分用とランキング公
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く