Bedienungsanleitung Adobe Dreamweaver CC - 2013 (Seite 718 von 732) (Englisch)

618542

718

Zoom out

Zoom in

Vorherige Seite

1/732

Nächste Seite

To the top

5. Select either Constrained or Unconstrained from the Movement pop-up menu.

Unconstrained movement is appropriate for puzzles and other drag-and-drop games. For slider controls and moveable scenery such as file

drawers, curtains, and mini-blinds, select constrained movement.

6. For constrained movement, enter values (in pixels) in the Up, Down, Left, and Right boxes.

Values are relative to the starting position of the AP element. To constrain movement within a rectangular region, enter positive values in all

four boxes. To allow only vertical movement, enter positive values for Up and Down and 0 for Left and Right. To allow only horizontal

movement, enter positive values for Left and Right and 0 for Up and Down.

7. Enter values (in pixels) for the drop target in the Left and Top boxes.

The drop target is the spot to which you want the visitor to drag the AP element. An AP element is considered to have reached the drop

target when its left and top coordinates match the values you enter in the Left and Top boxes. Values are relative to the top left corner of the

browser window. Click Get Current Position to automatically fill the text boxes with the current position of the AP element.

8. Enter a value (in pixels) in the Snap If Within box to determine how close the visitor must get to the drop target before the AP element snaps

to the target.

Larger values make it easier for the visitor to find the drop target.

9. For simple puzzles and scenery manipulation, you can stop here. To define the drag handle for the AP element, track the movement of the

AP element while it is being dragged, and trigger an action when the AP element is dropped, click the Advanced tab.

10. To specify that the visitor must click a particular area of the AP element to drag the AP element, select Area within element from the Drag

Handle menu; then enter the left and top coordinates and the width and height of the drag handle.

This option is useful when the image inside the AP element contains an element that suggests dragging, such as a title bar or drawer

handle. Do not set this option if you want the visitor to be able to click anywhere in the AP element to drag it.

11. Select any While Dragging options that you want to use:

Select Bring Element To Front if the AP element should move to the front of the stacking order while it is being dragged. If you select this

option, use the pop-up menu to select whether to leave the AP element in front or restore it to its original position in the stacking order.

Enter JavaScript code or a function name (for example, monitorAPelement()) in the Call JavaScript box to repeatedly execute the code

or function while the AP element is being dragged. For example, you could write a function that monitors the coordinates of the AP

element and displays hints such as “you’re getting warmer” or “you’re nowhere near the drop target” in a text box.

12. Enter JavaScript code or a function name (for example, evaluateAPelementPos()) in the second Call JavaScript box to execute the code or

function when the AP element is dropped. Select Only If Snapped if the JavaScript should be executed only if the AP element has reached

the drop target.

13. Click OK and verify that the default event is correct.

Gathering information about the draggable AP element

When you attach the Drag AP element behavior to an object, Dreamweaver inserts the MM_dragLayer() function into the head section of your

document. (The function retains the old naming convention for AP elements [that is, “Layer”] so that layers created in previous versions of

Dreamweaver will remain editable.) In addition to registering the AP element as draggable, this function defines three properties for each

draggable AP element—MM_LEFTRIGHT, MM_UPDOWN, and MM_SNAPPED—that you can use in your own JavaScript functions to determine

the relative horizontal position of the AP element, the relative vertical position of the AP element, and whether the AP element has reached the

drop target.

Note: The information provided here is intended for experienced JavaScript programmers only.

For example, the following function displays the value of the MM_UPDOWN property (the current vertical position of the AP element) in a form field

called curPosField. (Form fields are useful for displaying continuously updated information because they are dynamic—that is, you can change

their contents after the page has finished loading.)

function getPos(layerId){

var layerRef = document.getElementById(layerId);

var curVertPos = layerRef.MM_UPDOWN;

document.tracking.curPosField.value = curVertPos;

}

Instead of displaying the values of MM_UPDOWN or MM_LEFTRIGHT in a form field, you could use those values in a variety of other ways. For

example, you could write a function that displays a message in the form field depending on how close the value is to the drop zone, or you could

call another function to show or hide an AP element depending on the value.

It is especially useful to read the MM_SNAPPED property when you have several AP elements on the page, all of which must reach their targets

before the visitor can advance to the next page or task. For example, you could write a function to count how many AP elements have an

MM_SNAPPED value of true and call it whenever an AP element is dropped. When the snapped count reaches the desired number, you could

send the visitor to the next page or display a message of congratulations.

711

Adobe Dreamweaver CC - 2013 Seite 718

Brauchen Sie Hilfe? Stellen Sie Ihre Frage.

Missbrauch melden von Frage und/oder Antwort

Art des Missbrauchs:

Forenregeln

Neu registrieren

Andere Handbücher von Adobe Dreamweaver CC - 2013

Das Handbuch wird per E-Mail gesendet. Überprüfen Sie ihre E-Mail.

Ihre Frage wurde zu diesem Forum hinzugefügt

Info