タグ

2009年9月22日のブックマーク (73件)

  • CSSとJavaScriptで作るフォームエレメントのチュートリアル51 – creamu

    1st webdesignerで、CSSJavaScriptで作るフォームエレメントのチュートリアルがたくさん紹介されています。 いくつかご紹介。 ↑は、Changing Form Input Styles on Focus with jQuery。フォームの中にラベルを表示して、フォーカス時にラベルを消してくれる Turn postcard photo into a stunning comment form using CSS 古いポストカードを使ってコメントフォームをつくったようなデザインのチュートリアル CSS Tableless Form テーブルを使用しないフォームデザイン。floatとネガティブマージンを使用 テクニカルで気の利いたものが多いですね。 その他は以下からどうぞ。 » 51 Form Element Resources and Tutorials Using C

  • プログラミングできなくてもレンタルサーバ借りなくても作れる Twitter bot もどきグリモンの作り方 | さくらたんどっとびーず

    pha 様の以下のページが超人気っぽいです。bot を作りたいと思ってる人って結構いるのかしら? プログラミングができなくても作れるTwitter botの作り方 こちらで紹介されてる内容は、レンタルサーバで PHP 動かしてって感じで「bot とかよく分からんけどとりあえず試しに動かしてみたいような気がちょっとした感じ」ぐらいに思ってる人にはちょっと敷居が高そうだったので、グリモンで動く bot もどきを作ってみました。 bot もどきのもどきとは、グリモン(ブラウザ)を立ち上げてるときだけ動く bot という意味です。 ブラウザを立ち上げとかないと bot が動かないので作ってから完全に放置できる訳ではありませんが、サーバにインストールするタイプの bot よりもかなり簡単に動作させることができます。それ以外の部分では普通の bot と大きく変わりませんので、とりあえず bot してみ

    プログラミングできなくてもレンタルサーバ借りなくても作れる Twitter bot もどきグリモンの作り方 | さくらたんどっとびーず
    utalab
    utalab 2009/09/22
  • ドラッグ&ドロップできるサイトマップ作成チュートリアル:phpspot開発日誌

    Creating a Draggable Sitemap with JQuery ・Boagworld ドラッグ&ドロップできるサイトマップ作成チュートリアルが公開されています。 次のようなツリー形状でツリー間を移動することが可能な物を作成します。 サイトマップでなくとも、階層構造をドラッグ&ドロップさせるようなUIの実装の際に参考に出来ますね。 関連エントリ ナビゲーションメニューを1歩進んだものに引き上げるjQueryチュートリアル集 PHPとjQueryのAjax連携の学習用チュートリアル jQueryでアコーディオン作成のチュートリアル

  • Yahoo! UI最新版登場、クライアントストレージ | エンタープライズ | マイコミジャーナル

    YUI - Yahoo! User Interface Library The YUI teamは14日(米国時間)、YUI (Yahoo! User Interface Library)の最新版となるYUI 2.8.0を発表した。YUIYahoo!で開発されたAjax JavaScriptフレームワーク。サポートブラウザとOSリストが提供されているほか、さまざまなUIコンポーネントが用意されている。 YUI 2.8.0における注目の新機能は次のとおり。 HTML5スタイルのローカルセッションストレージを提供するクライアントストレージメタコンポーネントStorage Utility (Matt Sinder氏提供)の導入。HTML5ストレージ、Google Gears、Flash共有オブジェクトをサポート さまざまな用途に適用できるプログレスバーコンポーネント ProgressBar (

  • スクロール終端で出現するTOPに戻るボタン「jQuery Scroll to Top Control v1.1」

    TOP  >  WebDesign  >  スクロール終端で出現するTOPに戻るボタン「jQuery Scroll to Top Control v1.1」 WEBはどうしてもその性質上縦に長くなってしまう傾向があり、縦にスクロールして見ていくと言うサイトも多いかと思います。よくユーザーインターフェイスをよくするためにページ下層にTOPに戻るボタンが用意されていて、読み終わった後に一瞬でTOPに戻れる仕組みを取っているサイトも多いのですが、今回紹介するのは常に表示させておくのではなく、スクロール終端で出現するTOPに戻るボタン「jQuery Scroll to Top Control v1.1」です。 ユーザーがページ下部に戻ったときだけ、フェードインで登場し、逆にスクロールで上部に戻ると言った時には消えると言う仕組みになっています。 詳しくは以下 実装は至って簡単で、ボタンを準備して、J

    スクロール終端で出現するTOPに戻るボタン「jQuery Scroll to Top Control v1.1」
  • jQueryによるアニメーションエフェクトの基本 (1/5)

    jQueryの特徴の1つは、Webサイトに動きを付ける「アニメーションエフェクト」を手軽に実装できることです。jQueryで実現できるのは、セレクターで指定したHTML/XHTML(以下、HTML)要素のサイズや位置、透明度を時間の経過とともに徐々に変化させ、動いているように見せる簡単なアニメーションですが、最近のWebデザインで用いられる“動きのあるUI”を作るのには重宝します。 今回は、jQueryに用意されているアニメーションエフェクト関連の命令を紹介します。 非表示状態の要素を表示するshow() show()は、CSSのdisplayプロパティの値が「none」、つまり非表示に設定されているHTML要素を、アニメーション付きで表示状態(display:bolck;)に切り換える命令です。要素の透明度を透明から不透明にしながら、サイズ(高さ/幅)を0から来のサイズに変化させます。

    jQueryによるアニメーションエフェクトの基本 (1/5)
  • 利用しやすいjQueryで作るツールチップを集めた「25 Useful jQuery Tooltip Plugins and Tutorials」

    TOP  >  WebDesign  >  利用しやすいjQueryで作るツールチップを集めた「25 Useful jQuery Tooltip Plugins and Tutorials」 マウスオーバーしたときに出現するツールチップ、その対象物の内容を説明したり、補足的なデータを表示したりとユーザーインターフェイスを向上させてくれるテクニックの一つです。今日紹介するのは利用しやすいjQueryで作るツールチップを集めた「25 Useful jQuery Tooltip Plugins and Tutorials」です。 qTip – The jQuery Tooltip Plugin 吹き出しタイプやフェードタイプなど様々なもの集められていますが、今回はそのなかからいくつか気になったツールチップをピックアップして紹介したいと思います。 詳しくは以下 ■Prototip 2 – Crea

    利用しやすいjQueryで作るツールチップを集めた「25 Useful jQuery Tooltip Plugins and Tutorials」
  • ブログのトップページをHTML5で書いてみた。 | notizblock

    とりあえず20分くらいで書いてみた。 http://waldspaziergang.com/notizblock/html5.html 今回使ったのは、<header>,<section>,<article>,<footer>です。 <header><footer>あたりは必ず使う様になるのかなぁ。ともあれ使い易そうというかコードの可視性は上がりそうな予感。 <section><article>は使い方勉強する必要ありそう。<section>と<div>とか絶対迷う。 とりあえずIEに対応させるには <!–[if IE]> <script type=”text/javascript”> document.createElement( ‘header’ ); document.createElement( ’section’ ); document.createElement( ‘n

    utalab
    utalab 2009/09/22
  • jQueryでAjaxを利用する基本チュートリアル (1/4)

    前回の「フォーム」に続き、jQueryの特別な機能を解説します。今回取り上げるのは、「Ajax」を利用するための機能です。 今さら聞けない「Ajax」とは? 「Ajax」(エイジャックス)は 「Asynchronous JavaScript + XML」の略で、あえて日語にすれば「JavaScriptとXMLによる非同期通信処理」といった意味です。難しく聞こえますが、JavaScriptでWebページを切り替えずにサーバーとデータをやりとりすることです。JavaScriptでサーバーのデータを取りに行けば、ページを切り替えずに画面の一部を書き換える、といった処理ができるようになります。 WebブラウザーはWebページを表示するために、サーバーからHTML/XHTML(以下、特に断りのない場合はHTMLと書きます)ファイルを取得し、取得したHTMLを解釈して描画(レンダリング)します。通常

    jQueryでAjaxを利用する基本チュートリアル (1/4)
  • [JS]フォームのエラー箇所をアニメーションでブルッとさせるスクリプト

    フォームのエラー箇所にブルッとしたアニメーションのエフェクトを加えるスクリプトをJanko At Warp Speedから紹介します。 Animate validation feedback using jQuery demo デモではフィールドが空の場合にエラーとして、ブルッとしたアニメーションのエフェクトを加えます。 スクリプトのベースにはjQueryが使用されており、下記のスクリプトを記述します。 <textarea name="code" class="js" cols="60" rows="5"> $("#signup").click(function() { var emptyfields = $("input[value=]"); if (emptyfields.size() > 0) { emptyfields.each(function() { $(this).stop(

  • jQueryを読むために知っておきたい6つの知識 : tech.kayac.com - KAYAC engineers' blog

    夏休みはタイ古式マッサージセミナーに参加してきました。agoです。 先週日曜日若手IT勉強会に参加させていただき、jQueryのコードリーディングを行ってきました。 そこでjQueryのコードを読むときの基礎知識に関して簡単にまとめてみたいと思います。 1 変数の複数同時宣言と代入 まず、JSでは変数の宣言は以下のような形式で行います。 var hoge; この場合は単一の変数の宣言ですが、以下のような記述を行うと複数の変数を同時に宣言することが可能です。 var hoge, huga; また、変数宣言と同時に値の代入を行うことも可能で、その場合以下のような記述になります。 var hoge = 'test'; さらに複数の変数宣言と、値の代入は同時に行うことが可能で、その場合以下のような記述になります。 var hoge = 'test1', huga = 'test2'; jQuery

    jQueryを読むために知っておきたい6つの知識 : tech.kayac.com - KAYAC engineers' blog
  • Evernote + Tombloo をでっち上げる件 - Study03.net 対シンバシ専用

    いろいろでっちあげたもの連続ポストしようと思う。 Tomblooに良くお世話になっているのですが、EvernoteにPOSTするメニューが無かったぽいので こちらと http://d.hatena.ne.jp/Constellation/20080726/1217088917 tombloo 家を参考に http://wiki.github.com/to/tombloo Evernote対応のスクリプトを作ってみますた。基的にEvernotebookmarkletをベースに作ったので、regular, quote, link 位しかまともに動かないと思います。 完全に雰囲気だけで作ったので、へんな書き方になってると思いますがご容赦ください。ついカッとなってやった。反省はしてない。 下記スクリプトを「20_Evernote.js」というファイル名で、ローカルに保存して、Firefoxの

    Evernote + Tombloo をでっち上げる件 - Study03.net 対シンバシ専用
  • jQueryでリアルなホバーエフェクト作成チュートリアル:phpspot開発日誌

    Create a Realistic Hover Effect With jQuery ・Blog and Web Design Portfolio of Adrian Pelletier jQueryでリアルなホバーエフェクト作成チュートリアルが公開。 次のように、ホバー時にリアルにリフレクションしたり、リアルな影がついたりする物体作成チュートリアルになってます。 背景がグラデーションだったり、リフレクションや影が綺麗にアニメーションする部分など、かなりのテクニックを要しているみたいです。 こうしたディテールにもこだわりたい場合に参考にできそうです。 関連エントリ ナビゲーションメニューを1歩進んだものに引き上げるjQueryチュートリアル集 PHPとjQueryのAjax連携の学習用チュートリアル

  • Webデザインに使えるjQuery UIライブラリ – creamu

    jQuery TOOLSというjQueryのUIライブラリを見つけました。 ↑のようなスライドショーや、バブル型でふわっと浮き上がるツールチップ、気持ちのいいフェードイン&アウトで切り替わるコンテンツなど、たくさんのエフェクトが紹介されています。 以下からデモを見られますね。 » jQuery TOOLS DEMO AREA それぞれソースコードが載っていて、かなりクールなものばかりなのでぜひ見てみてください♪ » jQuery TOOLS – The missing UI library for the Web よぅしビール飲みながらがんばろう。

  • jQuery にて配置済みのDOM要素をシャッフルする方法 ( ラボブログ )

    スパイスラボ神部です。 ちょっと必要があって、配置済みのDOM要素を並べ替えたかったのですが、どうしてもやりかたがわからず、Twitter でつぶやいてみたところ、めちゃめちゃ参考になる情報をいただきました。 ・要素そのものを並び替える方法 ・CSS で要素の一を変える方法 のどちらかがあるだろうなぁ、とは思っていましたが、奇しくも両方を教えていただきました。教えてくださったお二方、当にありがとうございます! 参考までにまとめてみたいと思います。 要素の配置換えを行う jQuery プラグイン @tamiko 氏に教えていただいた方法。こちらは要素そのものを入れ替える方法ですね。 -jQuery: Shuffle Plugin | Yelotofu サンプルデモはこちら。 -jQuery: Array Shuffle まさにこれ!という感じ。 >jQueryでランダムに要素を再配置

  • HTML5 のセクションアウトラインを取得する JavaScript - IT戦記

    id:vantguarde さんが HTML5 のセクション 3 箇条を書かれて紹介しています スタイルシートやスクリプトの都合には使わないこと。それらにはdivを使うこと。 article, aside, navが適切な場合には、そちらを使こと。 セクションの先頭に見出しが自然に存在してない場合には使わないこと。 sectionの使い方とセクション三箇条 - vantguarde - web:g すばらしいですね! 便乗して セクションのアウトラインを求める JavaScript(YAPC 前夜祭で紹介したやつ)を公開します http://amachang.sakura.ne.jp/misc/outliner.js この JavaScript は 以下のアルゴリズムをそのまま JavaScript で実装したものになっています 4.4.11.1 Creating an outline

    HTML5 のセクションアウトラインを取得する JavaScript - IT戦記
    utalab
    utalab 2009/09/22
  • iPhoneのタッチスクリーンを再現するブックマークレット(脂) - KAZUMiX memo

    指の脂の表現に特に力入れた。 javascript:(function(d,s){s=d.createElement('script');s.type='text/javascript';s.src='http://www.rr.iij4u.or.jp/~kazumix/d/javascript/dragScroller.js?'+(new Date).getTime();s.charset='UTF-8';d.body.appendChild(s);})(document) 上記のコードをアドレスバーに貼り付けて実行すると、そのページがマウスのドラッグでスクロールできるようになります。 ※IEではこのはてなダイアリーを含め、一部のサイトで動作しません。とは言え今時のサイトならほとんど動きます。詳細後述。 ブラウザ対応状況(うちのPCで確認したもの) 問題無く動作するブラウザ Firefo

    iPhoneのタッチスクリーンを再現するブックマークレット(脂) - KAZUMiX memo
  • Admiral

  • jQueryでAjaxを利用する基本チュートリアル (1/4)

    前回の「フォーム」に続き、jQueryの特別な機能を解説します。今回取り上げるのは、「Ajax」を利用するための機能です。 今さら聞けない「Ajax」とは? 「Ajax」(エイジャックス)は 「Asynchronous JavaScript + XML」の略で、あえて日語にすれば「JavaScriptとXMLによる非同期通信処理」といった意味です。難しく聞こえますが、JavaScriptでWebページを切り替えずにサーバーとデータをやりとりすることです。JavaScriptでサーバーのデータを取りに行けば、ページを切り替えずに画面の一部を書き換える、といった処理ができるようになります。 WebブラウザーはWebページを表示するために、サーバーからHTML/XHTML(以下、特に断りのない場合はHTMLと書きます)ファイルを取得し、取得したHTMLを解釈して描画(レンダリング)します。通常

    jQueryでAjaxを利用する基本チュートリアル (1/4)
  • jQueryでAjaxを利用する基本チュートリアル (1/4)

    前回の「フォーム」に続き、jQueryの特別な機能を解説します。今回取り上げるのは、「Ajax」を利用するための機能です。 今さら聞けない「Ajax」とは? 「Ajax」(エイジャックス)は 「Asynchronous JavaScript + XML」の略で、あえて日語にすれば「JavaScriptとXMLによる非同期通信処理」といった意味です。難しく聞こえますが、JavaScriptでWebページを切り替えずにサーバーとデータをやりとりすることです。JavaScriptでサーバーのデータを取りに行けば、ページを切り替えずに画面の一部を書き換える、といった処理ができるようになります。 WebブラウザーはWebページを表示するために、サーバーからHTML/XHTML(以下、特に断りのない場合はHTMLと書きます)ファイルを取得し、取得したHTMLを解釈して描画(レンダリング)します。通常

    jQueryでAjaxを利用する基本チュートリアル (1/4)
  • [CSS]大きい画像をブラウザのサイズに合わせて背景に表示するスタイルシート

    CSS-Tricksから、大きい画像を余白を作らずにブラウザのサイズに合わせて、背景に表示するスタイルシートを紹介します。 Perfect Full Page Background Image 下記、それを実装する要件とテクニックを二つ、それぞれポイントをピックアップして紹介します。 実装の要件 前提として、画像のサイズを調整する必要があるため、background-imageプロパティでの配置は不適格とします。 それを踏まえ、以下の条件をクリアさせます。 ページは画像でいっぱいに、余白は無しで 画像の大きさは自動調整 画像の比率は維持 画像はページ中央に 画像はスクロールさせない クロスブラウザ対応 一つ目のテクニックは余分なマークアップが必要で、IE6用にJavaScriptを使用したものを紹介しています。 二つ目のテクニックは、余分なマークアップを無くし、JavaScriptも必要と

    utalab
    utalab 2009/09/22
  • ExcelデータのWeb化で情報共有をスムーズに

    Webクエリでダイナミックにインターネットやイントラネットのデータを収集 今回は、「Office Excel(以下、Excel)データのWeb化」をテーマに業務効率を高める手法やツールを紹介したい。 連載Index 【第1回】「脱・Excel」から脱するためのExcel活用 【第2回】ExcelデータのWeb化で情報共有をスムーズに 【第3回】オフィスに眠るExcelデータから新発見? クロス集計を活用する 【第4回】Excel+OLAPでスタートする「身近なBI」 前段として、Excelに搭載されている「Webクエリ機能」を利用し、WebとExcelのデータを同期させながら、ダイナミックに情報を収集する方法について触れておこう。これは、WebデータをExcelデータとして取り込む方法である。今回の「ExcelデータのWeb化」とは逆のプロセスとなるものの、WebからExcelに最新データ

    ExcelデータのWeb化で情報共有をスムーズに
  • HTML5互換のISO-8601日付フォーマットライブラリ書いた。 - IT-Walker on hatena

    JavaScriptには、日時を表すフォーマットとして標準的なISO-8601互換のフォーマットを扱う関数がありません。 (ECMAScript5th/JavaScript2には、Date.prototype.toISOString()として含まれますが、使えるブラウザが限られます) ISO-8601と言うのは、「2009-09-09T11:32:23.123Z」のような形式です。 なので、ISO-8601をフォーマット/パースできるライブラリ、ISO8601.jsを書きました。 初めてのGithubです。 http://github.com/shumpei/iso8601.js/tree/master セットアップ セットアップは簡単で、ここからISO8601.jsのソースファイルをダウンロードし、scriptタグで読み込むだけです。 <script type="javascript"

  • jQueryのMooToolで実現するカレンダープラグイン集「10 Beautiful jQuery and MooTool Calendar Plugins」

    TOP  >  WebDesign  >  jQueryのMooToolで実現するカレンダープラグイン集「10 Beautiful jQuery and MooTool Calendar Plugins」 javascriptのライブラリとして人気が高い、jQueryとMootool。両方ともかなり高機能で様々な事を実現する事ができますが、今回紹介するのはjQueryのMooToolで実現するカレンダープラグイン集「10 Beautiful jQuery and MooTool Calendar Plugins」です。 Full Calendar – Demo jQueryのMooToolを用いて制作された様々なカレンダーが集められています。今日はそのなかからいくつかきになったものをピックアップして紹介したいと思います。 詳しくは以下 ■jQuery UI Datepicker – Dem

    jQueryのMooToolで実現するカレンダープラグイン集「10 Beautiful jQuery and MooTool Calendar Plugins」
  • [JS]jQueryのプラグイン33+1選 -2009年9月

    当サイトではCookieを使用しています。引き続き当サイトを閲覧することにより、ポリシーを受け入れたものとみなされます。今後表示しない詳しく見る

  • jQueryで実装する進捗グラフ付き複数ファイルアップローダー:phpspot開発日誌

    Multiple File Upload With Progress Bar Using jQuery jQueryで実装する進捗グラフ付き複数ファイルアップローダー。 次のようなマルチファイルアップローダーが実装できるjQuery+PHPなソースが公開されています。 アップロード部分には swfupload を使っているみたい。 サイトではjQueryを使っていて、こういう機能を実装したいという場合に覚えておくと使えるかも。 関連エントリ jQueryでチェックボックスをすごい形にカッコよくしちゃう方法 jQueryでリアルタイムにCSSを書き換えるサンプル jQuery用のGUIコンポーネントプロジェクト「mbideasproject」がすごい ナビゲーションのUIはこれで完璧かもなjQueryプラグイン集

  • 魅力的なUIにするためのjQueryプラグイン20 – creamu

    Six Revisionsで、魅力的なUIにするためのjQueryプラグインが紹介されています。 ざっといくつかご紹介。 » SimpleModal シンプルなモーダルウィンドウ » Panel Gallery ユニークなトランジションを持つスライドショー » Easy Image Gallery サムネイル表示型のイメージギャラリー » PikaChoose Belvedere Incに見られるクールなギャラリー » SlideBox たくさんのリンクを表示できるスライドボックス » Single Drop Down Menu シンプルなドロップダウンメニュー » Mouse Over Animation for Text テキストにマウスオーバーすると、明度を変えてくれたりうにょ〜っと拡大してくれるエフェクト あまり見たことのないものやシンプルで使いやすそうなギャラリーなどが揃っていま

  • テーブル操作に使えそうなjQueryプラグイン色々:phpspot開発日誌

    テーブル操作に使えそうなjQueryプラグイン色々なエントリのご紹介。 面倒なテーブル表示・ソート・検索なんかの機能をjQueryプラグインで簡単に付けられるのは便利ですが種類もいろいろあります。 ストックとして覚えておけば、いつか使えそうです。 DataTables Tablesorter Flexigrid jQuery treeTable こういうウィジェットが最低1行で実装できてしまうのですから、すごい時代ですね。 リンク先は以下より参照してください。 15 Great jQuery Plugins For Better Table Manipulation

  • [JS]パララックス効果でパネルをダイナミックにスライドさせるスクリプト

    jQueryを使用して背景にパララックス(視差)効果を持たせ、パネルをダイナミックにスライドさせるチュートリアルをIn The Woodsから紹介します。 Create a Funky Parallax Background Effect using jQuery demo デモではちょっと酔いそうな感じもありますが、右上のナビゲーションからパララックス効果を楽しめます。 実装はパネルもナビゲーションもリスト要素で、パララックス効果を生み出している雲は空divで配置されています。 スクリプトはjQueryとそのプラグイン「jQuery.ScrollTo」が利用されており、ポジションやタイミングを変更することができます。

  • PHPとjQueryのAjax連携の学習用チュートリアル:phpspot開発日誌

    Learning jQuery: Submit form PHP Mac style Modal window | AEXT.NET PHPとjQueryのAjax連携の学習用チュートリアルが公開されています。 macスタイルのログインフォームからjQueryでAjax送信してリアルタイム認証を行うサンプルです。 それぞれ簡単なコードになっているので入門にも最適で、かつ成果物もクール。 デモページ 入門としてだけでなく、サンプルとして応用して使ってみるのもよさそうです。 関連エントリ ナビゲーションメニューを1歩進んだものに引き上げるjQueryチュートリアル集 JavaScriptのウィジェット作成や各種メニュー作成等、便利なチュートリアル集のまとめ jQueryでアコーディオン作成のチュートリアル 無限に回転するカルーセルUI実現用jQueryプラグイン実装チュートリアル

  • 【ハウツー】jQuery on iPhone - jQTouchを使ったWebアプリ開発 | エンタープライズ | マイコミジャーナル

    新着記事一覧 Firefox 4は2010年秋に登場、Mozillaがロードマップ更新 [14:18 9/8]  【レポート】開発者のためのMicrosoft Tech・Ed Japan 2009レポート [14:12 9/8]  パイオニア、マルチ・エンタテインメント・ミキサー「DJM-5000」発売 [14:01 9/8]  キヤノン、Webプリント機能を搭載するなどスペックアップした複合機6モデル [14:00 9/8]  キヤノン、L判フチなしプリントが約17秒という高速なフォトプリンタ [14:00 9/8]  キヤノン、A3ノビにまで対応したカラーレーザー並みのビジネスプリンタ [14:00 9/8]  キヤノン、A3ノビにまで対応したハイパフォーマンスビジネスプリンタ [14:00 9/8]  約40年間のシンセサイザーの歴史をすべて包括した巨大シンセ音源「TITAN」 [1

  • 超クールなJavaScriptプラグイン40 – creamu

    nettuts+で、超クールなJavaScriptプラグインがまとまっています。 いくつかご紹介しますね。 » JQuery Validate jQueryによるクライアントサイドのバリデート » PrettyCheckboxes – jQuery FancyFormと似たかわいいチェックボックスを作るjQueryライブラリ » Thickbox 画像だけでなくテキスト等も読み込めるlightbox » FancyBox 超クールなFancybox。画像をすーっと拡大してくれる。デザインがMacライク » Slideshow 2! for MooTools とてもクールなMooToolsによるスライドショー » SmoothGallery こちらも超クールなスライドショー。MooTools v1.11を使用 » DynamicDrive – Carousel Slideshow 3Dに魅せ

  • iPhoneのJavaScriptアプリをAndroidに3行で移植 (1/4)

    iPhone 3G向けのJavaScriptAndroidでも動かそう iPhone 3Gの発売から約1年。今年7月、噂のグーグル携帯ことAndroid携帯(HT-03A)がNTTドコモから発売されました(関連記事)。6月に開催されたGoogle Developer Day 2009で同端末が先行配布されたこともあり、すでに使い込んでいる開発者の方も多いでしょう。 Androidのアプリケーションといえば、Android専用のネイティブアプリに目が行きがちですが、当然Webブラウザー上で動くWebアプリケーションも使えます。AndroidにはWebアプリのオフライン利用を実現するブラウザープラグイン「Gears」(旧名Google Gears)が標準で搭載されており、ローカル環境だけでも簡単なアプリを動かせます。 今回のJavaScriptラボでは、連載の第1回、第2回で作成したiPh

    iPhoneのJavaScriptアプリをAndroidに3行で移植 (1/4)
  • 自動でスクロールするシンプルなニュースティッカーの作り方 – creamu

    nettuts+で、自動でスクロールするシンプルなニュースティッカーの作り方が公開されています。 id=”ticker”のdlを用意して、dt、ddタグでリストを記述。CSSを指定して、JavaScriptを記述。マウスオーバーするとストップするティッカーとなっています。 win IEのfixもされているようですね。 ティッカーを作りたい方はぜひ見てみてください。 » How to Create a Simple News Ticker カフェで作業中。TVが昨日から映らなくなったので(ついに・・約20年ものです)、でかいのを見にいこうかな。40インチとかほしー!

  • [JS]セレクトメニューの中身を印刷できるようにするスクリプト

    select要素で実装したセレクトメニューの中身を印刷や印刷プレビュー時に表示させるスクリプトをCSS-Tricksから紹介します。 <textarea name="code" class="js" cols="60" rows="5"> $(function(){ $("select").each(function(i){ var $el = $(this); var $options = $el.find("option"); $el.after("<div class='print-select'>Options: <ul id=sel"+i+"></ul></div>"); var $curPrintBox = $("#sel"+i); $options.each(function() { $curPrintBox.append("<li>"+$(this).text()+"</l

  • jQueryでアコーディオン作成のチュートリアル:phpspot開発日誌

    Photoshop Tutorials - HV-Designs.co.uk jQueryでアコーディオン作成のチュートリアルが公開されています。 HTML+CSSでのスタイリング〜jQueryのコードまで。 ちょっとした入門記事としてよさそうです。 関連エントリ ナビゲーションメニューを1歩進んだものに引き上げるjQueryチュートリアル集 JavaScriptのウィジェット作成や各種メニュー作成等、便利なチュートリアル集のまとめ

  • jQueryを使ったドラッグ&ドロップパネルのチュートリアル – creamu

    Web Designer plusで、jQueryを使ったドラッグ&ドロップパネルチュートリアルが紹介されています。 iGoogleWordPressの管理画面で見られるインターフェースですね。 HTMLCSS、jQueryのソースが公開されています。 ソートの順番は、ドラッグ後に以下のような文字列が生成されて、サーバサイドで処理しているようですね。 column1=item1,item3&column2=item4,item2,item5& 一度見てみてはいかがでしょうか? » Collapsible Drag & Drop Panels Using jQuery Gadget Partyでも、ガジェットの管理のページでガジェットの順番を変えられて、ブログパーツでの表示順を変更できます。F.Ko-Jiがさくっと実装してくれました。 今日も天気がよくて気持ちいいですねー。いろいろと出か

  • CSS, JavaScript, jQuery, WordPressなどのよく使うコードをまとめたスニペット集

    HTML, HTAccess, CSS, JavaScript, jQuery, PHP, WordPressのよく使うコードをまとめたスニペット集をCSS-Trickから紹介します。 Code Snippets CSSでフッタを下にするのはどうするんだっけ? 異なるdivの高さを揃えるのはどうするんだっけ? など便利なコードがたくさんまとまっています。 CSS, jQuery, WordPressは下記のようになっています。他にもHTML, HTAccess, JavaScript, PHPにもたくさんのスニペットが登録されています。

  • [jQuery]フォームの入力欄にデフォルトで文字列を入れておいてフォーカスしたら消す | バシャログ。

    テキストフィールドの入力欄に「キーワードを入力してください」とかデフォルトで入れておいて、フォーカスした時に消す、というインターフェースを簡単に実装する jQuery のプラグインをご紹介します。 jquery.fieldtab.js 導入はとても簡単です。 まずは上記のサイトから「jquery.fieldtag.js」をダウンロード。 次に HTML の head 内に以下のコードを。#hoge のところは適用したいテキストフィールドの id を入れます。 <script type="text/javascript" src="jquery.fieldtag.js"></script> <script type="text/javascript"> /* <![CDATA[ */ $(function(){ $("#hoge").fieldtag(); }); /* ]]> */ </s

    [jQuery]フォームの入力欄にデフォルトで文字列を入れておいてフォーカスしたら消す | バシャログ。
  • jQueryによるフォームのデザインの基礎(後編) (1/5)

    (前編からの続き) 3.フォーム部品を選択するセレクター jQueryには、フォーム部品を選択する専用のフィルター(セレクターの一種)が多数あります。専用フィルターで選択できる要素は、ほとんどの場合、以前に紹介したjQueryのCSSセレクターでも選択できますが、専用フィルターを使うとより簡単です。 ■フォーム部品を選択する:input :inputは、input要素やtextarea要素、select要素、button要素など、すべてのフォーム部品を選択できるフィルターです。 次のサンプルは、いずれかのフォーム部品がフォーカスされると、フォーカスされた要素の背景色をcss()で変更します。フォーカスが外れると、再びcss()で背景色を元の色(初期値)に戻します。背景色に限らず、CSSを初期値に戻すきには、css("background",""); のように、値を設定せずにプロパティ名だけ

    jQueryによるフォームのデザインの基礎(後編) (1/5)
  • デザインの邪魔をしないシンプルで小粋なjQueryエフェクト集「21 Simple and Useful jQuery Tutorials」

    TOP  >  WebDesign  >  デザインの邪魔をしないシンプルで小粋なjQueryエフェクト集「21 Simple and Useful jQuery Tutorials」 非常に高機能で軽量なjavascriptライブラリとして様々な機能を提供してくれるjQuery。様々なシーンで利用されていますが、今回紹介するのはデザインの邪魔をしないシンプルで小粋なjQueryエフェクト集「21 Simple and Useful jQuery Tutorials You Might Have Missed」です。 Vertical Scroll Menu | Demo ナビゲーションメニューからギャラリーなどジャンル別に全部で21個のエフェクトが紹介されていますが、今回は其の中からいくつかピックアップして紹介したいと思います。 詳しくは以下 ■Four Corners Sliding

    デザインの邪魔をしないシンプルで小粋なjQueryエフェクト集「21 Simple and Useful jQuery Tutorials」
  • ついつい長居してしまう専門的なサイト25選 - かちびと.net

    仕事があるのについつい長居してしまう サイトって無いですか?何かを大量に まとめてあるサイトだったり、掘り下げたく なるような専門サイトだったり、理由は様々です。 僕も例外なく気が付いたら全然仕事してない時も あります。そんなサイトを25サイト選んでご紹介します。 中には僕にはまだ必要ないサイトもありますが、こんな専門サイトもあるよ、って事で。因みに一貫性は全くありません。ただ、「長居しちゃう」ってだけ。順不同です。 SourceForge.JP 日語で読めるオープンソース配布サイト。ここはかなり素敵。 SourceForge.JP OpenSourceCMS オープンソースのCMSに絞った海外の配布サイト。ブログとかEC系とかやたらあります。管理画面のデモもあるのでDLする前に触れるのは嬉しい。 OpenSourceCMS Twitpaper Twitterの背景の秀逸なデザインをダウ

  • ステルスデスクトップ ~究極のデスクトップを求めて | ライフハッカー・ジャパン

    読者lostboy79designのデスクトップは機能性をデスクトップ上からサイドのスライドアウトタブへと移動させ、システム統計やランチャーを画面下へと配置したデスクトップ: Samurize:スケジュール、To-Doリストなどのメモ、Winampパネル、タスクバーなどを含むスライダーパネル用のStealth Series 3 Configuration Suite オブジェクトドック:Ecqlipse 2アイコン by Chrfb. 壁紙: Dolph by Richard Mohler. フォント:Continuum Bold. 詳しく見てみたい方はこちらの動画(2分)をどうぞ。じっくり見るとますますかっこいいデスクトップですよ。 もっと画像を見たい方はこちらのリンクからどうぞ。 パソコンに詳しくない方でも簡単に使えるRainmeter 1.0も出たことだし、このシリーズもなかなかロン

    ステルスデスクトップ ~究極のデスクトップを求めて | ライフハッカー・ジャパン
  • [CSS]ドロップリストとフライアウトを効果的に組み合わせたナビゲーション

    CSSplayから、垂直方向のドロップリストに打ち出し画像やテキストをフライアウトさせるナビゲーションを実装するスタイルシートを紹介します。 A Vertical menu with flyout lists demo デモでは垂直方向のドロップリストの第三階層にフライアウトが表示されます。 フライアウトされたパネルには画像やテキストをはじめ、複数のリンクを配置することも可能です。 対応ブラウザは、IE6/7/8, Fx, Op, Safari(PC),Chromeとのことです。

  • [JS]軽快に開閉するセクシーなパネルを実装するチュートリアル

    CSS3を使った、軽快に開閉するセクシーなパネルを実装するスクリプトのチュートリアルをspyrestudiosから紹介します。

  • jQueryによるフォームのデザインの基礎(前編) (1/3)

    前回まではjQueryの基的な使い方である、「セレクターで(X)HTML要素を指定し、イベントが発生したタイミングで(X)HTMLCSSを書き換える」プログラムの書き方を紹介してきました。jQueryにはほかにも、Webページを使いやすくする便利な機能が用意されています。今回からは、これまでに触れていない特別な機能を紹介していきましょう。 第8回は、「問い合わせフォーム」など、商用サイトには欠かせない(X)HTMLフォームをjQueryで制御する方法です。jQueryには、1.フォーム部品の値を取得・変更する命令、2.フォームに関するイベントの処理、2.フォーム部品を選択するセレクター――といったフォーム関連の機能が揃っています。 1.フォーム部品の値を取得・変更する命令 フォームを操作する専用の命令が、val() です。val() を使えば、フォームに入力/選択されている値を取得した

    jQueryによるフォームのデザインの基礎(前編) (1/3)
  • JSONとJSONPの違い - あと味

    解説は他にもたくさんありますが、私自身も使いはじめの頃、違いがよくわからなかったので。 JSONとは? 汎用的なデータ記述方法です。こんな感じで書きます。 { 'blog' : 'あと味', 'author' : 'jdg' } まさにJavaScriptのオブジェクトですね。*1 JSONPとは? JSONを以下のように変えたもの。 callback({ 'blog' : 'あと味', 'author' : 'jdg' }); 関数呼び出しっぽいですね。まぁ、関数呼び出しなんですけど。 どゆこと?となるポイント 見た目が関数っぽくなる意外に変更点はないように見えますが、クロスドメインでJSONを読み込む時は、なぜかJSONではなく、JSONPが使われます。(WebAPI等) また、アクセスしたらJSON形式のデータを返す単純なCGIを自分で作りたいと思った場合でも、JSONを返しても、J

    JSONとJSONPの違い - あと味
  • CSS3の機能でボックスに角丸や影、グラデーションをかけられるJSライブラリ「tripleb.js」:phpspot開発日誌

    CSS3の機能でボックスに角丸や影、グラデーションをかけられるJSライブラリ「tripleb.js」 2009年09月02日- tripleb.js (javascript CSS 3 simulation) CSS3の機能でボックスに角丸や影、グラデーションをかけられるJSライブラリ「tripleb.js」 ライブラリを読み込んだら、ボックス要素の class="***" に修飾条件を指定しておくだけで、自動でボックスを角丸や、影付き、グラデーション効果 を与えることができるみたいです。 ↓適用すると以下のように修飾されます↓ 配布元は、色々なライブラリで有名な www.netzgesta.de。 CSS3の機能を使うので非対応ブラウザでは使えませんが、面倒な部分もJavaScriptでサクッと実現できちゃいますね。

  • デザイン的に優れているjQueryプラグイン集「22 Beautiful jQuery Plugins for Web Designers」

    TOP  >  WebDesign  >  デザイン的に優れているjQueryプラグイン集「22 Beautiful jQuery Plugins for Web Designers」 軽量で高機能なjavascriptライブラリとして様々な用途に広く使われているjQuery。Designdevelopでも様々なプラグインを紹介してきましたが、今回紹介するのはデザイン的に美しいjQueryプラグインを集めたエントリー「22 Beautiful jQuery Plugins for Web Designers」を紹介いたします。 様々な動作を可能にするプラグインが紹介されていますが、今日は其の中からいくつか気になったものを紹介したいと思います。 詳しくは以下 ■Sliding boxes and captions with jQuery 様々な動作で画像にキャプションがつけられるjQuery

    デザイン的に優れているjQueryプラグイン集「22 Beautiful jQuery Plugins for Web Designers」
  • マウスオーバーで画像を扉のように左右にアニメーションさせるjQueryサンプル:phpspot開発日誌

    Image splitting effect with CSS and JQuery ・TutsValley マウスオーバーで画像を扉のように左右にアニメーションさせるjQueryサンプルが公開されています。 画像上にマウスを置くと、ビローンと中心から半分に割れて左右にアニメーションしていきます。 デモページ 面白いのは、1枚の画像でこれを実現しているところです。 CSSで2枚のブロックを作って、それをアニメーションさせています。 応用することで、縦方向に分割したりと、他にも面白いことが出来そうです。 関連エントリ jQuery用のGUIコンポーネントプロジェクト「mbideasproject」がすごい ナビゲーションのUIはこれで完璧かもなjQueryプラグイン集 ユニークで使えそうなjQueryプラグイン10個

  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
    utalab
    utalab 2009/09/22
  • [JS]省スペースに複数のパネルをスライド表示するチュートリアル

    jQueryで実装する、省スペースに複数のパネルをスライド表示するシンプルなスクリプトのチュートリアルをdevirtuosoから紹介します。 jQuery Slideshow Explained demo デモでは、右下の数字をクリックすると対応したパネルをスライド表示させます。また、自動プレイにも対応しています。 パネルはdiv要素で、画像やリンクやテキストなどを自由に配置することができます。 スクリプトはjQueryを使用しているため、実装にはjquery.jsが必要です。

  • jQueryでリアルタイムにCSSを書き換えるサンプル:phpspot開発日誌

    Live CSS Editing With jQuery | Dev Words jQueryでリアルタイムにCSSを書き換えるサンプルが公開されています。 デモページ 次のようなコードで容易にページの<style>の中身を書き換えちゃうというサンプルです。 これを応用して、ブックマークレットでLightBox起動→中身書き換え→反映 なんていうことをやっても便利に使えるかもしれませんね。

  • 13,400円で宇宙からの写真を撮ったMITの学生の話 | 秋元@サイボウズラボ・プログラマー・ブログ

    これがその写真の一枚 マサチューセッツ工科大の二人の学生Justin LeeさんとOliver Yehさんが、普通にお店で入手できる部品を組み合わせることで、これまでにない超低予算(148ドル)での成層圏からの地球撮影に成功した、ということです。 その手順ですが、まず、気象観測用の300グラムのゴム気球(1800円)、それにパーティーグッズの店でヘリウムを2700円分詰めてもらいます。 成層圏での気温は-55度にもなるので、普通のバッテリーは動かなくなります。そこで、高価な耐寒機器やヒーターを搭載する代わりに、携帯カイロを電気系に密着させ発泡スチロールでカバーします。 撮影した写真がどの高さから取られているかを記録し、撮影を終えたカメラを回収するためには、カメラの場所を追跡する必要がありますが、これも高価で重いGPSモデムではなく、GPS内蔵の携帯電話(4500円)を使うことに。カメラと接

    13,400円で宇宙からの写真を撮ったMITの学生の話 | 秋元@サイボウズラボ・プログラマー・ブログ
  • トリプルルービックキューブ | 秋元@サイボウズラボ・プログラマー・ブログ

    ルービックキューブのバリエーションは(4x4x4、5x5x5, 6, 7と増えていったり、五角形とか丸い奴とか)いろいろありますが、こういうのもあるんですね。 どう回るのか、写真からは想像できませんが、解ける気がぜんぜんしません。 こうなるともう何がなんだか… via conjoined rubik’s cubes make my head spin on [technabob]

    トリプルルービックキューブ | 秋元@サイボウズラボ・プログラマー・ブログ
  • アマゾンレビュー一気読みサイト Revilist を iPhone のバーコードリーダーアプリ経由で使う

    アマゾンレビュー一気読みサイト Revilist を iPhone のバーコードリーダーアプリ経由で使う 2009-09-18-4 [iPhone][LifeHacks][Video] Revilist (ttp://revilist.net/)は、アマゾンが扱っている書籍や商品のレビューだけを一気に読むためのネットサービスです。 ケータイ版(ttp://revilist.net/kt.cgi)もあるので、屋さんで目の前のの「アマゾンでの書評」だけをすばやく知るためのツールとしても使えます。 とはいえ、ケータイ版だと13桁のISBNをその場でポツポツと打ち込まなければなりません。 ちょこっと面倒くさかったりします。 そこで、iPhone ユーザのためのソリューションです! iPhone 用のバーコードリーダーアプリ「QuickMark」を使い、「ISBNバーコード」をサクッと読ませて

    アマゾンレビュー一気読みサイト Revilist を iPhone のバーコードリーダーアプリ経由で使う
  • 【新聞広告.com】新聞広告検索ポータルサイト

    皆さんは、「パパ活」という言葉をご存じだろか? 最近日貧困化が進み先進国でありながら成長性が皆無です。 お金に余裕がない若者も後を絶ちません。 若い女性はの一部はこれを解決するためにセフレを作っています。 具体的にどうするかと言うと、大人に援助してもらうのである。 Continue reading 日貧困化!生活苦でセフレ男性にパパ活として資金援助を求めている 男性側は、恋愛結婚したにも関わらず浮気してしまう場合が多い。 これは、周知の事実である。 しかし、問題なのは結婚した相手にその事実が判明しない事である。 浮気にはリスクがある。 そんな中、SNSで「嫁にバレずにセフレが作れてしまう」という方法が判明したのです。 簡単に説明すると、出会い系でセフレを作る。 URL(外部):https://www.セフレの作り方.jp/ そして、隠れて連絡を取る。 という昔ながらのパターンである

  • 新聞・雑誌の切り抜きはiPhone(JotNot+Evernote)でやることにした

    IT×経営×クリエイティブな起業を目指すbeckのblog。主な話題はiPhoneをはじめとしたMobileネタ、 手帳/メモ/ノート術、仕事術、スキルアップ、ライフハック、ビジネス書の書評など。 年齢:27歳 誕生日:1982/11/30 性別:男 職業:システムエンジニア ウェブサイトURL:http://pei.seesaa.net/ メールアドレス:beck1240@gmail.com 一言:モバイル業界なSE6年選手のbeckです。Creativeな人生を全うすべく日々精進中。このBlogで扱うネタは興味の赴くままにLifehack仕事術、手帳/ノート/メモ、Evernote、情報整理、人生、勉強、IT、モバイル、Creative、起業等々。趣味はバレーボール。主な活動は以下の通り ■Author系活動 gihyo.jpでEvernote連載執筆中 「ただのメモでは勿体ない!E

    新聞・雑誌の切り抜きはiPhone(JotNot+Evernote)でやることにした
  • 本の裁断サービス|高速スキャナのレンタル|本のスキャン・自炊・電子化に|scanbooks.jp(スキャンブックス)

    年末年始の営業日について 2023.12 お申込みの受付対応、到着した書籍の保管は年末年始も毎日行っておりますが、12月31日~1月3日まで長野裁断工場での裁断作業のみお休みとさせて頂きます。何卒、ご了承頂きますようお願い致します。 新年明けましておめでとうございます 2023.1 年もお引き立てのほど、宜しくお願いいたします。 GW中のの営業日について 2021.4 GW中も休業せず、通常通り営業いたします。 営業再開のお知らせ 2020.06 新型コロナ対策のため、臨時休業を行っておりましたが、日6月1日より営業を再開致します。 新型コロナ対策の休業について 2020.04 大変申し訳ございませんが、新型コロナ対策のため、しばらく休業とさせていただきます。 お盆期間中の営業について 2019.08 お盆期間中も休まず営業しております。お申込み・お問い合わせも通常通り受け付けています

  • https://jp.techcrunch.com/2009/09/08/20090906life-recorders-may-be-this-centurys-wrist-watch/

    https://jp.techcrunch.com/2009/09/08/20090906life-recorders-may-be-this-centurys-wrist-watch/
  • 「JotNot」iPhoneをスキャナにするアプリ(Evernote転送可) - ネタフル

    iPhone」のカメラでノートやメニューなどの紙類を撮影すると、補正してきれいな状態でスキャンすることができる「JotNot」というアプリを試してみました。 使い方としてはまず、写真を撮ります。 今回はラーメン屋さんのメニューを撮影してみました。 「Use」をタップすると‥‥ このようにドラッグできる青い四角が表示されます。この四隅をドラッグして、紙の大きさに合わせます。 けっこう簡単に合わせることができますよ。合ったら右上の「Process」をタップします。 すると‥‥ 切り抜いてくれた! 切り抜いたものは‥‥ Evernoteに転送したり‥‥ PDF/JPG/PNGのフォーマットを選んで、メール送信することが可能です。うほっ、これは便利! Evernoteを使っている人であれば、レシピやレシート、感動したの一節、雑誌の切り抜きのようなこともできてしまうかもしれませんね。 病院の受付

    「JotNot」iPhoneをスキャナにするアプリ(Evernote転送可) - ネタフル
  • iPhoneでミニチュア風写真を加工してみた! - ネタフル

    ミニチュア風レトロ写真を撮影するiPhoneアプリ「TiltShift Generator」で、少し上手に加工できるようになった気がするので、写真を公開してみます! ちなみに、うまくいかないなぁと思っていたら「オンラインで試せる、iPhoneミニチュア風写真の作り方」というチュートリアルを教えて頂いたのです。 詳しくはそちらを読んで頂くとして、ポイントは以下の二つ。 ・色を鮮やかに ・前景と背景を両方ボカス ということです。あとは、上から視点の写真が加工しやすそうです。 ↑の写真の元になっているのがこちらです。 ビフォアー&アフターを見比べると、面白いですよねぇ。 続いて何枚かいってみます! アフター ビフォア アフター ビフォア アフター ビフォア どうでしょうか、なかなかミニカーみたいになっていませんか? 最初は難しいかもしれませんが、コツを掴んでしまうと簡単ですよ。 ちなみに、全ての

    iPhoneでミニチュア風写真を加工してみた! - ネタフル
  • YAPC::Asia 2日目 「はてなブックマークのシステムについて」 - naoyaのはてなダイアリー

    2日目の発表も終えました。資料を公開します。 はてなブックマークのシステムについてView more presentations from Naoya Ito. 今日も少し駆け足気味でした。YACP::Asia 2009、今年も楽しかったです。Hackathon 出ずに京都に戻らなければならなかったのが悔やまれます。 発表の様子 撮影: id:hirose31

    YAPC::Asia 2日目 「はてなブックマークのシステムについて」 - naoyaのはてなダイアリー
  • JavaScriptで実行するファミコンエミュレータ·JSNES MOONGIFT

    JSNESはJavaScript/Perl製のオープンソース・ソフトウェア。今やゲームと言えば任天堂、ソニー、マイクロソフトの三つどもえになっている。20年くらい前はファミコンくらいしかなかった。今のゲームは高性能で、グラフィックス性能は向上し、リアルなゲームが楽しめるようになっているが、旧来のファミコンのグラフィックスに回帰する人も少なくない。 ブラウザ上のファミコンエミュレータ そんな昔を懐かしむ人はエミュレータを使ってゲームを楽しんでいたりする。そしてファミコンは専用のソフトウェアを使うことなくブラウザだけで楽しめるようになってしまった。それがJSNESだ。JSNESはJavaScriptを使って各種ファミコンゲームをブラウザ上で楽しめるソフトウェアだ。 当たり前だがROMは別途必要だ。そしてROMを変換し、ブラウザ上で使えるようにしているようだ。実際のHTMLではCanvasを使っ

    JavaScriptで実行するファミコンエミュレータ·JSNES MOONGIFT
  • Windowsで作るiPhoneアプリケーション「winChain Builder」 MOONGIFT

    iPhoneアプリは企業はともかく個人としてはとても魅力的な市場だ。課金システムがあること、さらに市場は世界に広がっている。iPhoneアプリの開発を行いたくてMac OSXを購入したという人も少なくないだろう。そう、iPhoneアプリの開発にはMac OSX環境が必須なのだ。 WindowsiPhoneアプリ開発!? とは言え基はObjective-Cだ。つまりCのAppleによる拡張であり完全に依存している訳ではない(はずだ…)。WindowsでもなんとかiPhoneアプリの開発を実現させようとしているのがwinChain Builderだ。 今回紹介するオープンソース・ソフトウェアはwinChain Builder、Windows上でiPhoneアプリ開発環境を整えるソフトウェアだ。 Windows上でiPhoneアプリの開発を行う場合、Cygwinを使って行うのが基になるよう

    Windowsで作るiPhoneアプリケーション「winChain Builder」 MOONGIFT
  • VIPをドット絵で・・・『Very Important Pixels』 | 100SHIKI

    これはうまいですな。 VIPであるVery Important Personをドット絵で表現してあるから「Very Important Pixels」、ということですな。 映画のディレクターやスターウォーズの主要人物、歴代ジェームスボンドなどがドット絵で表現されています。 まだ数は少ないが、今後はもっと充実していくだろう。またTシャツ販売なども考えられているようだ。 ドット絵好きにはたまらないですな。

    VIPをドット絵で・・・『Very Important Pixels』 | 100SHIKI
  • ジャーナリストのTwitterアカウントが探せる『Journalist Tweets』 | 100SHIKI

    速報メディアとしてのTwitterを最大限に活用したいなら、Journalist Tweetsもおすすめだ。 このサイトではジャーナリストのTwitterアカウントを探すことができる。 プロとしてニュースを追いかけている人のつぶやきを追っていれば、人よりも速く情報を仕入れることができるかもしれない。 こうした職業別のTwitterアカウントをまとめる、という試みはよいですな。横展開していってもらいたいものである。

    ジャーナリストのTwitterアカウントが探せる『Journalist Tweets』 | 100SHIKI
  • カフェで仕事をする人を支援するiPhoneアプリ『WorkSnug』 | 100SHIKI

    まだリリース前だが、なかなか便利そうなのでご紹介。 WorkSnugはいわゆる「カフェで仕事をする人」を支援するためのiPhoneアプリだ。 このアプリ、AR(拡張現実)を利用しており、近くの風景をiPhoneを通してみれば、どこにどんなカフェがあるかが浮かび上がってくる、というものだ。 もちろんカフェの名前だけでなく、電源が使えるか、うるさくないか、他の人のレビューなども合わせてみることができる。 外で仕事をする人が増えてきた昨今、こういうアプリは歓迎されるのではないですかね。 今のところ、ロンドンとサンフランシスコで導入予定らしい。今後の展開を見守りたいところだ。

    カフェで仕事をする人を支援するiPhoneアプリ『WorkSnug』 | 100SHIKI
  • 映画のサントラを検索、その場で視聴できる『MoMuPl!』 | 100SHIKI

    他のツールでも出来ることだが、シンプルで使い勝手が良かったのでご紹介。 MoMuPl!はサントラ専用の検索エンジンである。 使い方は簡単で、映画のタイトルで検索すればサントラの視聴ができる、というものだ。 自分で「映画名 サントラ」などで検索すれば似たようなことができないわけではないが、実際に視聴できるサイトを探すのも面倒だろう。 そう考えるとこの一手間を軽減してくれるこうしたツールは便利だ。 もちろん気に入ればその場で購入することもできるし、Twitterで「今これを聴いているよー」とつぶやくこともできる。 日映画には残念ながら対応していないが、良い洋画を見たときには試してみたいですな。

    映画のサントラを検索、その場で視聴できる『MoMuPl!』 | 100SHIKI
  • 巨大な画像のビューアーを作ってくれる『Seadragon』 | 100SHIKI

    前に似たようなツールを紹介したような気がしないでもないが、やっぱり便利なのでかまわずにご紹介。 SeadragonはMicrosoft Live Labsが提供する画像ビューアーだ。 普通の画像だったらそのまま貼り付ければ問題ないが、巨大な画像だったらズームをさせたり、フルスクリーン表示をさせたり、といったことをしてもらいたいだろう。そうしたときに使えるツールである。 使い方も簡単で、このサイトで画像をアップロードし、生成されるコードを貼り付けるだけである。 アイデア次第でいろいろ使えるのではないだろうか。知っておいても損はないですな。

    巨大な画像のビューアーを作ってくれる『Seadragon』 | 100SHIKI
  • IKEA店内だけで撮影されたメロドラマ『IKEA Heights』 | 100SHIKI

    IKEA店内だけで撮影されたメロドラマ『IKEA Heights』 September 14th, 2009 Posted in 画像・映像管理 Write comment ちょっと微妙だが、試みがユニークなのでご紹介。 IKEA HeightsはカリフォルニアにあるIKEA店舗で撮影されたメロドラマを連載している。しかもお店に内緒で・・・(ということになっている)。 たしかにIKEAにはメロドラマに必要なセットが所狭しと並んでいるが・・・どうなんだろう。 ただ、あるものだけで何かを作り上げよう、という心意気は良い。セットはIKEA、撮影は多分普通のビデオ、そしてVimeoとTumblrを組み合わせてきわめて安価に作品を作り上げている。 この時代、それだけ便利なツールが揃った、ということでもあるのだろう。身の回りにあるものをうまく使ってクリエイティブを発揮していく姿勢は見習いたいですな(だ

    IKEA店内だけで撮影されたメロドラマ『IKEA Heights』 | 100SHIKI
  • AppStoreに特化した検索エンジン『uquery.com』 | 100SHIKI

    iPhoneやiPod touchで使えるアプリもだいぶ増えてきた。それはそれで喜ばしいことだが、今度は良いアプリを探すのが大変になる。 そこで登場したのがuquery.comである。 このサイト、AppStoreに特化した検索エンジンである。 キーワードの検索したあとに値段やカテゴリー、リリース日で絞り込んでいける点が秀逸だ。これならきっと欲しいアプリが見つかるだろう。 残念ながら日語での検索には対応していない。誰か作るといいですよね・・・。

    AppStoreに特化した検索エンジン『uquery.com』 | 100SHIKI
  • ブラウザ上できれいなグラフがさくっと作れる『ChartGo』 | 100SHIKI

    さくっとグラフの画像だけが欲しい、というときもよくある。 そうしたときのためだけにExcelを立ち上げるのも面倒、という人におすすめなのがChartGoである。 これを使えば、ブラウザ上でグラフの種類、データを入力するとさくっとグラフ画像を生成してくれる。 特に目新しい機能があるわけではないが、基的な機能は揃っているので使い勝手は良いだろう。 覚えておいても良いですな。

    ブラウザ上できれいなグラフがさくっと作れる『ChartGo』 | 100SHIKI