-PR-
解決済み

JavaScriptで画像D&D

  • 困ってます
  • 質問No.49003
  • 閲覧数276
  • ありがとう数3
  • 気になる数0
  • 回答数2
  • コメント数0

お礼率 79% (23/29)

ちょっとした「遊びもの」を作るため、
webブラウザ上で画像をドラッグ&ドロップできるように
したいのですが、なかなかうまく作れません。

クロスブラウザ仕様じゃなく、IE専用でいいので
どなたかいい感じのスクリプトを知りませんか?

ちなみに画像は2個以上でお願いします。
通報する
  • 回答数2
  • 気になる
    質問をブックマークします。
    マイページでまとめて確認できます。

質問者が選んだベストアンサー

  • 回答No.1
レベル12

ベストアンサー率 65% (242/372)

Dynamic HTML cross-browser/Examples
http://www.fureai.or.jp/~tato/DHTML/simple/contents.htm

の中にある

Base Script for Dragon
レイヤをドラッグして動かすための基本スクリプト
http://www.fureai.or.jp/~tato/DHTML/simple/part2/sample/dragdrag/dragbase.htm

がまさにご要望のものだと思います。

参考まで
お礼コメント
meke2

お礼率 79% (23/29)

ご返答ありがとうございます!
こんなサイトもあるんですね。これからの「遊びもの」作りにとても
役立ちそうな感じです!
(クロスブラウザ仕様がちょっと気になりますが>なにせスクリプトが多いから)

ぴったりのご回答ありがとうございました!
投稿日時 - 2001-03-08 23:45:24
-PR-
-PR-

その他の回答 (全1件)

  • 回答No.2
レベル3

ベストアンサー率 0% (0/2)

ファイルが添付できないのでソース貼っちゃいます。不都合があるときはメールください。

<HTML>
<HEAD><TITLE>オブジェクトをドラッグ&ドロップで移動したい</TITLE>
</HEAD>
<SCRIPT language="JavaScript">
var target;
var isDrag=0;
function document_onmousedown(){
isDrag=1;
target=event.srcElement;}
function document_onmousemove(){
if( isDrag ){
target.style.top=event.clientY-8;
target.style.left=event.clientX-8;}
}
function document_onmouseup(){
isDrag=0;
sample.style.top=text1.style.top;
sample.style.left=text1.style.left;
//alert(text1.style.top);
//alert(event.srcElement);
}
</SCRIPT>
<BODY onmousemove="document_onmousemove()" onmousedown=
"document_onmousedown()" onmouseup="document_onmouseup()">
<DIV id=text1 style="position:absolute;font-size:24px; cursor:hand">
<!--ここにIMGで画像を置いてください-->
(^ ^;
</DIV>
<DIV id=text2 style="position:absolute;font-size:24px; cursor:hand">
<input type="text">
</DIV>
<BR>
<BR>
<BR>
<DIV style="position:relative" id=sample>
このオブジェクトが移動します
</DIV>
お礼コメント
meke2

お礼率 79% (23/29)

ご返答ありがとうございます!
スクリプトはIEのみ(?)と言うことでとても見やすいです!
が、画像のみをD&Dがうまくいかないようです。(顔文字なら可)
メールで連絡と言うことですが、あまり迷惑もかけては悪いので
自粛させてもらいます。
あと、テキストエリアも動かせるのは発見ものでした!参考にさせて頂きます!
投稿日時 - 2001-03-08 23:38:23


このQ&Aで解決しましたか?
AIエージェント「あい」

こんにちは。AIエージェントの「あい」です。
あなたの悩みに、OKWAVE 3,500万件のQ&Aを分析して最適な回答をご提案します。

関連するQ&A
-PR-
-PR-
こんな書き方もあるよ!この情報は知ってる?あなたの知識を教えて!
このQ&Aにはまだコメントがありません。
あなたの思ったこと、知っていることをここにコメントしてみましょう。

その他の関連するQ&A、テーマをキーワードで探す

キーワードでQ&A、テーマを検索する
-PR-
-PR-
-PR-

特集


専門家があなたの悩みに回答!

-PR-

ピックアップ

-PR-
ページ先頭へ