画像やDIVをマウスで移動【JavaScript 動的サンプル】
青字部分を追加するだけで移動が可能となります。（この枠も移動可能です） <div class="sb1" cmanOMat="move"><input type="button"value="移動可能"></div> <img src="cat1.jpg" class="cat1" cmanOMat="move"> <img src="cat2.jpg" class="cat2" cmanOMat="move"> 外枠からはみ出さないように移動することも可能です。（この枠も移動可能です） <div class="areadiv" cmanOMat="area"> <img src="dog1.jpg" cmanOMat="movearea"> <img src="cat3.jpg" cmanOMat="movearea"> <img src="dogcat.jpg" cmanOMat="m
JavaScirpt でマウス座標（位置）を取得する - はしくれエンジニアもどきのメモ
JavaScirpt でマウス座標（位置）を取得する JavaScirpt でマウス座標（位置）を取得方法をメモ。取得する方法は2 種類あるようです。 (clientX, clientY) と (pageX, pageY) の違いと、 (getBoundingClientRect().left[top], getBoundingClientRect().top) と (offsetLeft, offsetTop) の違いをまとめておきます。 サンプル ドラッグでCanvas 上に線を引けるサンプルです。その下にマウスの座標値が表示されます。 cartman0.github.io コード JavaScript でマウス座標を取得し、Canvas上に線を描画 clientX[Y] と getBoundingClientRect().left[top] Canvas 上の座標を求めるコードを以下
jsとcanvasでグラフの描画(力学モデル)を実装した
こんにちは。 今回は、力学モデル (グラフ描画アルゴリズム) – Wikipediaというグラフを描画するための面白いアルゴリズムを見つけたので、 こいつをJavaScript(CoffeeScript)とcanvasで実装してみました。 動作デモ まずはこちらを御覧ください。 ５つの丸が、ふわふわ動いてバランス良い配置になると思います。 用語の整理 まず、グラフとは、折れ線グラフや円グラフのようなものではありません。 頂点と辺の集合で構成されている方のグラフです。 グラフ理論 – Wikipedia グラフとは、↑のグラフのことで、 グラフの頂点のことをノード ノードの点と点を繋ぐ辺をエッジと呼びます。 基本的な理論のおさらい 力学モデルのWikiに書いてある通りですが、少し噛み砕いてみます。 まず、ノードの座標決定には **クーロンの法則とフックの法則**という法則が絡んできます。 ど
グランブルーファンタジーのコードをちょっと読んでみた - mizchi's blog
なんかすごい無茶してますね。 HTML5で普通に読めるので、適当に読んでみた。都合が悪ければ言ってください > Cygamesさん 大雑把にコールしてるライブラリは "jquery","underscore","backbone","easeljs","tweenjs","soundjs","movieclip","preloadjs","loadmanager","pex","typist", "flexslider","finger","socketio","subroute","uaparser" require.js 全体的にrequire.jsに強く依存している。require.jsは r.js使ってまとめてminifyできるんだけど、今回はそれをしていなくて、uglifyか何かで難読化されているだけ。なんだけど、圧縮できない文字列ベースで依存関係を表現しているため、外部から非常
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Loading...
