ドラッグ＆ドロップ－HTML5のAPI、および、関連仕様
■ドラッグ＆ドロップとは ドラッグ＆ドロップとは、ウェブページ内の要素やローカル環境に保存されたファイルなどのデータを、 マウスで引きずるように移動させて他の場所に置く操作のことです。 HTML5以前にも、mousedownやmouseupなどのイベントで実現することはできましたが、 HTML5ではドラッグ＆ドロップ専用の新しいイベントや新しいメソッド・属性が追加されています。 ドラッグ＆ドロップを理解するには、ドラッグ操作とドロップ操作を分けて考えると理解しやすいでしょう。 ドラッグ操作は要素などのデータをマウスでつかんで引きずるように動かすこと、 ドロップ操作はその動かしたデータをドロップ先の要素内に配置することです。 ■HTML側では、ドラッグする要素にdraggable属性を指定する HTML側では、ドラッグする要素にdraggable属性を指定します。 draggable属性の値
【連載】第一回HTML5でCanvasアプリを作る入門編 ~canvas関連メソッドリファレンス~ - nigoblog
前回ざっくりWEBアプリが来る!という記事を書きました。 というわけで今回はWEBアプリの作り方!特にcanvasを利用したアプリの作り方について書いていこうと思います。かなり内容は入門者向けですので、まだプログラミングを知らないという人でも記事を読みながらプログラミングが出来ると思います。 これも連載形式で書いていこうと思います。 連載が終わる頃にはcanvasでWEBアプリを作れるようになっていることでしょう! 第一回目のテーマは色々やってみようということでcanvas関連メソッドのリファレンスを書いていきます。 参考図書 canvasで出来ること canvasを使う準備 canvasで良く使うメソッド まとめ という流れで書いていきます。 参考図書 参考図書にはこちら。 HTML5 Canvas 作者: Steve Fulton,Jeff Fulton,安藤慶一出版社/メーカー: オ
HTML5のInline SVGをJavaScriptで操作 (5/5)
文字（テキスト）の処理 最後にSVGでテキストを処理してみましょう。SVGでテキストを描くには<text>タグを使います。表示するX座標はx属性で、Y座標はy属性で指定します。このX,Y座標は文字のベースラインの座標になります。以下のように指定すると座標(5, 10)にAの文字が表示されます。 <text x="5" y="10">A</text> 文字の色などはこれまで説明した図形とまったく同じ方法で変更できます。サンプル11はボタンをクリックすると文字の色を赤に変更します。 ■サンプル11[HTML] <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>JavaScriptでSVGテキストを表示</title> </head> <body> <h1>JavaScriptでSVGテキストを表示</h1> <form>
ドラッグ＆ドロップしよう！(5/5):JavaScriptによるHTML5プログラミング入門 - libro
HTML5のドラッグ＆ドロップは、HTMLのWebページ内にある要素だけしか使えないわけではありません。Webブラウザ外にあるものをドロップすることもできるのです。その一例が「ファイル」です。ファイルをドラッグ＆ドロップしてページ内にその内容を読み込んで表示させる、なんてことも可能なのです。 ただし、そのためにはHTML5でファイルを扱うための「File API」というものについて理解していないといけません。このAPIについては別の記事にゆずるとして、実際にファイルをドロップするサンプルを作ってみましょう。ここでは、イメージをドラッグ＆ドロップして<img>タグに表示させてみます。 まず、HTML側に、下のリストに挙げたような形で<img>タグを用意してください。続いて、script.js側に、下のリストにあるdoDragOverとdoDropを用意してください。これでイメージファイルをド
原因調査用Linuxコマンド | 外道父の匠
サーバの動作に異常が発生した際に原因を探るためのLinuxコマンドで、自分用のメモです。 全てmanとかググったら出てくるので説明は適当です。思いついたら後で追記していくかもです。 対象はDebian Squeezeになります。 全てパッケージインストールできるもので、パッケージ名は [in packagename] としてあります。 各所よりコメントありがとうございます。 良さ気なコマンドは追記していきます。 ＜追加したコマンド＞ * telnet (+コメント wget, netcat) * arp (+コメント arpwatch) * pstree * fdisk コメントに gdisk * host, dig * watch * reboot
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Roy Jin
Roy Jin
