2011-01-01から1年間の記事一覧
HTML5の新機能の１つ「video要素」を試してみた。 例によって検証アプリを作成して、試した結果が下図。 使い方は、audio要素とほとんど同じ。 <h1>video要素を試す</h1> <video id="video" controls> <source src="media/earthImage.mp4"></source> <input type="range" id="seekbar" value="0" min"0"/> <p>ブラウザがvideo要素に対応していません</p> </video>
HTML5の新機能の１つ「audio要素」を試してみた。 実際に、検証アプリを作成した。しかし、ハマった＞＜。currrentTimeへの値の設定が、期待通りに動作せず、困った。document.getElementById("id").currentTime = 0と書いても、0がセットされないのだ。原因…
IE8と、それより下のバージョンのIEでスタイルが適用されないことがある。 その対応方法を説明する。 【問題点】 IE8以下では、未知の要素に遭遇すると期待通りのDOMが構成されない。【解決方法】 document.createElement()を使用して、要素を生成する。 HTM…
W3CがHTML5の文法チェックツールをWEB上で公開している。次の、HTMLを文法チェックツールにかけてみた。 <html lang="ja"> <head> </head></html>
thisについて、恥ずかしいことに１つ勘違いして理解していた点があったので、自分の中で頭を整理した。まず、thisを一言で説明すると、次の通りだ。 thisとは、関数内ではthisを使用中の関数をメンバに含むオブジェクト*1を指し、トップレベルコード*2ではグ…
javaでダウンロード機能を作る際に、ユーザがダウンロードするExcelファイルをブラウザ内で表示させない方法をメモしておく。結論は、レスポンスのヘッダーにContent-Dispositionを設定すること。 逆に、ブラウザ内に表示させる場合は、設定しなければよい。…
jQuery内部で下記のようなことをしているので、できるでしょうと思いつつ試してみた。 できた。 当たり前か・・・。 var jQuery = window.jQuery = function( selector, context ) {・・・・ ■親画面 <script type="text/javascript"> var mode = 0; ( function($) { $.testFunc = function(</script>…
単純なメモ。jQuery非表示状態にあるものを表示する場合は、show()メソッドを使用する。 逆に、 表示状態にあるものを非表示にする場合は、hide()メソッドを使用する。 //非表示状態のものを表示状態にする $("showButton").click(function () { $("p").show…
Changeイベントとは、msdnの解説では次の通り説明されている。 テキスト ボックス、またはコンボ ボックスのテキスト部分の内容が変化するときに発生します。また、タブ コントロール内でページ間を移動したときにも発生します。 これを読んで私は誤解をして…
すでにご存知の方も多いかもしれないが、Google I/O 2011で「HTML5 versus Android: Apps or Web for Mobile Development?」というセッションがあった。私は半年ほど前から、Androidアプリはネイティブアプリで作成する必要はないのではないのかと思ってきた…
ちょこっと、暇つぶしに作ってみた。 実は今まで自分で作ったことが無かったことは秘密だ。 <html> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <head> <script type="text/javascript" src="/javascript/lib/jquery-1.5.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ document.getElementById("opti…</head></meta></html>
■IE8の場合 focusoutイベント発生→blurイベント発生→clickイベント発生 ■chromeの場合 clickeイベントのみ発生 これはIEのバグなのか仕様なのか。「focusoutイベント発生→blurイベント発生」という流れはIEでもchromeでも共通なので気になることはない。問題…
Same Origin Policyを一言で述べると、こうだろうか。 JavaScriptには、生成元が同じオブジェクトにしかアクセスすることができない制限があること ここで、「生成元が同じ」とは、下記3つを満たすことだ。 １. ホストが同じ ２．プロトコルが同じ ３．ポー…
Youtubeで、非常に面白い動画を見つけた。 このような未来は、そう遠くない気もする。 iOSやAndroidが家電と連携すれば、こんな未来も近いのだろう。
前回のエントリーで、localStorageを使用して格納したデータは、明示的に削除しない限り、ブラウザを閉じても削除されないことが分かった。 つまり、アプリケーションが利用者に対して明示的にlocalStorageのデータを削除する仕組みを提供している場合か、も…
当たり前だが、画面遷移をすると、javascriptの変数は消えてしまう。グローバル変数といえども、画面遷移をすると消えてしまう。画面遷移をしても、遷移する前のデータを利用するためには、下記２つの方法が考えられる。 遷移するタイミングでサーバへデータ…
$('#sample').val() とした場合、 <input id="sample" value="test"> のようなタグがあった場合に、value属性の値「test」が取れる。一方、タグがない場合には値は取れないと思っていたが、下記のような場合もセレクターは動作する。idがsampleのタグがないからundefinedを返すのは、そういう…
少しばかり書店に立ち寄った。 欲しい本が５冊ある。でも、まだ読んでいない本もあるし、お金もかかるので我慢。 どれもいい本なんだよなぁ。欲しいなぁ。・最初の3冊はHTML5の本。中身を見たことがなかったのだが、初めて見て欲しいと思った。徹底解説HTML5…
やりたいことは、左図のようなこと。クライアントからリクエストを送り、サーバ側でダウンロードするファイルを作成（すでにある場合は加工）してクライアントへ返す（ダウンロード）といったこと。 同期通信の場合、クライアントからsubmitボタンを使用して…
<html> <head> <script type="text/javascript" src="jquery.js"></script> </head> <body> <a href="http://www.google.co.jp">Link to Google</a> <a href="http://www.yahoo.co.jp">Link to Yahoo</a> </body></html>
Netchさんのページに書いてありましたね。ChromeやSafari、firefoxではCSS3の@font-faceが使用できる。そのため、cufonを使わずとも、先日のエントリーで書いたように、適用したいフォントがPCにインストールされていなくても、@font-facesを利用してWebFont…
自分でも綺麗なフォントを簡単にWEBページに適用できる方法がないかを調べてみたら、あった。Cufon Cufonについて、まとめてみた。 【Cufonとは】 ・フォントファイルをJavaScriptファイル(以下、JSファイルと呼ぶ)に変換し、適用したい箇所にそのフォントを…
ネットサーフィンをしながら、様々なWEBページを見ていた。 なんと秀逸なデザインのページが多いことか。感動するばかりだ。作者はたいてい、Web Designerの方々。Designerって、素晴らしい。さて、ただただ感動するだけではイケナイということで、センスの…
FuncUnitを使った画面テストの自動化は、こんな感じ（動画が小さいので、フルスクリーンにして見て下さい）。動画中に赤丸が動いているが、それはmoveメソッドの動き。つまり、赤丸が画像に被さることが、mouseOverを意味する。#初めてYouTubeに動画をアップ…
FuncUnitを使って、イベント発生のテストを行った。 少し困ったことは、FuncUnitではbind関数が用意されていなかったこと。今回のテストでは、「画像にマウスをかざしてマウスオーバーイベントを発生させると画像が違う画像に変わり、マウスオーバーを外すと…
最近、テストについて悩んでいる。 製造工程終盤から参画したプロジェクトなのだが、なかなかバグが収束しない。私が考えるに、原因は１つ。-テストが自動化されていないテストが自動化されていないため、デグレードしても気がつかない（場合がある）。 デグ…
前回のエントリー「Java/JavaScriptによるWEBアプリケーションのユニットテストについて考えてみた」で、Viewのテストを自動化するために、JsUnit、QUnit、FuncUnit、Jasmine、YUI Test、JsTesterを使用してみようと思ったので、早速試してみた。JsUnit、QUn…
よくわかっていない。。。string.replace(//g, '\n')と、string.replace(//g, '\r\n')って何が違うのかな（stringは文字列変数）？ つまり、\nと\r\nの違いは何なのか。 alertを使用すると、表示される結果は同じもの。しかし、文字列としては、異なる。Wind…
昨日、中島聡氏の本「エンジニアとしての生き方」を購入し、流し読みした。 WEB+DB pressの連載やblogに書かれていることのまとめのようだが、とてもモチベーションを高めることのできる本だ。 中でも、「ITゼネコンの副作用」や「新技術の勉強を人任せにし…
「東京Node学園」というものがあるらしい。知らなかった。 「Node.js」のイベントとのこと。 下記に小林浩一氏の発表資料が置かれていた。 東京Node学園#1「非同期プログラミングの改善」のエッセンス View more presentations from koichik
