2018年5月20日(日)
[JavaScript] オブジェクトのドラッグ＆ドロップ #HTML5&CSS3&JavaScript

　元々、『猫の手NeCoNote』は、Webページ上のオブジェクトの自由レイアウトを実現したプログラムでしたが、ニーズが無かったので、その機能を省いてきました。

　今回、ログイン画面のキーにおいて、『オブジェクトのドラッグ＆ドロップ』を利用としたら、スマホに対する記述が結構大変なので、ライブラリーが落ちていないか調べると素晴らしいプログラミングに出会いました。「商用,改変,再配布はすべて自由ですですが、動作保証はありません」とあるので、遠慮なく利用させて頂きます。

　ところが、ダウンロードしたVer.0.92では上手く動きません。おかしいなあと、上手く動いているページのソースを見てみると、Ver.0.91を利用しています。異なっている部分は、Ver.0.91で164行～183行と237行でした。解析中。

　とりあえず、Ver.0.91で、Windows10(Edge,IE11,GC,FF,Opera)でもiOS10(Safari)でも問題なく動いているので、そのまま利用させてもらいます。


P.S. 作者のWebページ中に誤字もあるので、プログラム解析が終わったら合わせて教えて上げよう。2016年の作品か、凄いな、よく出来ています。JavaScriptをもうちょっと勉強したくなりました。


P.S.2 自分は、同じような機能を、以前いた会社で作っていて、パソコンでは辛うじて作動するけど、スマホには対応させていませんでした。ブラウザの初期設定を停止させて、新しい機能を追加するなど、面倒くさいので放ってあります。ここで紹介したプログラムは、分かりやすく記述してあります。勉強になります。
https://web-designer.cman.jp/javascript_ref/mouse/move/