タグ

javascriptに関するS0R5のブックマーク (211)

  • aaencode - Encode any JavaScript program to Japanese style emoticons (^_^)

    aaencode - Encode any JavaScript program to Japanese style emoticons (^_^)

  • JavaScript入門講座

    今日の内容 JavaScriptを勉強し始めくらいの人を対象にしたJavaScript入門講座的なもの 文法とかは調べればわかるのでふれません 一人で勉強してもわからなそうな概念などを重点的に説明します ライブコーディングするのでJavaScriptってこんな感じて作るんだなーというのがわかってもらえればと アジェンダ JavaScriptを勉強する前に JavaScriptの基礎知識 ライブコーディング part1 jQueryの基礎知識 ライブコーディング part2

  • jQuery製の時計ライブラリ·epiclock MOONGIFT

    epiclockはjQuery/JavaScript製のオープンソース・ソフトウェア。JavaScriptで時刻を利用する機械は意外と多い。指定時間ごとに自動保存したり、指定時間になったりアラートを出すようなこともある。Webアプリケーションを開発する際には避けては通れないだろう。 古めかしい感じの時計表示 そんな時には独自で実装する必要はない。既にライブラリは多数ある。jQueryを使って開発しているならばepiclockを使って実装してみよう。単純な時間表示以外にも多彩な機能が提供されている。 epiclockではカウントアップ型のタイマーや逆にカウントダウン、有効期限までの時間、ストップウォッチなど様々な時刻表時に対応している。さらにレトロな時刻表時を行うモードもある。時間を扱う際の多様なニーズに応えられるはずだ。 他にも色々な機能が jQueryなので、他のライブラリと組み合わせる

  • jQuery UI タブ

    jQuery UI タブ
  • ASCII.jp:HTML5 videoでニコニコ動画風プレーヤーを作ろう (1/7)

    HTML5テロッパーのサンプル。テキストエリアの文字がテロップとして動画の上に表示される画像クリックでサンプルページを表示します(Firefox 3/Opera 10/Safari 4で表示可能) 動画投稿サイト「ニコニコ動画」が人気です。ニコニコ動画はユーザーのコメントを再生中の動画にテロップのように表示する機能が特徴で、多くのユーザーがコメントを書き込んで楽しんでいます。 ニコニコ動画のようにブラウザー上で動画を再生しながらテロップを表示するには、従来、Flashが必要でした。Flash(Action Script)に習熟している開発者でなければ、ニコニコ動画のようなWebサービスは作れなかったのです。ところが現在、モダンブラウザーへの実装が進んでいるHTML5 videoなら、JavaScriptを使って簡単に文字や画像を動画に重ねられます。 今回はHTML5 videoとJavaS

    ASCII.jp:HTML5 videoでニコニコ動画風プレーヤーを作ろう (1/7)
  • まさに発想の転換。Jailbreak無しでiPhoneをFlash対応にする方法。

    まさに発想の転換。Jailbreak無しでiPhoneをFlash対応にする方法。2010.01.22 11:30 iPhoneがFlashに対応するのを首を長ーくして待っている方。なんと、Jailbreak無しでもFlashがiPhoneで再生できるプレイヤーが登場しました。 JavaScriptで書かれたオープンソースFlashプレイヤー「Gordon」は、FlashファイルをJavascriptを通してブラウザに指示することができるもの。このプレイヤーをページに組み込めば、iPhoneのSafariからFlashが見れてしまうということなんです。いやぁ、この発想はなかったわ。 開発者のページではソースコードのダウンロードとデモが見れます。 [Gordon via Slash dot japan] (遠藤充)

  • JavaScript + Canvas で動くカオスアトラクタ生成器作ってみた - mooz deceives you

    カオスアトラクタ by edvakf in hatena を見ていて Canvas でピクセル操作が出来るらしいことを知り、早速カオスアトラクタ生成器を作ってみた。 アクセスは C.H.A.O.T.I.C C.A.N.V.A.S から。 動作は Firefox 3.5 と Google Chrome で確認。処理速度は Chrome の方が 5 倍ほど速いので、一応 Chrome 推奨。 Safari や Opera では未確認。 で、操作説明。 Draw ボタンを押せばカオスアトラクタが描画される。 Settings 右のプルダウンメニューにいくつかプリセットの設定を用意しておいたので、はじめはそちらを試されるのが良いと思う。 Coefficients の値をちょびっとづつ変えていくと、生成される画像が綺麗に変化していってくれる。一期一会な感じが小憎い。画像は Firefox なら右クリ

    JavaScript + Canvas で動くカオスアトラクタ生成器作ってみた - mooz deceives you
  • 「HTML5のcanvasで作る画像フィルター」は自分ならこう書く - by edvakf in hatena

    ASCII.jp:HTML5のcanvasで作る画像フィルター|古籏一浩のJavaScriptラボ こちらの記事をたまたま拝見して、コメント欄もなければトラックバックもできないようなので、どうやって反応を返せばいいのかわからないけれど、もし古籏一浩さんご人が見てくれたらいいなあ、ということで書きます。 全体的にはとても素晴らしい記事なのですが、いくつか言いたいことがあります。 ImageData まず、CanvasRenderingContext2D#createImageData というメソッド。これは知りませんでした。 Opera には window.ImageData というグローバルオブジェクトとして似たものが定義されています。(createImageData と違い、第三引数に配列を渡せるのが特徴ですが) if (window.CanvasRenderingContext2D

    「HTML5のcanvasで作る画像フィルター」は自分ならこう書く - by edvakf in hatena
  • JavaScriptでSLを走らせる「SL.JS」を作りました | Creazy!

    開発に関わっていて、UNIX(Linux)を触った事のある人は「SLコマンド」をご存知の方が多いのではないでしょうか? lsを間違えてslと打つとこんなのが煙を吹きながら走る sl(1) コマンドを作りました. via: 豊田正史とslコマンド (Masashi Toyoda and SL command) ファイル一覧を出力する「ls」をtypoして「sl」と打ってしまうと、文字通りSLが画面を走り抜けるというすばらしくくだらない仕組みなのだ。いわゆる、ジョークコマンドの一つとしてとても有名で、多くの開発者の気持ちを和らげた(腰を砕いた)ことでしょう。 さて、そんなくだらないジョークコマンドを懐かしんでいると、JavaScriptでSLを動かしてみたくなってしまったので作ってみました。 ・SL.JS ブックマークレット方式にしてあるので、上のSL.JSリンクをブックマークして下さい。 ど

    JavaScriptでSLを走らせる「SL.JS」を作りました | Creazy!
  • [観] Twitter API 仕様書 (勝手に日本語訳シリーズ)

    [要旨] Twitter API 仕様書の勝手翻訳をしてみました。 [キーワード] Twitter,API

  • javascript - でも全角半角変換 : 404 Blog Not Found

    2009年06月06日15:30 カテゴリLightweight Languages javascript - でも全角半角変換 ぐぐっても、変換コードがありそうでなかったのでついでに。 404 Blog Not Found:perl - で全角半角変換をモダンに行う Demo 全角 半角 実装 見ての通り、けれんみのないやり方をしています。 (function(){ var zenkaku = ['。', '、', '「', '」', '・', 'ー', 'ァ', 'ア', 'ィ', 'イ', 'ゥ', 'ウ', 'ェ', 'エ', 'ォ', 'オ', 'カ', 'ガ', 'キ', 'ギ', 'ク', 'グ', 'ケ', 'ゲ', 'コ', 'ゴ', 'サ', 'ザ', 'シ', 'ジ', 'ス', 'ズ', 'セ', 'ゼ', 'ソ', 'ゾ', 'タ', 'ダ', 'チ', 'ヂ',

    javascript - でも全角半角変換 : 404 Blog Not Found
  • 404 Blog Not Found:javascript - から数字と記号以外の文字を取り除く

    2009年06月01日07:30 カテゴリLightweight Languages javascript - から数字と記号以外の文字を取り除く 見落としていた。 アルファベット禁止でjavascriptを書いてみた - sub Diary (仮) …ね、簡単でしょう? お詫びというのも変だけど、もっと簡単にしてみた。 これで、任意のJavaScriptから数字と記号以外を取り除けます。アルファベットだけではなく、漢字も。 二種類作りました。まず一つ目。 var a = parseInt(999*Math.random()); var b = parseInt(999*Math.random()); var c = prompt([a,'+',b, '= ?'].join(' ')) == a+b ? '' : '不'; alert(c + '正解!'); ソースは至ってシンプル。 $_

    404 Blog Not Found:javascript - から数字と記号以外の文字を取り除く
  • JavaScriptでCocoaアプリケーションを操作する·JSTalk MOONGIFT

    Mac OSXでちょっとしたアプリケーションの自動操作を行う際に使われるのがAppleスクリプトだ。だが、その自動操作のために新しい言語を習得しようと思うのはなかなかしんどく感じてしまう。使い慣れた言語でささっと書けるのが便利だ。 JavaScriptCocoaアプリケーションを操作する CUIであれば幾らでも方法がありそうだが、Cocoaアプリケーションとなると手段が限られそうだ。JavaScriptが好きな方であればJSTalkが良い選択肢になりそうだ。 今回紹介するオープンソース・ソフトウェアはJSTalk、JavaScriptで動作するAppleスクリプトライクなソフトウェアだ。 JSTalkはAppleスクリプトライクな操作をJavaScriptで行えるようにするソフトウェアだ。JSCocoaを使っており、Cocoaアプリケーションの操作を可能にしている。JavaScritpオ

    JavaScriptでCocoaアプリケーションを操作する·JSTalk MOONGIFT
  • javascript - には整数はない : 404 Blog Not Found

    2009年05月22日15:00 カテゴリLightweight Languages javascript - には整数はない 違います。 javascriptで整数の変数を強制的に符号なし整数に変換する方法 ? ku javascriptの整数は内部的には32bit intで扱われていて(Firefox3.1, Chrome0.2の場合)、演算の結果が0×80000000を超えると自動的に負の値になります。 事実はもっと驚くべきものです。 以下をご覧下さい。 puts = make_puts(document.getElementById('ttyp0')); for (var n = 1; n <= 54; n++){ puts(2, '**', n, ' - 1 = ', Math.pow(2, n) - 1); } 2の32乗どころか、2の53乗まできちんと計算できていますが、54

    javascript - には整数はない : 404 Blog Not Found
  • 本当はすごい、知られざるGoogle Maps APIたち!!

    「商業利用もOK! Google Mapsについて知りたいこと」に続くGoogle Mapsインタビューの後編は、数多く存在するGoogle Maps関連のAPIや機能のうち、あまり知られていないものや新しいものをグーグルのソフトウェアエンジニア、淺川浩紀さんに聞いた。 Code Playgroundでオンライン編集 まずは、即効性のあるものからいこう。 Googleが持つ多くのAPIは、Webブラウザ上からJavaScriptによって呼び出せる。JavaScriptはコンパイルの手順なしに書けば実行できるので手軽である。しかし、だからAPIを試すのも簡単だとは限らない。例えば、Google Maps APIなら正しいGoogle Maps APIキーを用意したり、適切な文書にプログラムを埋め込んだりする作業を行い、それをWebブラウザで開かねばならない。

    本当はすごい、知られざるGoogle Maps APIたち!!
  • JavaScriptベースのRIAを開発するのにぴったりなアプリケーションサーバ·Persevere MOONGIFT

    WebベースでRIA(リッチインターネットアプリケーション)を開発しようと思ったら避けて通れないのがJavaScriptかFlashの道だ。開発者にとってはJavaScriptの方が手軽かもしれない。そしてJavaScript向けにリッチなインタフェースを構築するためのライブラリは既に多数存在している。 管理画面用のデータエクスプローラ そのようなライブラリを使いつつ、一歩進んだRIAを構築するフレームワークがPersevereだ。 今回紹介するオープンソース・ソフトウェアはPersevere、JavaScriptをサーバサイドで動作させるアプリケーションサーバだ。 Persevereは幾つかの複合技術で提供されている。一つはサーバサイドで、これはJavaベースのアプリケーションサーバを利用している。その上ではRhinoが動いており、サーバサイドJavaScriptが利用できる。 複数のブ

    JavaScriptベースのRIAを開発するのにぴったりなアプリケーションサーバ·Persevere MOONGIFT
  • Webベースの表計算ライクなグリッドライブラリ·grrid.js MOONGIFT

    基幹システムをWebベースで作るといった話題が持ち上がるようになっている。そんな中、よく聞かれるのが表計算ソフトウェア的にデータを操作できる機能だ。技術者の方であればその難易度はご存知の通りで、大抵Excelを使えるようにCSVで出力してお茶を濁すことが多い。 需要の多そうなグリッドライブラリ しかしもう諦めないで良い。高機能、ではないけれど簡易的なデータ操作であればgrrid.jsを使ってみよう。 今回紹介するオープンソース・ソフトウェアはgrrid.js、Webベースで表計算ソフトウェアのように動作するグリッドライブラリだ。 grrid.jsを使うとまるで表計算ソフトウェアのようなグリッドが表示される。各セルは自由に文字を入力できる。移動はエンターキー、タブキー、矢印キーを使って可能だ。タブキーで右、エンターキーは下にフォーカスが移動する。なお、動作にはprototype.jsが用いら

    Webベースの表計算ライクなグリッドライブラリ·grrid.js MOONGIFT
  • iTunes風な容量ゲージを表示する·Gauge.js MOONGIFT

    何らかのサービスを考える際に、それを誰が見ても分かるようにするというのはデザインを決める上で重要な考え方だ。そのためには文字での説明ではなくアイコンや、イラストによって分かりやすく情報を提供する必要がある。 iTunesのゲージ風 とは言え、素人がそれを簡単に実践するのは難しい。その際役立つのが世界でビジネスを展開している企業のデザインだ。そこには英語圏のみならずサービスを利用する人たちにとって分かりやすくする工夫がこらされている。iPodで一気に盛り返しているAppleのその一つだ。 今回紹介するフリーウェアはGauge.js、iTunesで用いられている容量ゲージを表示するJavaScriptだ。非商用に限りフリーとなっている。 iTunesでは音楽や動画、写真と言ったメディアの種類に応じてどれくらいの容量を占めているのかを横向きのゲージで表示している。分かりやすい色分けがされ、全体の

    iTunes風な容量ゲージを表示する·Gauge.js MOONGIFT
  • Canvasを使った複雑なグラフも描画するライブラリ·Protovis MOONGIFT

    ※ 画像は公式サイトのサンプルより 個人的にはあまり複雑なグラフは好きではない。複雑であればあるほど、質が遠ざかってしまうような気がするからだ。とは言え、複雑にせざるを得ない場合や複雑さの中からはじめて価値ある情報が見いだせることもあるだろう。 サンプル1。このような複雑な描画も可能とする 簡易的なグラフを描くライブラリを使っていて苦労した経験があるならば、複雑なグラフをも描けるProtovisを使ってみてよう。 今回紹介するオープンソース・ソフトウェアはProtovis、JavaScript + Canvasによるグラフライブラリだ。 大は小をかねる。Protovisは簡単なグラフから、複雑なグラフまで難なくこなせるライブラリだ。欠点としてはCanvasを使っていることでFirefox3、Chrome、Safari4のみがサポート対象となってしまうことだろう。 サンプル2 使う場面は選

    Canvasを使った複雑なグラフも描画するライブラリ·Protovis MOONGIFT
  • jQuery入門(その1)(1/7):CodeZine

    はじめに 実を言うと、私はずっとJavaScriptを嫌っていました。JavaScriptのコードを書くのが嫌でしたし、いろいろなブラウザに対応するために大量のスクリプトコードを使わなければならないのも嫌でした。そうした点は今でも変わらないのですが、最近になってJavaScriptへの理解が深まったことと、jQueryという小さなJavaScriptクライアントライブラリのおかげで、クライアント中心のAJAXスクリプトコードを書かなければならないときでも恐怖を抱かなくなりました。それどころか、今では喜んで引き受けるほどになっています。クライアントロジックがもっと複雑になり、ブラウザの機能や実装の多様化がさらに進んだとしても、jQueryをはじめとするクライアントライブラリが、JavaScriptHTML DOMを扱う際に必要な正規化を提供してくれます。 私はJavaScriptの初心者と

    jQuery入門(その1)(1/7):CodeZine