beautypg.com

Using jquery ui widgets in dreamweaver (cc), Insert a jquery widget, Modifying jquery widgets – Adobe Dreamweaver CC 2014 v.13 User Manual

Page 48

background image

Using jQuery UI widgets in Dreamweaver (CC)

Twitter™ and Facebook posts are not covered under the terms of Creative Commons.

Legal Notices

|

Online Privacy Policy

To the top

Note:

To the top

Spry widgets are replaced with jQuery widgets in Dreamweaver CC and later. While you can still modify existing spry widgets on your page, you
cannot add new spry widgets.

Widgets are small web applications written in languages such as DHTML and JavaScript that can be inserted and executed within a web page.
Among other things, web widgets help provide a way to replicate desktop experiences on a web page.

jQuery UI widgets such as accordion, tabs, datepicker, slider, and autocomplete bring the experience of the desktop to the web.

For example, the Tabs widget can be used to replicate the tab feature of dialog boxes in desktop applications.

Insert a jQuery widget

When you insert a jQuery widget, the following are automatically added to the code:

References to all dependent files

Script tag containing the jQuery API for the widget. Additional widgets are added to the same script tag.

For more information on jQuery widgets, see

http://jqueryui.com/demos/

For jQuery effects, external reference to jquery-1.8.24.min.js is not added because this file is automatically included when you add an

effect.

1. Ensure that your cursor is at a location on the page where you want to insert the widget.

2. Select Insert > jQuery UI, and choose the widget that you want to insert.

If you use the Insert panel, the widgets are present in the jQuery UI section of the Insert panel.

When you select a jQuery widget, its properties are displayed in the Properties panel.

You can preview jQuery widgets in the Live view or in browser that supports jQuery widgets.

Modifying jQuery widgets

1. Select the widget that you want to modify.

2. In the Properties panel, modify the properties.

For example, to add an extra tab to the Tabs widget, select the widget and click "+" in the Properties panel.

41

This manual is related to the following products: