javascriptはfirefoxを支持して、ie 7ページのレイアウトは効果コードをドラッグします。


javascript JavaScriptを引っ張る Google IG ドラゴ Demo、非常棒のドラッグは、F 2 Blogの新しいThe meのバックグラウンドモジュールの設定、ドラッグ&ドロップの効果のためのページ効果デモンストレーションアドレス:http://img.jb51.net/online/tuozhuai/google_drag.httm強化版効果デモンストレーションアドレス:http://img.jb51.net/online/tuozhuai/google_drag 2.httmドラッグの原理:ドラッグの基礎については、この記事を参照することができます。
原理は簡単です。三つのイベントを結びつけることです。 , onmousemove , onmouseupマウスポイントで要素の座標をマウスの座標に設定します。 position 絶対座標に設定します。マウスの移動時に要素座標を変更します。マウスが跳ね上がった時にバインディングをキャンセルし、その後の操作を行います。javascript ドラッグして下にあるのは真似についてです。 google 個性的なホームページのドラッグ効果の一つ モモ (含める必要があります prototype。  完全ダウンロードパッケージ:Google  ドラゴ.rar (19.82 KB ,ダウンロード:247回)全部で4つのファイルがあります。google。ドラゴ.  prototype.js  汎用ドラッグ機能 ドラゴ.js  まねる google 個性的なホームページのドラッグ googleドラゴ.js  googleドラゴ. の最後の数行の中に初期化ドラッグ機能window.onloadがあります。 = function(){initDrag()}  このように書かなければなりません。直接window.onloadと書きます。 = イノドラゴ();  こうすれば IE 次のエラー:まだ他のコードを実現していません。直接ソースコードを確認することができます。を使っています JavaScript 描きました 15 個 divを設定します。  クラス 全部ドラゴですdiv (後は通過です クラスナメ 要素がドラッグできるかどうかを判断して、ドラッグできる部分の ID 元素の設定 ID あとをつける _h(ドラッグ部分に自分で設定することもできます。)drag.js は、比較的一般的なドラッグ機能です。中には四つの最も簡単な関数が含まれています。ドラゴ、 when_ドラゴ、 end_ドラゴ、  アフターサービス.ドラゴ。この4つの関数は、基本的なドラッグ機能を実現するだけで、他の機能を変更するか、またはこれらの関数を後に上書きすることができます。googleドラゴ.js これはまねるものです google 個性的なホームページのドラッグ効果の関数です。上に述べた四つの関数をカバーして、より高級な効果を実現します。ドラッグするのは簡単なはずです。ドラッグした後に使うべきです。 Ajax ドラッグした位置を伝え、サーバ端の値を変更します。このようにして、次回ユーザーが訪問する時に元素の位置が変わります。効果の実現は非常に簡単で、主に既存のプロジェクトにどのように融合し、ユーザー体験を向上させますか?これ モモ 一部参考のネット上のコードがあります。ネットではこのような例がたくさんありますが、効率はそんなに高くないと思います。一部の例では、すべての要素の位置を  absolute、各要素の直接修正 トップ leftと効果を表示して、それはあまり通用しないと思います。それなら、例えばこの効果を一つの数のドラッグに修正して、各要素の間の位置を記録するのは面倒くさいです。この例では要素の位置を記録するには、ドラッグが完了した後にドラッグされた要素の id。 また、どの要素の前にドラッグしてサーバーに転送して修正すればいいですか?Update 2007-01-26 1:22強化版を加えました。効果はご覧ください。 モモ。実際には、関数を追加して、彼は左の上にある大きな塊は一つの要素しかないと保証します。もし一つを超えると、後ろの列を下の第一列に押し込みます。要素がないなら、下の第一列から第一元素を取り出して左の上の大きな塊に入れます。下の第一列に元素がないなら、第二列、第三列を探します。