Adobe 65011817 User Guide - Page 155

Break symbol links, Edit an instance without breaking the symbol link

Page 155 highlights

USING FIREWORKS CS4 149 Styles, symbols, and URLs Button symbols have several features that let you retain symbol-instance relationships while assigning unique button text and URLs to each instance. To adjust JavaScript behaviors for component symbols, edit values in the Symbol Properties panel. To add customizable properties to that panel, you must edit the JavaScript file associated with the symbol. Break symbol links 1 Select the instance. 2 Select Modify > Symbol > Break Apart. The selected instance becomes a group. The symbol in the Document Library panel is no longer associated with that group. After separation from the symbol, a former button instance loses its button symbol characteristics and a former animation instance loses its animation symbol characteristics. Edit an instance without breaking the symbol link 1 Select the instance. 2 Modify instance properties in the Property inspector. These instance properties can be modified without affecting the symbol and other instances: • Blending mode • Opacity • Filters • Width and height • x and y coordinates Create and use component symbols Component symbols are graphic symbols that can be intelligently scaled and given specific attributes using a JavaScript (JSF) file. Modifying an instance with the Properties panel affects the symbol and all other instances. However, modifying parameters in the Symbol Properties panel (Window > Symbol Properties) affects only the selected instance. Fireworks includes a library of predesigned component symbols; you can customize these symbols to match the appearance of a particular website or user interface. Add a component symbol to a document 1 Select Common Library from the Window menu. 2 To use a symbol, drag and drop the symbol from the Common Library panel to the Fireworks canvas. Adjust component symbol properties 1 On the canvas, select the symbol. 2 In the Symbol Properties panel (Window > Symbol Properties), adjust parameters such as state, label, and color. To create interactive buttons for HTML-based web and software prototypes, see "Interactive slices" on page 163. Create a component symbol 1 Create an object with attributes that you want to customize. Last updated 3/8/2011

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
  • 61
  • 62
  • 63
  • 64
  • 65
  • 66
  • 67
  • 68
  • 69
  • 70
  • 71
  • 72
  • 73
  • 74
  • 75
  • 76
  • 77
  • 78
  • 79
  • 80
  • 81
  • 82
  • 83
  • 84
  • 85
  • 86
  • 87
  • 88
  • 89
  • 90
  • 91
  • 92
  • 93
  • 94
  • 95
  • 96
  • 97
  • 98
  • 99
  • 100
  • 101
  • 102
  • 103
  • 104
  • 105
  • 106
  • 107
  • 108
  • 109
  • 110
  • 111
  • 112
  • 113
  • 114
  • 115
  • 116
  • 117
  • 118
  • 119
  • 120
  • 121
  • 122
  • 123
  • 124
  • 125
  • 126
  • 127
  • 128
  • 129
  • 130
  • 131
  • 132
  • 133
  • 134
  • 135
  • 136
  • 137
  • 138
  • 139
  • 140
  • 141
  • 142
  • 143
  • 144
  • 145
  • 146
  • 147
  • 148
  • 149
  • 150
  • 151
  • 152
  • 153
  • 154
  • 155
  • 156
  • 157
  • 158
  • 159
  • 160
  • 161
  • 162
  • 163
  • 164
  • 165
  • 166
  • 167
  • 168
  • 169
  • 170
  • 171
  • 172
  • 173
  • 174
  • 175
  • 176
  • 177
  • 178
  • 179
  • 180
  • 181
  • 182
  • 183
  • 184
  • 185
  • 186
  • 187
  • 188
  • 189
  • 190
  • 191
  • 192
  • 193
  • 194
  • 195
  • 196
  • 197
  • 198
  • 199
  • 200
  • 201
  • 202
  • 203
  • 204
  • 205
  • 206
  • 207
  • 208
  • 209
  • 210
  • 211
  • 212
  • 213
  • 214
  • 215
  • 216
  • 217
  • 218
  • 219
  • 220
  • 221
  • 222
  • 223
  • 224
  • 225
  • 226
  • 227
  • 228
  • 229
  • 230
  • 231
  • 232
  • 233
  • 234
  • 235
  • 236
  • 237
  • 238
  • 239
  • 240
  • 241
  • 242
  • 243
  • 244
  • 245
  • 246
  • 247
  • 248
  • 249
  • 250
  • 251
  • 252
  • 253
  • 254
  • 255
  • 256
  • 257
  • 258
  • 259
  • 260
  • 261
  • 262
  • 263
  • 264
  • 265
  • 266
  • 267
  • 268
  • 269
  • 270
  • 271
  • 272
  • 273
  • 274
  • 275
  • 276
  • 277
  • 278
  • 279
  • 280
  • 281
  • 282
  • 283
  • 284
  • 285
  • 286
  • 287
  • 288
  • 289
  • 290
  • 291
  • 292
  • 293
  • 294
  • 295
  • 296
  • 297
  • 298
  • 299
  • 300

149
USING FIREWORKS CS4
Styles, symbols, and URLs
La
s
t updated 3/8/2011
Button symbols have several features that let you retain symbol-instance relationships while assigning unique button
text and URLs to each instance.
To adjust JavaScript behaviors for component symbols, edit values in the Symbol Properties panel. To add
customizable properties to that panel, you must edit the JavaScript file associated with the symbol.
Break symbol links
1
Select the instance.
2
Select Modify
> Symbol
> Break Apart.
The selected instance becomes a group. The symbol in the Document Library panel is no longer associated with
that group. After separation from the symbol, a former button instance loses its button symbol characteristics and
a former animation instance loses its animation symbol characteristics.
Edit an instance without breaking the symbol link
1
Select the instance.
2
Modify instance properties in the Property inspector.
These instance properties can be modified without affecting the symbol and other instances:
Blending mode
Opacity
Filters
Width and height
x
and
y
coordinates
Create and use component symbols
Component symbols are graphic symbols that can be intelligently scaled and given specific attributes using a JavaScript
(JSF) file. Modifying an instance with the Properties panel affects the symbol and all other instances. However,
modifying parameters in the Symbol Properties panel (Window
> Symbol Properties) affects only the selected
instance.
Fireworks includes a library of predesigned component symbols; you can customize these symbols to match the
appearance of a particular website or user interface.
Add a component symbol to a document
1
Select Common Library from the Window menu.
2
To use a symbol, drag and drop the symbol from the Common Library panel to the Fireworks canvas.
Adjust component symbol properties
1
On the canvas, select the symbol.
2
In the Symbol Properties panel (Window
> Symbol Properties), adjust parameters such as state, label, and color.
To create interactive buttons for HTML-based web and software prototypes, see “
Interactive slices
” on page
163.
Create a component symbol
1
Create an object with attributes that you want to customize.