以下為本站文章分類清單

  1. AJAXspacer
  2. ASPspacer
  3. CSSspacer
  4. Javascriptspacer
  5. Windows 應用程式spacer
  6. 網頁設計
  7. 評論、短文、雜文spacer
  8. 版主spacer
  9. 最新回應spacer

以下為本頁本文內容

Javascript 拖、拉、放

名稱: 圖層的 Drag&Drop
語法: Javascript / CSS
適用:
說明:
  • 圖層數不限
  • 可以指定圖層固定不可拖拉
  • 自動調整 z-index
  • 自動貼齊格點(本例格點50pixel)
備註: Woking in HTML 4.x

實作範例

 

卜維丰 1/26 07'

以下為文章回應區

同意轉載,不過麻煩看一下轉載需知

   2011/4/21 下午 02:31:00

老師你好:
我在使用「重新認識JavaScript」的範例時發現,4.2.DragDrop_class.html這隻拖拉程式在使用時,
圖層拖拉很正常,但是圖片拖拉卻怪怪的,按下滑鼠時只拖拉一點點就不動了,當放開滑鼠時反而圖片會跟著滑鼠跑,這是為什麼呢?
麻煩請老師幫我解答,謝謝。

水上飄   2011/4/18 上午 07:21:00

老師,你好:
我有買了你這本"一定會遇到的90個問題",在研究圖層移動時,遇到了一個問題:
就是我想將圖層移動後,存成另一個新檔而且圖層位置就是在移動後的位置而且都不能再移動,但是都不行....是否有什麼方法可做到

卜維丰   2010/3/27 上午 11:34:00

MIA, 當然可以, 不過作法不是三語兩言能講完的

MIA   2010/3/25 下午 06:58:00

對了 我是用Dreamweaver寫 HTML

用了jquery的API
draggadle 仍然不能移動<select><option>裡面的值

MIA   2010/3/25 下午 06:53:00

老師您好:
我最近想寫一個
有兩個ListBox 中間有兩個button,很簡單
不過希望兩個ListBox之間的值可以用按鈕也可以用拖曳的方式,有可能用javascript或是jquery來控制嗎??

試過很多範例,但都只能移動div 或是img
難道<select><option>或是ListBox就不行嗎??
請老師解答!!

小漾   2009/12/25 下午 04:48:00

老師!您好
因為最近要開發,像igoogle那樣的
可以任易移動框架然後儲存的效果~~
只要管理者能做到這樣排版的效果.

我曉得ajax可以做到!可是公司使用的
是ASP 不是ASP.NET

不曉得,您的"重新認識javascript"
的書是否有相關方面的資訊???

seo   2009/7/31 下午 10:38:00

謝謝老師的詳細講解...

卜維丰   2009/7/27 下午 06:29:00

新手, 有個地方
pop() 執行完, 原陣列隨之改變
原本 da.length=5
pop 一次變4, pop 兩次變3... 所以, 無法執行 5 次

新手   2009/7/22 下午 03:08:00

老師您好,我做問題七的時候用
var de=new Array();
var da=['a','b','c','d','e'];
for(i=0;i<=da.length-1;i++){
de[i]=da.pop();
}
這樣只能取出三個值,可是我改用shift就可以將所有的值取出,這個是為什麼??
還是我程式哪裡有錯誤

allen   2009/7/20 下午 06:48:00

老師您好,
請問一下,
1.例如:投票模組
2.從甲網頁的拖拉到乙網頁
如何實作?
3.謝謝賜教!

p/s:不必嵌入語法,就可以執行.

卜維丰   2008/9/3 下午 03:05:00

tno, 你 aspx 裡有個 iframe, 這時 iframe 是這頁的 child frame, 所以用 opener 是不對的

使用 iframe 相當於跨視窗, 我會建議你為 iframe 加一個 name 屬性, 例如 name="editor1___Frame"

如果加上去了, 我沒有實作, 但按原理來說, 應該是
window.frrames['editor1___Frame'].document.formName.xEditingArea

這裡我要強調一件事, 看來, 你在 iframe 裡放的是表單, 基於不同理由, 都支持表單元件一定要使用 name 屬性, 同時, 本身 form 就是一個元件, 不用再繞一圈去使用 document.getElementById , 這點你可以實作一下, 有問題或結果再通知我

tno   2008/9/2 下午 02:53:00

老師您好想請問你一個問題,
我的a.aspx 裡面有一個
<iframe id="editor1___Frame" src="../post/editor.html?InstanceName=editor1&amp;>

我該如何把值傳入iframe 裡的控制項?
(PS.editor.html裡的控制項ID=xEditingArea)

我試過
document.getElementById("editor1___Frame")

window.opener.document.all

window.opener.document.main
都沒辦法,所以請老師幫幫我

阿粘   2008/6/12 上午 11:45:00

感謝老師的解答,我想我知道該怎麼做了。

卜維丰   2008/6/11 下午 04:45:00

阿粘, 其實你看上面 iframe 裡的 source , 有一段叫作 hitTest()

只不過我好像沒有用在程式裡, 基本上, 用 JavaScript 作 hitTest(), 我自己想的方法, 也只能針對座標進行判別

至於你提到的 Panic Goods 他的購物車在最下面, 這就比較好判斷, 你拉曳時的座標, Y 值超過了, 就算 hit 了, 你可以試試

阿粘   2008/6/11 上午 11:37:00

老師您好:

請問老師在Javascript中是否有類似您所提到的Flash方法hitTest()可以使用,或有沒有什麼可以取代方式來判斷2個物件是否已經碰觸?

舉例來說:我想做到像YAHOO新版信箱中,可將信件拖曳至垃圾筒中刪除;或如您的出版「解決AJAX一定會遇到的90個問題」中第17章中提到的Panic Goods網站裡的拖曳式AJAX購物車範例。

卜維丰   2008/5/30 上午 11:15:00

大仔, 先講儲存位置這事好了
你可以送出前, 進行一輪計算目前所有屬於可以拖曳物件的座標, 再儲存
要不, 你可以邊拖曳邊把座標放在隱藏欄位中

再說第二個, Flash 裡有個 hitTest(), 就是指兩個物件有接觸, 你可以用類似概念, 在 onmouseup 時啟動

同樣的, 這些動作, 我建議都有一個隱藏欄位在記錄, 直接送出, 最後提醒你, 座標回傳值有單位 px, 資料庫欄位型態要注意

大仔   2008/5/30 上午 06:23:00

剛剛問的問題太抽象,應該是說我是要從我的資料庫抓圖片出來而每個大框框當成相簿,裡面每個元素當成相片,當我把一個元素拖到另一個大框框裡時,就等於移動相片到另個相簿,請問老師,我該如何做儲存的動作?

大仔   2008/5/30 上午 06:14:00

老師您好 請問Drag&Drop 功能,可以儲存嗎?
就是說當拖拉完,點一個按鈕,可以把剛剛拖拉之後的位置給儲存起來嗎?

給個回應
姓名:
佈落格網址:
  如果您是要發問問題, 最好有個問題測試的網址, 這樣比較容易找到您問題所在, 謝謝
內容: