JavaScriptで画像Ｄ＆Ｄ

解決済

質問者：meke2
質問日時：2001/03/07 23:27
回答数：2件

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

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

ちなみに画像は２個以上でお願いします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (2件)

No.1ベストアンサー

回答者： hequil
回答日時：2001/03/08 08:20

Dynamic HTML cross-browser/Examples

http://www.fureai.or.jp/~tato/DHTML/simple/conte …

の中にある

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

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

参考まで

参考URL：http://www.fureai.or.jp/~tato/DHTML/simple/conte …

- 0
- 件

通報する

この回答へのお礼

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

ぴったりのご回答ありがとうございました！

通報する

お礼日時：2001/03/08 23:45

No.2

回答者： ku-tan
回答日時：2001/03/08 11:56

ファイルが添付できないのでソース貼っちゃいます。

不都合があるときはメールください。

<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">

(^ ^;
</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>

- 0
- 件

通報する

この回答へのお礼

ご返答ありがとうございます！
スクリプトはＩＥのみ(？)と言うことでとても見やすいです！
が、画像のみをＤ＆Ｄがうまくいかないようです。(顔文字なら可)
メールで連絡と言うことですが、あまり迷惑もかけては悪いので
自粛させてもらいます。
あと、テキストエリアも動かせるのは発見ものでした！参考にさせて頂きます！

通報する

お礼日時：2001/03/08 23:38

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！