今から３分で，HTML5のドラッグ＆ドロップAPIと File APIを習得しよう（JSの実装サンプル付き） - 主に言語とシステム開発に関して
JavaScriptプログラミングのTOPへ 今から３分で，HTML5の JavaScript API の使い方を２つ覚えよう。 １：ドラッグ＆ドロップAPI 画面上の要素を。 画面外から。 ２：File API 読み込み。 書き込み ※これは覚える必要はない。 シンプルなサンプルコード付きで，これらの実装の方法を素早く学習する。 ※サンプルは，IE8のようなHTML5未サポートの古いブラウザでは動かないので注意。FirefoxやChromeを使うこと。 では，ここから３分の時間のカウントを開始。集中して読もう。 （0：00〜前半の１分半） 画面内でのドラッグ・ドロップ （後半の1：30〜3：00） 画面外からのドラッグ・ドロップ 参考資料 （0：00〜前半の１分半）画面内でのドラッグ・ドロップ まず，動作例を見てみる。「リンゴ」をバスケットにドロップしてみてほしい。 動作サンプル１ ht
レイプ対策、日本は百年古い＝米兵性犯罪、豪被害女性語る：時事ドットコム
レイプ対策、日本は百年古い＝米兵性犯罪、豪被害女性語る 講演する、神奈川県横須賀市での米兵による性犯罪被害者キャサリン・ジェーン・フィッシャーさん＝２２日、東京都渋谷区の青山学院大学 オーストラリアから来日後の２００２年、神奈川県横須賀市で米兵に襲われた性犯罪被害者キャサリン・ジェーン・フィッシャーさんが２２日、東京都内で講演し「日本は百年古い」と欧米に比べ立ち遅れた被害者対応の現状を厳しく批判した。 フィッシャーさんは既に３０年以上、日本で暮らしている。０２年の事件を振り返り「豪州では１９６０年代から『レイプ被害に遭ったらすぐ警察に行け』と学校で教えている。だからすぐ神奈川県警に行き『助けてください』と言ったのに『加害者は自分で捜せ』『けがしてるなら見せろよ』とヤクザみたいな言葉をかけられた」と声をふるわせた。 米国に逃げた加害者を自力で見つけ、米国で提訴して１３年、勝訴した。加害者
FileReader - Web API | MDN
FileReader オブジェクトを使用すると、ウェブアプリケーションは、ユーザーのコンピューターに保存されているファイル（または生のデータバッファー）の内容を非同期に読み取ることができます。File または Blob オブジェクトを使用して、読み込むファイルまたはデータを指定します。 File オブジェクトは、<input> 要素を使用してファイルを選択した結果として返される FileList オブジェクト、またはドラッグ & ドロップ操作の DataTransfer オブジェクトから取得することができます。 FileReader は、ユーザーが HTML の <input type="file"> 要素を使って、あるいはドラッグ & ドロップで明示的に選択したファイルの内容にのみアクセスすることができます。ユーザーのファイルシステムからパス名でファイルを読み込むために使用することはでき
javascriptでスタイルシートを自在に操る(styleSheetsオブジェクト)入門基本編 | Unskilled?
スタイルシートに到達するには生javascriptを使用する必要があります(もしかしたらライブラリがあるのかもしれないが)。あまり需要のない事柄なのかこの手の日本語情報はwebでもあまり見つからない気がします。 jQuery全盛の時代スタイルシートを書き換える必要などどこにあるのか。@MINOにはあまりわからないです。 一つ懸念なのはstyle属性でのcss指定は「デザインを分離する」理念に反するのではないかと思うのです。SEO的にはどうなんでしょうか？ そこらへんの疑問もアリながらですが、生javascriptでゴリゴリするのも知識がついていいのではないかと思います。 javascriptでスタイルシートに到達する スタイルシートの種類 スタイルシートは大きくわけて2つあります。一つは<style></style>で囲まれた以下の様なインラインスタイルシートです。 //インラインスタイル
スタイルシートをまとめて動的に設定する - うろ覚えメモ
JavascriptでCSSを動的に設定するとき、普通は次のようにしますね。 document.getElementById("hoge").style.display = "none"; IDでelementを取得し、そのstyleのdisplayにnoneを設定・・・って正直面倒っちいです。 いっぱい設定しようと思ったら、一行一行書かないといけないし、 classに同じスタイルを設定しようと思ったら、ノードをfor文で回してclassを見て・・・気が遠くなります。 そんなときはelementにスタイルを設定するのではなく、動的にスタイルシートを追加しましょう。 var css = (function() { var s = document.createElement('style'); s.setAttribute("type", "text/css"); document.getE
<link rel="preload">を使ってCSSを非同期で読み込む - Qiita
<link rel="preload" as="style" href="async_style.css" onload="this.rel='stylesheet'"> と記述すると、PreloadでCSSを取得して、読み込みが終わったらstylesheetを適用させるみたいな感じになる。Preloadはレンダリングをブロックしないので、非同期にCSSを読み込みつつ、読み込み終わったら適用させるみたいなことができる。シンプルでいい。 これは Preload: What Is It Good For? の MARKUP-BASED ASYNC LOADERの箇所に書いてある話で、現在はChrome Canaryのみで対応されていて、問題なければ4月中頃にChromeで使えるようになるらしい。 Preloadについては、仕様には下記のように書いてある。 The preload keyword
CSS の非同期読み込みで Web サイト高速化 | Thought is free
CSS はレンダリングをブロックする。 なので、CSS を非同期で読み込んでやれば、レンダリングのスピードは向上する。 最低でも、レンダリングまでの時間は短縮する。 ただ、CSS 全体を非同期で読み込むとレンダリングがガタガタになる。 まぁ、当たり前。 でも、ページ全体のレイアウトに影響が無い部分のCSSなら非同期でいいじゃん。 ページ全体のレイアウトに影響が無い部分ってのは、 例えば、 Web フォントを読み込むための CSS Lightbox などのモーダル系の CSS すでにサイズが決定してるブロック要素の中身 描画への影響が少ない WordPress のプラグインで挿入される CSS その他、ページの部品を生成してる程度の CSS などなど。 当サイトでは、Web fonts と Lightbox で使用してる CSS は非同期で読み込んでる。 WordPress のプラグインで挿
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Loading...