Import effects from an svg file, Svg interactivity panel overview, Delete an event from the svg interactivity panel – Adobe Illustrator CS4 User Manual

Page 387: List, add, or remove events linked to a file, Add svg interactivity to artwork, Svg events

Advertising
background image

380

USING ADOBE ILLUSTRATOR CS4

Web graphics

Important: An SVG effect must be the last effect when an object uses multiple effects; in other words, it must appear at
the bottom of the Appearance panel (just above the Transparency entry). If other effects follow an SVG effect, the SVG
output will consist of a raster object.

See also

About raster effects

” on page 355

Modify or delete an effect

” on page 356

Import effects from an SVG file

1

Choose Effect > SVG Filter

> Import SVG Filter.

2

Select the SVG file you want to import effects from, and click Open.

SVG Interactivity panel overview

You use the SVG Interactivity panel (Window

> SVG Interactivity) to add interactivity to your artwork when it is

exported for viewing in a web browser. For example, by creating an event that triggers a JavaScript command, you can
quickly create movement on a web page when the user performs an action such as moving a mouse cursor over an
object. The SVG Interactivity panel also lets you see all the events and JavaScript files associated with the current file.

See also

Optimize an image for the web

” on page 386

Save in SVG format

” on page 270

Delete an event from the SVG Interactivity panel

To delete one event, select it and click the Delete button or choose Delete Event from the panel menu.

To delete all events, choose Clear Events from the panel menu.

List, add, or remove events linked to a file

1

Click the Link JavaScript Files button

.

2

In the JavaScript Files dialog box, select a JavaScript entry and do one of the following:

Click Add to browse for additional JavaScript files.

Click Remove to remove the selected JavaScript entry.

Add SVG interactivity to artwork

1

In the SVG Interactivity panel, select an event. (See “

SVG events

” on page 380.)

2

Enter the corresponding JavaScript, and press Enter.

SVG events

onfocusin

Triggers the action when the element receives focus, such as selection by the pointer.

onfocusout

Triggers the action when the element loses focus (often when another element receives focus).

onactivate

Triggers the action with a mouse click or keypress, depending upon the SVG element.

Advertising