Dreamweaver on the Internet, we can often see some very practical drag-and-drop effect, especially when applied to online shopping, visitors can directly drag the selected items to the shopping box or shopping cart, very convenient and interesting. But most people do not know, in fact, the behaviors in Dreamweaver can make the same effect. If you are interested, join me in making a shopping box with drag and drop effects.
Before doing the drag-and-drop page, first we have to prepare some pictures. For example, as a shopping box or shopping cart
Big picture, plus a few small pictures representing the items. I've got a shopping bag here and a few more items: cell phone, game handle and car.
With the pictures ready, we can start our work. Open Dreamweaver, create a new page, select the Layer tool in the object panel, and then drag a layer over the page with the mouse (or select "Insert/layer" to insert a new layer). Then, put the mouse in the layer, then select object/Insert Image tool, and insert a picture that you just prepared in this layer.
Repeat the above action, then insert 3 layers, then insert each of the other pictures you have prepared in the 3 layers.
Okay, here's the big step. Clicking on "Window/action" will bring up the "action (Behaviors)" dialog box. Click on the "+" above the dialog box, there will be a pop-up menu, select the menu "Drag Layer", and then pop-up, is the "Drag Layer" dialog box.
Repeat the above steps, set the properties of several other layers, set up a good "behaviors" dialog box in the Middle text box has 4 more "onLoad" tag.
OK, set this up, our work is done, do not forget to save the page, and then press the "F12" button to see you do drag the page cool?
The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion;
products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the
content of the page makes you feel confusing, please write us an email, we will handle the problem
within 5 days after receiving your email.
If you find any instances of plagiarism from the community, please send an email to:
info-contact@alibabacloud.com
and provide relevant evidence. A staff member will contact you within 5 working days.