All-in-one creative subscription with full AI stack All-in-one creative subscription From $16.50/m

ブラウザ上で、JavaScript を使って HTML のソースから HTML 文書を生成するのに、どんな方法があるのか調べました。なお、以下のスクリプトは HTML 文書上で実行することが前提です。 表の見方 XSLT の HTML 出力 createHTMLDocument メソッド createDocument メソッド createDocument メソッドと名前空間の指定 createDocument メソッドと文書型宣言の指定 createDocument メソッドと文書型宣言及び名前空間の指定 cloneNode メソッド iframe 要素 ActiveXObject CID からの作成 まとめ 表の見方 以下の表において、各項目の意味は次の通りです。 doc HTML 文書を作成できれば○、XML 文書を作成できれば△、それ以外なら×です。HTML 文書かどうかは、cre
このページでは、HTML5のAPIを利用した簡単なサンプルを公開しています。 このサンプルの多くは、弊社技術顧問の白石氏がマイコミジャーナルに寄稿した記事で使用したプログラムを元に、多少の改変を加えたものです。 どれも非常にシンプルなものではありますが、HTML5の各機能を試すためのとっかかりとしてご利用頂けると思います。 白石氏が寄稿した記事はこちらになります。これらの記事と合わせてサンプルをご利用になって頂く事で、各機能の理解がより深まることでしょう。 詳解! HTML 5と関連APIの最新動向 - 新タグ&API編 詳解! HTML 5と関連APIの最新動向 - Webアプリ開発編 アプリケーションキャッシュのサンプル (ダウンロード) (Safari4、Google Chrome3で動作確認済み。Firefoxだと、アプリケーションキャッシュのイベントが正しく発生せず、動作しないと
3 days ago的な時間表記をするサービスは全部嫌いです。agoです。 週末若手IT勉強会に参加させていただきjQuery 1.3.2のイベント周りを読んできたので、それを踏まえて使用すると問題の発生する可能性の高い機能を紹介します。 0 jQuery.browser 1.3からサポート外になりました。 代わりにjQuery.supportを使用しましょう。 ただ、swfの重ね合わせ問題等は単体のJSでは確認できないので、jQuery.browser無しでどう解決すればいいのかよくわかっていません。 1 getData、setDataイベント getData、setDataイベントは1.5系で削除される予定のようです 最新版のjQueryではgetData、setDataイベントが使用可能になっており、以下のようにイベントを設定できます。 $().bind('getData', fun
サイト内検索 html5doctor ( http://html5doctor.com/ )とは、Richard Clark 氏、Bruce Lawson 氏、Jack Osborne 氏、Mike Robinson 氏、Remy Sharp 氏、Tom Leadbetter 氏といった HTML5 に関して著名な方々が共同で運営しているサイトです。<html>5doctor は、HTML5 を使おうとする人に、さまざまなリソースを提供することを目的として運営されているサイトです。このサイトで掲載されている記事は、HTML5 を習得する上で、非常に有益なものばかりです。特に、マークアップに関する記事が充実しています。 HTML5.JP では、html5doctor の許可を頂き、記事アーカイブの日本語訳を掲載しましたので、ぜひ、HTML5 の理解にお役立てください。 一部、直訳ではなく意訳
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 jQuery Gallery Slider Plugin ダイナミックにスライドする画像ギャラリー。 prettyPhoto a j
Form Design フォームデザイン さてさて、最近のwebの入力フォームは本当に凝ってるところが多くて、ただただ関心するばかり。 そんなわけで今回は、焦点を『フォーム』に限定し、スタイル抜群なフォームUIを勉強してみたい。 流れ的には インスピレーションデザイン集CSSによるフォームの変更方法JavaScriptによるフォームデザインという感じでお送りいたします。 インスピレーション まずは、スタイリッシュなフォーム。 これらは、webデザイン全体がフォームデザインとなっているまとめです。 まさにバインダー。 webの入力フォームを街頭アンケート用紙のように仕上げたデザイン。かっこいい。 くしゃくしゃっとしたような紙の一部にフォームが設置されている。 こちらもメモに名前を書くかのごとく。 深海に光がさす感じのイメージ。 シンプルイズベストなレイアウト設計がなされている。 1,2,3,
GmailやLDRなどもそうですが、最近はWebアプリケーションでも「起動させっぱなし」を基本路線に置いているものも増えてきています。そういうときにポイントとなるのが「(サーバ側で変更が発生したときに)サーバからの通知をブラウザにどうやって知らせるか?」ということ。ブラウザでページを開かれている場合だと、変更箇所を専用のボックスエリアを設けて、適当に目立たせておけばいいのですが、別タブで開かれている場合などには、タブをユーザが切り替えるまでは、その変更を通知することができません。そんなときに、「差分の大きな複数のfavicon(*)を動的に変更させることで通知と同等の効果が期待できないか?」という話。(全然違うfaviconをアニメーションさせることで目立たせられないか?という狙い) faviconの変更は割と単純 まずfaviconが動的に変更させることができないか?の検証ページを作って
オケラとかサッパリとか言う名前の駄目ブラウザ達のせいで、イマイチ実用的でなかったJavaScript → Flash間通信(逆は一応動く)。 モダンブラウザを全てサポートして、無理やり可能なことが発覚。 さぁ、奥さん。これは買わなきゃ損ですよ!! 用意するものは、swfファイル2つとhtmlファイル2つ。 ロジックは以下の通り。 1.htmlAにある、swfAに対して値を送りたい。 2.JavaScriptでIFrameに、swfBを持つhtmlBをロードする。 3.htmlBの生成時に swfBのobjectタグに、送信したい値をflashVarsで書き込む 4.値を受け取ったswfBはローカルコネクション(LC)を作成、LC経由でswfAに値の通知を行う。 5.swfAは無事に値を取得! まさに、Flash beyond the Ajax!!これなら変数どころか、関数だって呼びだせます
■ JavaScript ミニライブラリ ちょっと前から「なくても不便じゃないけど、あったらちょっと便利かもね」っていう JavaScript を書いたりして発表していましたが、一覧とか作ってないからどんなのがあるのかわかりにくかったのでまとめてみました。 onsubmit で disable 以外のスクリプトは全てパブリックドメインとするので、自由に使って下さい。onsubmit のやつはもともと自分が作ったものじゃないので良くわかんない(← 無責任)。 結構作ってるつもりだったけど、並べてみると意外と少ない。 onsubmit で disable にするやつ テキストフィールドのフォーカス時に背景色を変更する JavaScript フォームに入力を促すメッセージを出力する JavaScript パスワードの安全性を教えてくれる JavaScript カーソル位置のセルの上端と横端をハイ
Firefox 2 の新機能の一つに JavaScript 1.7 への対応がある。Firefox 2 Beta 2 のリリースも近づき JavaScript 1.7 の新機能もほとんどが実装されてきたのでここにまとめてみる。といっても New in JavaScript 1.7 に大体はまとまっているので補足的な部分など。 識別子の扱い ブロックスコープ 分割代入 イテレータ ジェネレータ 配列内包 参考 なお、ブラウザ上でスクリプトを実行する場合は、JavaScript のバージョンを明記しないと let 、yield がキーワードとして認識されない (Bug 351515) 。 <script type="text/javascript; version=1.7"> JavaScript shell を使う場合は起動時にバージョンを指定するか version 関数を使う。 $ js
ファイルサイズわずか10キロバイト、CSSの1から3、XPathをサポートし、Internet Explorer、Firefox、Safari、Operaで動作します。「JavaScriptのコードを書くのが楽しくなる」というのがモットーらしい。 ダウンロードや実際の例、使い方などの各種取り扱い説明は以下の通り。 jQuery: New Wave Javascript http://jquery.com/ 上記ページの「Run」をクリックするとその機能の一端を垣間見ることができます。面白い効果です。 その他のデモとしてはこんな感じでいろいろなところに使えます。特に一番下の「Example G」のボタンをクリックしてから本文の上にマウスを乗せると色が変わり、フェードしながら元に戻るというのはシンプルながら面白い。 JQuery http://codylindley.com/blogstuff
Overview Lightbox JS is a simple, unobtrusive script used to overlay images on the current page. It's a snap to setup and works on all modern browsers. Note: An new version of this script is available: Lightbox JS v2.0 Example To make sense of it all, check out these examples. Click on a thumbnail or text link below: Benefits Places images above your current page, not within. This frees you fr
以前から、Google Web APIsとしてGoogle以外のアプリからSOAP経由でGoogleの検索結果を取得することは出来たのですが、JavaやPerl等でSOAPプログラミングをするのは僕のようなフツウの人からすれば「ムリメ」であったことは否めません。そんなムリメだった高嶺の花が、アナタの手の届く距離まで近づいたかもしれません。そんな隣のお姉さんのような庶民派のAPIが、今日ご紹介する「Google AJAX Search API」です。Google AJAX Search APIって何?読んで字の如く、という説明になってしまうのですが。Google AJAX Search APIはJavascriptから利用することができるGoogle検索のAPI。使い方はJavascirptに関するちょっとした知識のある方であれば、基本的な部分は「あっちゅうま」に分かる位簡単です。まずは、G
上記画像を見れば分かるように、水面やなめらかな金属などに映り込んだような効果を画像に簡単に持たせることができるようになります。わざわざ画像を加工するソフトウェアを起動する必要がなくなるというわけ。映り込みの度合いも調整可能です。 Internet Explorer 5.5以上、Firefox 1.5以上、Opera 9以上、Safariで動作する模様。 Reflection.js http://cow.neondragon.net/stuff/reflection/ 「class="reflect"」というのを加えるだけで基本的に利用可能になります。画像ごとに効果を加える必要がなくなるというのがメリットらしい。ブログのアバター画像などで使うことを主目的に開発されたらしいですが、そのほかにも何か面白いことができそうな気もする。 なお、上記サイトからWordpressやphpBB、vBulle
Specere Blogs Blog Archive A Simple CSS Image preloading technique So you need to pre-load images, but don’t want to deal with javascript or complicated workarounds. What do you do? The solution is simple. All we need to do is designate a CSS style with multiple background-images. As your browser reads the style, it will load each image you designate in succession, thus pre-loading your images. Be
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く