Change fill color

To change the fill color of the stamp background, move the mouse on and off the stamp.

To create the above rollover, download the zip files or hqx files, then do the following:

  1. Name the blue background element blue rectangle.
  2. Select all of the stamp elements and group them.
  3. Make sure the above group is selected.
  4. Using the "Windows" menu, show the SVG Interactivity Palette.
  5. Using the SVG Interactivity Palette, link in the events.js file.
    1. Click on the folder icon.
    2. Click on the "Add" button to source in a JavaScript file.
    3. In the "URL" text field, type events.js . Note: If the events.js file will not be located in the same directory as the SVG file, add the relative path of the events.js file.
    4. Click the "OK" button and then click the "Done" button.
  6. Using the SVG Interactivity Palette, add the mouse events.
    1. Select "onmouseover" from the "Event" drop-down menu.
    2. In the "JavaScript" text field, type elemColor(evt, 'blue rectangle', '#336699') and press <Enter>.
    3. Select "onmouseout" from the "Event" drop-down menu.
    4. In the "JavaScript" text field, type elemColor(evt, 'blue rectangle', '#A4B5D6') and press <Enter>.
  7. Using the default settings, export the file as SVG and name it change_color.svg.
  8. Copy a version of Samples/SVG_Interactivity_Palette/mouse_events/events.js into the same directory as the SVG file or to the relative location you specified earlier.
  9. Embed SVG within an HTML document by adding the following to the <BODY> of your HTML:
    <EMBED SRC="change_color.svg" TYPE="image/svg-xml" PLUGINSPAGE="http://www.adobe.com/svg/viewer/install/" HEIGHT="158" WIDTH="131">

    This presumes that the SVG file is in the same directory as the HTML and that the height and width correspond with those of the SVG file.