Chrome Canary が dialog 要素に対応、ダイアログボックスの表示が簡単に
Chrome の Canary build が、HTML 5.1 で策定中の dialog 要素に対応したとのことで、HTML5Rocks でデモページが公開されています。その紹介と、dialog 要素についての簡単な解説。 HTML5Rocks の記事経由ですが、Chrome の Canary build が、HTML 5.1 で策定中の dialog 要素に対応したとのこと。 現状では、chrome://flags から enable-experimental-web-platform-features を有効にする必要がありますが、これによってダイアログボックス （モーダルウィンドウ） の表示を HTML と簡単な JavaScript API で行えます。また、::backdrop 疑似要素を使用することで、ダイアログボックス表示時の、画面背景を暗くするあれも CSS だけで簡単に
Webkit に最適化されたサイトを IE10 に適応させるためのガイド
スラッシュドットで 「Microsoft、「WebKitはWeb標準を破壊している」と主張」 なんてストーリーが上がってて、なんぞやと思って大本の記事を見に行ったんですけど、そしたらそれが 「Webkit しか対象にしてない Web サイトを IE10 でもきちんと動作させるためにやっといた方がいいことガイド」 っていうお役立ちコンテンツだったってことで、がんばって最後まで読んだ手前、ついでなので翻訳して掲載してみようかなと思います。 Microsoft、「WebKitはWeb標準を破壊している」と主張 ： スラッシュドット・ジャパン ちなみに翻訳元の記事は 「Windows Phone Developer Blog」 で書かれた内容なので、「Windows Phone 8 で動作する IE10」 っていう書き方になっている部分や、すべて Webkit と対比して書かれているなど、モバイル
Script Execution Analysis in Firefox 4 | Software is hard
Published:March 24th, 2011 Comments:3 Comments Category:Documentation, Firebug, Planet Mozilla A lot is happening these days and I bet you already know about Firefox 4 + Firebug 1.7 releases. You might also seen some of the new features introduced in Firebug 1.7 and so, I won't repeat that. I'd like to focus on changes related to page load process and script execution in Firefox 4. Apart from many
「Scriptタグを</body>前に置くだけ」という方法論について | TwitScratch
最近白黒はっきりつけたいデータがほしいのはScriptタグは</body>の手前に置く論がどこまでまかり通ってるよいものなのかって話。
文字列からHTMLDocumentを作成するコード
必要に迫られて引数で渡された文字列から HTMLDocument を動的に作成するコードを書いたので紹介します。このコードはchromeコンテキスト上で、つまり拡張上で動作させることを前提としていますのでご注意ください。 下記コードを書く際にmodestで紹介されているnanot_viさんのサイトを参考にしました。またrange.createContextualFragment()実行時のセキュリティ上の課題を克服するためにkazさんのblogを参照させていただきました。 let getDOMHtmlDocument=function(str){ let doc; let range; if(document.implementation.createHTMLDocument){ // Firefox 4.0から doc=document.implementation.createHTML
Dynamic Script Execution Order - WHATWG Wiki
A user account is required in order to edit this wiki, but we've had to disable public user registrations due to spam. To request an account, ask an autoconfirmed user on Chat (such as one of these permanent autoconfirmed members). This page is intended to formalize the discussion around an important but currently underserved use-case (in both spec and various browser implementations): the need fo
はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
script, styleタグ内のコードの書き方 - os0x.blog
# 最初にちょっと余談を。Chromium-Extensions-JapanのほうにChrome6 Betaの変更点を書きました。どうぞよろしく。 さて、scriptタグ内をHTMLコメントで括ってからJavaScript書くのって意味あるの? - Togetterの件に関して、関連ネタをいくつか書いておきます。。 まず前提として、scriptタグの中に直にコードを書くというのはできる限り避けたほうが良いです。とはいえ、ちょっとしたコードをいちいち外部ファイルにしていると読み込みのコストも馬鹿にならないので、インラインで書く事もよくあります。なので、以下は主に数行程度のコードをインラインに書く場合の話です。 scriptタグの中に直にコードを書くときはscriptタグに非対応なブラウザのために<！--で始め*1 // -->で閉じるというノウハウは今でも結構使われているみたいです。 しかし
Togetter - 「scriptタグ内をHTMLコメントで括ってからJavaScript書くのって意味あるの?」
@monjudoh scriptタグ内を<!-- // -->で括ってからJavaScript書くのってどの辺のブラウザ向けにやってるんだっけ? #javascript 2010-07-28 11:31:45
第6回 JavaScriptとHTMLとDOMの基本#1 | gihyo.jp
こんにちは、太田です。前々回、前回とJavaScriptの基礎的な部分を解説しました。今回はJavaScriptからみたHTMLを中心に、DOMについても少しずつ解説しています。 JavaScriptとHTML FirefoxのアドオンやサーバーサイドJavaScriptなどの例外をのぞいて、多くのJavaScriptはHTML上で実行されるので、HTMLは土台となる重要な要素です。そこでHTMLの基礎的な部分からHTMLとJavaScriptの関係を解説します。 DOCTYPEとレンダリングモード HTMLといえば最初に書くのはDOCTYPEです。現在使われているDOCTYPEはHTML4.01、XHTML1.0、XHTML1.1といくつかの種類があり、さらにその中でTransitionalやStrictなどの違いや、XHTMLではXML宣言の有無（本来は必須ですが）などバリエーションが
<script>タグから読み込んだjsのディレクトリを取得 - prog*sig
<script src="..."> という感じでjsファイルを読み込んで、src部分が http://example.com/lab/test.js であるとき、 http://example.com/lab/ を自分自身で取り出す方法を模索する。 自分自身のsrcを調べる方法は とてもシンプルに自分自身が属する script 要素を取得 - IT戦記 http://d.hatena.ne.jp/amachang/20061201/1164986067 で大体いいと思います。 もしくは var n=document.getElementsByTagName("script"); n[n.length-1].src; // 自分自身のurl 相対パスの場合とか調べてないけど、今回の主題はディレクトリを取り出すとこなので後回し。 Twitterでどういう方法があるのだろうと投
HTML5のscript要素 | Torisugariの日記 | スラド
"HTML5 script要素"というキーワードで検索すると、async属性（及びdefer属性）に注目している人が多いようです。確かに、こういう細かい挙動も、ひいてはビジターの快・不快(いわゆるUser Experience)に影響を与えるので、決して軽んじていいわけではありませんが、これを使いこなせるほど重い処理をスクリプトにやらせるのか、と考えると、AJAX万歳な時代の趨勢に漠然とした不安を覚えます。 ところで、私が個人的に注目しているのは、script要素の中身です。4.01では、 The SCRIPT element places a script within a document. This element may appear any number of times in the HEAD or BODY of an HTML document.
HTMLDocument の動的な作成: Days on the Moon
ブラウザ上で、JavaScript を使って HTML のソースから HTML 文書を生成するのに、どんな方法があるのか調べました。なお、以下のスクリプトは HTML 文書上で実行することが前提です。 表の見方 XSLT の HTML 出力 createHTMLDocument メソッド createDocument メソッド createDocument メソッドと名前空間の指定 createDocument メソッドと文書型宣言の指定 createDocument メソッドと文書型宣言及び名前空間の指定 cloneNode メソッド iframe 要素 ActiveXObject CID からの作成 まとめ 表の見方 以下の表において、各項目の意味は次の通りです。 doc HTML 文書を作成できれば○、XML 文書を作成できれば△、それ以外なら×です。HTML 文書かどうかは、cre
HTML5 のセクションアウトラインを生成してみよう！ - IT戦記
昨日 HTML5 のセクションアウトラインを取得する JavaScript - IT戦記 という記事で、以下の JavaScript ファイルを公開しました Outliner.js で 公開したのはいいのですが、 @amachang 使い方がわからんです…。見てるページで試せるように、Bookmarkletになっていると嬉しいです。 http://twitter.com/os0x/status/3972339847 …肝心の使い方を書くのを忘れていました＞＜ ＞＜ というわけで簡単に使い方を解説したいと思うます。 手順は 2 ステップ 1. まず outliner.js を読み込む <!DOCTYPE html> <html> <head> <title>hoge<title> <script type="text/javascript" src="http://amachang.saku
【特集】詳解! HTML 5と関連APIの最新動向 - Webアプリ開発編 (1) 本特集の趣旨 | エンタープライズ | マイコミジャーナル
本特集は、HTML 5の仕様や実装状況に関する現時点での最新レポートとして、実際に動作するサンプルを添えた詳細な解説をお届けするものである。特集の後半となる今回は、Webアプリケーションを作成するにあたって有用な、JavaScript APIを中心として取り上げる。今回紹介する内容は以下の通りだ。 アプリケーションキャッシュ クロスドキュメントメッセージング Web Workers Web Storage Web Database Web Sockets Geolocation API HTML5で新しく導入されたタグなどに関しては、前回の特集を参照していただきたい。 今回調査対象としたブラウザは、前回と同じく次の通り。ベータバージョンも含めた最新のバージョンをチョイスした。Internet Explorerについては、最新バージョンの8でもHTML 5への対応があまり進んでいなかったため
WEB+DB PRESS Vol.49 WAI-ARIA: Days on the Moon
現在発売中の WEB+DB PRESS Vol. 49 にて Accessible Rich Internet Applications (WAI-ARIA) に関する記事を書かせていただきました。2009 年は Web アクセシビリティの年になるという噂をどこからともなく聞きつけてこのテーマにしたのですが、ちょうど WAI-ARIA 1.0 の最終草案も公開されよいタイミングになったのではと勝手に思っています。 WAI-ARIA とは何なのか、詳しいことは雑誌記事を参照していただくとして、簡単に言えば JavaScript で構築した RIA を機械的に認識するための仕様です。たとえば JavaScript でこったボタンを作ったとしましょう。利用者がどうやって「それがボタンである」ということを認識するかといえば、「周りから浮き出ていてマウスカーソルを乗せると色が変わる」といった感覚によ
JavaScript でのブラウザ判別 - 「仕様の盲点」ではなく、「プロパティの有無」を使う方がマシ - 2009年2月 - Blog - EOF
IE6, IE7 で tabindex 属性を JavaScript 側から設定する時の注意 これは完全にバグといえる仕様なのだが、IE6 と IE7 では JavaScript（IE だから本来は JScript）側から setAttribute などを使って tabindex 属性を設定してやる時、属性名を "tabIndex" にしてやらないと認識しないことを知った（"I" がキャメルケースになっている）。WAI-ARIA（2008-08-06版 WD 邦訳）絡みで色々といじっていた時に発見。因みに IE8 RC1 では修正されている。 次の JavaScript コード断片は、IE で tabindex 属性を設定する時の方法を説明したものである。 // ターゲット要素 var elem = document.getElementById("test"); elem.setAttr
classList、relList - 素人がプログラミングを勉強していたブログ
追記：2 Common infrastructure — HTML Standardを見て少し直した。 HTML5 differences from HTML4を見ながら、HTMLElement#classListと#relListを作った。 戻り値や毎回同じclassListオブジェクトを返すべきなのかどうかが不明なので、好きなようにした。 var InvalidCharacterError = function () { }; InvalidCharacterError.prototype = DOMException.prototype; var TokenList = function (element, attribute, sensitive) { this.__element = element; this.__attribute = attribute; this.__se
SmartMarkUP Universal markup editor and platform!
SmartMarkUP - Universal Markup Editor! SmartMarkUP is a lightweight and powerful JavaScript library that allows you to turn any textarea into a fancy markup editor. HTML, CSS, XML, Wiki syntax, BBCode or any other desired markup language can be implemented and/or adjusted to your preferences and business needs. SmartMarkUP doesn't depend on any other JavaScript library and can be integrated wit
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - jamespadolsey/satisfy: :crystal_ball: Generate HTML from CSS selectors
