J-Perk Help File Contents

General and Ordering Information

What is J-Perk?

How to Order J-Perk

What's New in this version of J-Perk

Special effect Descriptions

Image Effects

Animations

Rotating Banner/Billboard Wizard

Animation Wizard

Dynamic Buttons

Image Fade effect

Image Cube effect

Image Ripple effect

Lake Reflection effect

More Image Effects

Animated Button

Image Rollover

Random Image effect

Text Effects

Typewriter Text

Swirly Text

Status Bar Text Ticker

Navigator Text Ticker

Fading Text Messages

Smooth Scrolling Text

Text Button

Text Effects

Text Transitions

Random Quote effect

Other Special Effects

All-in-One Button

Background Color Fade-in/Fade-out

Password Protection

Digital Clock special effect

Pulldown Menu

Sound Effect

Popup Alert Box

Popup Window

Scrolling Credits

Web page Transitions

Editing existing special effects that you've created

The Preview Wizard and Finishing your special effect

Other Help

Troubleshooting

Microsoft FrontPage Support

Microsoft Publisher 98 Support

NetObjects Fusion

FrontPage Express

Netscape Composer

DreamWeaver

AOLPress

Yahoo/Geocities ageBuilder


What Is J-Perk?

J-Perk is used to create animations and other special effects for Web pages using Java applets, DHTML and JavaScript.  The special effects are pre-made for your use, and J-Perk makes it easy to insert them into your Web pages.

J-Perk allows you to input parameters and properties for the different special effects and then creates the HTML code with a click of a button!  The HTML code is then inserted into your HTML document, and the document and required special effect files can be uploaded to a Web site for instant use.  It's that simple!

Special thanks to Eric Harshbarger and the Catalyst New Media Marketing lab, Fabio Ciucci and David Griffiths for letting McWeb Software include their Java applets in J-Perk!!!!


What's New in J-Perk

J-PERK 6.0

Bug Fixes:

None.

Additions:

 5 new special effects have been added:

Random Image

Random Quote

Personalize your Web page

All-in-One Button

Text Button

And the Digital Clock special effect has been improved!

 The Preview Wizard has been improved and now includes the ability to auto-insert your special effect into your Web page.

 The user interfaces for all the special effect creation wizards have been updated and improved.

 The Pulldown Menu special effect now supports opening the Web page associated with a menu item in a new browser window.


Screen Color Fade-in/Fade-out effect
Background Color Fade-in/Fade-out effect

Description: This JavaScript fades between two Web page background colors when your Web page loads and when it exits.  Fade-in: When your Web page is loaded into the browser the screen will fade from one color to a second color and then display the contents of your Web page.

Fade-out:  When exiting your Web page to view another Web page the screen will fade from one color to a second color and then display the next Web page.

Browser Compatibility: IE3, IE4, IE5, Netscape 3 and 4

The dialog box for setting Screen Color Fade-in/Fade-out parameters is shown below:

You can select the color to fade from, the color to fade into and the fading speed.  To select the colors, click on the boxes marked select and the color selection box will appear, allowing you to select a color.

You can have your Web page only fade-in, only fade-out, or have both effects on your Web page.

Example:

Suppose you wish to have your Web page fade-in from red to blue when someone loads it in their browser.

1.  First, open the Screen Color Fade-in/fade-out  dialog box.

2.  In the section marked Fade-in, click on the box marked 'Click to Select Color' next to the text box labeled 'Fade from this color'.  This will display the color selection box.

3.  Choose the color red and click OK.  The RGB color code will display in the text box and the color red will be displayed in the box.

4.  Then click on the box marked 'Click to Select Color' next to the text box labeled 'Fade into this color'.  This will display the color selection box.

5.  Choose the color blue and click OK.  The RGB color code will display in the text box and the color blue will be displayed in the box.

6.  Set the speed of the fade.  Set it on a slow setting so you can actually see the fade.  If you set it too fast you may not see it.

7.  When you are done click the OK button on the Fade-in/Fade-out dialog box and the HTML code for this Javascript will be displayed in the Preview Wizard for cutting and pasting into an HTML editor.

The code generated for this particular special effect is a full HTML document, so you should paste it into a blank document and insert your other Web page contents between the <BODY></BODY> tags of the text.

Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Swirly Text
Swirly text effect

Description: This special effect causes the specified text to change through a range of colors simulating a swirling color effect.

Required files:  ColorSwirl.class

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

The dialog box for setting Swirly text parameters is shown below:

The following are the property settings for the Swirly text effect:

Swirly text:  In the text box enter the text you wish to display as swirly text in your Web page.  This is a required setting.

Font:  This is the name of the font you wish the swirly text to be displayed in.  There are a limited number of fonts which you can use.

Font Size:  This is the size of the font you wish the swirly text to be displayed in (specified in point size e.g., for 14 pt text type 14 into the input box).

Left margin:  This is the width of the left margin in pixels.  You can specify (in pixels) where you wish the text to start (measured from the left side of the special effect).

Top margin:  This is the height of the top margin in pixels.  You can specify (in pixels) where you wish the text to be located (measured from the top of the special effect).  For example, if you put Y-loc to be 25 pixels, then the bottom of the text would be located 25 pixels from the top of the special effect.

Width(pixels):  This is the width of the special effect (specified in pixels).  The width should be large enough to show the swirly text.  This is a required setting.

Height(pixels):  This is the height of the special effect (specified in pixels).  The height should be large enough to show the swirly text.  This is a required setting.

Background Color:  This is the background color of the special effect.  The specified width and height of the special effect will be filled with this color on the Web browser's screen (specified in RGB values).

-  When you are done click the OK button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


All-in-One Button

Description: This special effect causes the specified text to change through a range of colors simulating a swirling color effect.

Required files:  None

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

The first screen for setting All-in-One Button parameters is shown below:

Select the type of button you wish to use on your Web page.  You can choose an HTML button, image or hyperlink.

Also, select the button behavior (what you’d like the button to do).  You have the following choices for the button behavior:

- Link to another Web page

- Print the current Web page

- Close the current browser window

- Play a sound

- Add current Web page to Favorites/Bookmarks

Click the “Next >>” button and the following screen will be displayed:

The following are the property settings for the All-in-one button:

Hyperlink text: If you choose a button type of ‘Hyperlink’ you must specify the hyperlink text (the text that will appear on your Web page).

Button text: If you choose a button type of ‘Button’ you must specify the text that will be displayed on the button.

Image Filename: If you choose a button type of ‘Image’ you must specify the filename of the image you wish to use as your button.  Click the ‘browse’ button to find the image on your computer’s hard drive.

Sound file: If you choose a button behavior of ‘Play a sound’ you must specify the name of the sound file you wish to be played when the button is pushed/clicked. Click the ‘browse’ button to find the image on your computer’s hard drive.

URL:  This is the URL of the Web page you wish to link to or wish to save to the Favorites/Bookmarks list when the user pushes/clicks on your button.

Title for Favorites List: This is the text that will be placed in the Favorites/Bookmarks list representing the URL that is saved to the list.

When you have finished creating the button click the ‘Done’ button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Random Image
Random Image effect

Description: This special effect displays a random image on your Web page.  A different image is displayed each time the Web page is loaded.

Required files:  None

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

The dialog box for creating the Random Image effect is shown below:

To create the Random Image special effect, follow these steps:

1. Click the “Add image…” button to add images to the Image List.  This list contains all the images you want to be displayed randomly in your Web page.  If you need to remove an image after adding it to the list, select the image in the list and then click the “Remove image” button.

2. When you are done adding images to the list, click the “Done” button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Random Quote
Random Quote effect

Description: This special effect displays a random quote on your Web page.  A different quote is displayed each time the Web page is loaded.

Required files:  None

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

The dialog box for creating the Random Quote effect is shown below:

To create the Random Quote special effect, follow these steps:

1. Click the “Add quote…” button to add textual quotes to the Quote List.  This list contains all the text quotes you want to be displayed randomly in your Web page.  If you need to remove a quote after adding it to the list, select the quote in the list and then click the “Remove quote” button.

2. If you need to edit an existing quote in the list, select the quote and click the “Edit quote…” button.  A dialog box allowing you to edit the quote will be displayed.  Change the text of the quote and click the “OK” button to accept your changes.

3. When you are done adding images to the list, click the “Done” button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Text Button

Description: This special effect creates a 3D button with text on it.  The text changes when you mouseover or click on the button and the button links to a Web page when clicked.

Required files: ButtonPLUS3.class

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

The first screen for creating the Text Button effect is shown below:

There are three different states to the Text Button:

MouseOut – When the mouse is not hovering over or touching the button.

MouseOver – When the mouse is hovering over the button.

MouseClick – When the user clicks the mouse on the button.

Follow these steps to create a Text Button:

1. Specify the text you wish to appear on the button face during the MouseOut, MouseOver, and MouseClick states.

2.  In the text box labeled “Link to this URL” enter the URL of the Web page that the button will display when it is clicked on.

3. Specify the target frame of the URL to be displayed.  This is an optional setting.

4. Click the “Next >>” button to display the second screen of the Text Button wizard, as shown below:

This screen allows you to set the button and text properties for your Text Button.

The available properties are defined below:

Width and Height: Specify the width and height of the button in pixels.

Background Color: Click this color picker to specify the color of the button.

3D border size: Specify the thickness of the button.  A higher number (10) will result in a thicker, beveled button.  Sizes range from 0 to 10.

Font: Specify the font name from the list of available fonts.  Only 5 fonts are supported by this special effect.

Font size: Specify the size of the font (in points).

Text Color: Click this color picker to specify the color of the text on the button.

Horizontal alignment: Specify the horizontal alignment of the text on the button.  Available alignments are left, center and right.   Specifying “left” as the alignment will align the button text with the left side of the button.

Vertical alignment: Specify the vertical alignment of the text on the button.  Available alignments are top, center and bottom.   Specifying “top” as the alignment will align the button text along the top edge of the button.

5. When you are done adding images to the list, click the “Done” button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Sound Effect

Description: This special effect plays a sound file when the Web page is loaded and plays another sound file when the user exits the Web page.  Both WAV and AU sound file formats are supported.

Required files: None

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

The dialog box for setting Sound Effect parameters is shown below:

The following are the settings for the Sound Effect special effect using WAV files:

Play this sound when Web page loads:  Use the browse button to select the sound file you want to play when the user loads your Web page.

Loop the sound (only available in Internet Explorer):  This setting allows you to loop the sound file so that it plays repeatedly.  Only Internet Explorer supports this feature.

Play this sound when Web page exits:  Use the browse button to select the sound file you want to play when the user exits your Web page.

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Popup Alert Box

Description: This special effect displays a message box when your Web page is loaded.  The message box displays a message and the user must click the OK button to proceed.

Required files:  None

Browser Compatibility: IE3, IE4, IE5, Netscape 3 and 4

The dialog box for setting Popup Alert Box parameters is shown below:

The following are the settings for the Popup Alert Box special effect:

PopUp Alert box type:  Select the type of Popup Alert box you would like to use in your Web page.  The three types are explained below:

Simple Alert box – Allows you to alert the user with a simple popup box.

OK/Cancel box – Displays a box with ‘OK’ and ‘CANCEL’ buttons.

Input Prompt box – Displays a box with an input textbox allowing you to request input (a line of text) from the user.

Type the text to appear in the Popup Alert box:  Enter the text that you wish to be displayed in the Popup Alert box when the Web page is loaded.

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Personalize your Web page

Description: This special effect displays your Web site visitor’s name, number of visits and data/time of their last visit.

Required files:  None

Browser Compatibility: IE3, IE4, IE5, Netscape 3 and 4

The first screen for setting Personalize properties is shown below:

Specify the way you want to ask the visitor for their name:

Ask the visitor for their name: Specify the text you wish to appear on your Web page when asking the user for their name.  For example, you might want to display the following text on your Web page: “Please enter your name:”

Ask the visitor using a: Specify how you wish to ask the user for their name.  The two available methods are:

- Popup box – When the visitor loads your Web page a popup box will appear and allow them to enter their name.

- Web page form – Your Web page will contain a text input box and a button that will allow the user to type their name and click the button to save it.

Once you’ve specified these settings, click the “Next >>” button to move to the next screen, as shown below:

This screen allows you to specify how you wish to greet your visitor when they return to your Web page.  For example, once they have entered their name your Web page display a friendly personalized greeting like “Hello, Bob”.  In the input box on this screen, enter the greeting you wish to use.

Once you’ve specified these settings, click the “Next >>” button to move to the next screen, as shown below:

The following  options can be selected on this screen:

Show the number of time the user has visited your Web page:  Checking this box results in the number of Web page visits by that particular visitor to be displayed when he/she views your Web page.  For example, if Bob has visited your Web page 25 times, he will see the following text on your Web page when he views it: “You have visited this Web page 25 times.”

Show the date and time of the user’ last visit to your Web page: Checking this box results in the date/time of the last Web page visit by that particular visitor to be displayed when he/she views your Web page.  For example, if Bob last visited your Web page on May 8th at 1:30PM, he will see the following text on your Web page when he views it: “You last visited this Web page on Thu May 8, 2001  1:30.”

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Image Rollover

Description: This special effect changes an image when the user moves the mouse over different images on the Web page.

Required files:  None

Browser Compatibility: IE4, IE5, Netscape 3 and 4 (This effect will NOT work in Internet Explorer 3.0).

The dialog box for setting the initial Image Rollover parameters is shown below:

The following are the property settings for the initial Image Rollover parameters:

Default Active Image:  Use the browse button to select the image that you wish to initially appear on your Web page when the page first loads.  The Active image is the image that will change when the mouse is moved over other images on the Web page.  The default Active image must be specified.

After selecting the Default Active Image, click the ‘Next’ button and move on to the following screen:

The following are the property settings for the Inactive and Active Rollover Images.

When the user moves the mouse over this inactive image:  Use the browse button to select the image that you wish to appear as an Inactive Image.  When the user moves the mouse over any Inactive Image the Active Image will change.  For example, you can have many inactive images on your Web page.  When the mouse is moved over each Inactive Image the Active Image will change to a different image for each.

Active image will change to this image:  Use the browse button to select the image that you wish to appear as the new Active Image when the user moves the mouse over the corresponding Inactive Image.

When the user clicks on this Inactive Image, load this URL:  Specify the URL of the Web page that you wish to load when the user clicks the mouse on the corresponding Inactive Image.  When the user clicks the mouse on the Inactive Image, the Web browser will load this URL.

Continue to specify as many Inactive and Active images as desired by clicking the ‘Next’ button.  When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Pulldown Menu

Description: This JavaScript special effect creates a pulldown menu which links to different Web pages when the user selects a menu item and clicks on the button.

Required files:  None

Browser Compatibility: IE3, IE4, IE5, Netscape 3 and 4

The dialog box for setting the Pulldown Menu properties is shown below:

Use the following buttons to create your Pulldown menu:

Add Menu item:  Use this button to add new Menu items to the list.

Add Separator:  Use this button to add a separator line in the menu.  This line will not be linked to any Web page URL.

Edit Menu item:  Use this button to edit existing Menu items. Simply select the menu item you wish to edit.  Then click the ‘Edit Menu item…’ button and you will be allowed to edit the Menu item’s settings.  Separators cannot be edited (only removed).

Move up:  Use this button to move a selected Menu item upward in the list.

Move down: Use this button to move a selected Menu item downward in the list.

Remove Menu item:  Use this button to remove Menu items.  Simply select the menu item you wish to remove.  Then click the ‘Remove Menu item’ button.

To begin creating your Pulldown menu, click the ‘Add Menu item…’ button.  The following dialog box will appear:

Provide the following properties for each menu item:

Menu item text:  Enter the text for each Pulldown menu item.  Enter one menu item at a time.

Link Menu item to this URL:  This is the URL of the Web page that will be displayed when the user selects the corresponding menu item and clicks on the menu’s 'Go to' button.

These are additional settings for the Pulldown menu:

Target Frame(Optional, only if using Frames:  If you want the Menu item linked Web page URLs to be displayed in a specific frame, specify the name of the frame here.  You cannot specify a different frame name for different menu items.  Only one frame name can be specified for all menu items.

Display as a dropdown menu:  This will display the menu as a dropdown menu which shows only one menu item.  The user can click on the menu and it will expand to show all the menu items.

or

Display all menu items:  This will display the menu as an expanded menu showing all the menu items.

When you have finished with all settings for all Pulldown Menu items, click the ‘OK’ button.  This particular special effect does not require any extra files and you can cut and paste it the HTML code into your HTML document using an HTML (Web page) editor of your choice..

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Smooth Scrolling Text
Smooth Scrolling Text effect

Description: This special effect creates a scrolling text ticker that scrolls smoothly across the screen.

Required files:  RTLScroller.class  OR  LTRScroller.class

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

The dialog box for setting Smooth Scrolling Text parameters is shown below:

The following are the settings for the Smooth Scrolling Text special effect:

Scrolling text:  In the text box enter the text you wish to display as smooth scrolling text in your Web page.  This is a required setting.

Width(pixels):  This is the width of the special effect (specified in pixels).  The width should be larger than the width of the text, otherwise the Smooth Scroller won't work correctly.  This is a required setting.

Height(pixels):  This is the height of the special effect (specified in pixels).  This is a required setting.

Background Color:  This is the background color of the special effect.  The specified width and height will be filled with this color on the Web browser's screen specified in decimal values(not specified in RGB values).  Click on the box marked 'Click to Select Color' to pick a color from the Windows color palette.

Font:  This is the name of the font you wish the Smooth Scrolling text to be displayed in.  There are a limited number of fonts which you can use.

Font Size:  This is the size of the font you wish the Smooth Scrolling text to be displayed in (specified in point size e.g., for 14 pt text type 14 into the input box).

Text Color:  This is the color of the Smooth Scrolling text.  It is specified using the decimal value of the color (not the RGB value).  Click on the box marked 'Click to Select Color' to pick a color from the Windows color palette.

Scroll Speed:  This is the speed that the text will scroll.  Values for scrolling speed range from 0 to 20.

Scroll Direction:  This is the direction that the text will scroll.  You can choose to have the text scroll from the left side of the screen to the right or from the right to the left.

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.

The Smooth Scroll Horizontal Marquee applets are freeware provided by OpenCube Technologies, copyright (c) 1997.


Fading Text Message
Fading Text Messages

Description: This special effect creates text messages that fade in and out.  A maximum of 10 text messages is allowable.

Required files:  FadeText.class

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

The dialog box for setting Fading Text Messages default parameters is shown below:

The following are the settings for the Fading Text Messages special effect:

Message Width(pixels):  This is the width of the message box (specified in pixels).  The width should be large enough to show the text of the messages.  If the width of the box is not large enough to accomodate the text, then an error will occur.  Either resize the font or resize the message box dimensions.  This is a required setting.

Message Height(pixels):  This is the height of the message box (specified in pixels).  The height should be large enough to show the text of the messages.  If the height of the box is not large enough to accomodate the text, then an error will occur.  Either resize the font or resize the message box dimensions.  This is a required setting.

Default Font:  This is the name of the default font you wish the text to be displayed in.  There are a limited number of fonts which you can use.

Default Font Size:  This is the default size of the font you wish the text to be displayed in (specified in point size e.g., for 14 pt text type 14 into the input box).  You can later specify different font sizes for each text message when you are inputting the settings for each text message.  If the font size is not specified for individual messages, then the default font size will be used.

Default Background Color:  This is the default background color of the special effect.  The specified width and height of the special effect will be filled with this color on the Web browser's screen (specified in RGB values).  Click on the box marked 'Click to Select Color' to pick a color from the Windows color palette.  You can later specify different background colors for each text message when you are inputting the settings for each text message.  If the background color is not specified for individual messages, then the default background color will be used.  Best results occur when the same background color is used for all messages.

Default Text Color:  This is the default color of the text (specified in RGB values).  Click on the box marked 'Click to Select Color' to pick a color from the Windows color palette.  You can later specify different text colors for each text message when you are inputting the settings for each text message.  If the text color is not specified for individual messages, then the default text color will be used.  Best results occur when the different text colors are used on a white background.

Margin size:  This is the distance between the edge of the message box borders and the text (specified in pixels).

The dialog box for setting the individual properties of each text message is shown below.

Background Color:  This is the background color for a specific message (specified in RGB values).  Each message can have a different background color by setting this property (otherwise the default background color will be used).  Click on the box marked 'Click to Select Color' to pick a color from the Windows color palette.  Best results occur when the same background color is used for all messages.

Text Color:  This is the color of the text in each individual text message (specified in RGB values).  Click on the box marked 'Click to Select Color' to pick a color from the Windows color palette.  Each message can have a different text color by setting this property (otherwise the default text color will be used).  Best results occur when the different text colors are used on a white background.

Font Size:  This is the size of the font you wish the text to be displayed in (specified in point size e.g., for 14 pt text type 14 into the input box).  Each message can have a different font size by setting this property (otherwise the default font size will be used).

Pause:  This is the amount of time between the display of each message (specified in milliseconds).  The default value is 2000 milliseconds (2 seconds).

URL to link to:  You can specify a URL for each individual text message so that users can click on a particular text message and the URL will load in the browser.  The default value is NULL, meaning no URL is assigned to any text message (clicking on a text message will result in nothing happening).

Fill out each of these settings for each text message that you want to create.  When you are finished with a text message, press the 'Next>>' button to move on to specify the settings for the next text message.  You can also press the '<<Previous' button to go back and change existing text message settings.

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.

The Fading Messages special effect is freeware provided by OpenCube Technologies, copyright (c) 1997.


Navigator Text Ticker

Description: This special effect creates a scrolling ticker tape with clickable text that links to specified Web pages (URLs).

Required files:  NavigatorTicker20.class

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

The dialog box for setting Navigator Ticker parameters is shown below:

The following are the settings for the Navigator Ticker:

Applet Width(pixels):  This is the width of the text ticker (specified in pixels).  The width should be large enough to show the text of the messages.  This is a required setting.

Applet Height(pixels):  This is the height of the text ticker (specified in pixels).  The height should be large enough to show the text of the messages.  This is a required setting.

Alignment: The alignment to neighboring text is similar to the alignment used by Web images in Web pages.  The same options apply to special effects: top, bottom, middle, baseline, texttop, absbottom, left and right.

Background Color:  This is the default background color of the text ticker.  The specified text ticker width and height will be filled with this color on the Web browser's screen (specified in RGB values).  Click on the box marked 'Click to Select Color' to pick a color from the Windows color palette.  Default is white.

Text Color:  This is the default color of the text (specified in RGB values).  Click on the box marked 'Click to Select Color' to pick a color from the Windows color palette.  Default is black.

Link color:  This is the color of the text when the user moves the mouse cursor over it (specified in RGB values).  Click on the box marked 'Click to Select Color' to pick a color from the Windows color palette.  Default is Blue.

3D border around ticker:  You can specify a 3D border outlining the text ticker or you can choose to have no border.  Default is 'No border'.

Scrolling Speed:  This is the speed at which the text scrolls across the screen.  Valid values range from 1 to 20.  Default is 3.

The dialog box for setting the individual properties of each text message in the Navigator Ticker is shown below.

Text message to scroll in Navigator Ticker:  You can specify each text message that you want to scroll across the Navigator Ticker.  Each message can then be assigned a URL to link to.

URL to link to:  You can specify a URL for each individual text message so that users can click on a particular text message and the URL will load in the browser.

Frame to Target:  You can specify a frame window to target when the user clicks on the Navigator Ticker to open a URL.  This will result in the specified Web page opening in the target frame window.

Fill out each of these settings for each text message that you want to create in the Navigator Ticker.  When you are finished with a text message, press the 'Next>>' button to move on to specify the settings for the next text message.  You can also press the '<<Previous' button to go back and change existing text message settings.

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.

The Navigator Ticker applet is used courtesy of ITS of Egypt http://its.egnet.net.

Navigator Ticker Web page-  http://its.egnet.net/Java/applets/navtickr

Contact Person: Ahmed Abdelhady  ahady@its.egnet.net


Digital Clock

Description: This special effect displays a working clock (in numeric format) on your Web page.  It also has the capability to display the date.

Required files:  None

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

The first screen for setting Clock properties is shown below:

Begin by selecting from the following choices:

- Show the Date only

- Show the Time only

- Show both the Date and Time

Once you’ve made your selection, click the “Next >>” button to move on to the next screen, shown below:

Select the date format you wish to display by clicking on one of the available formats from the list.  If you wish to also include the name of the day of the week (i.e., Monday, Tuesday, etc.) check the checkbox labeled Show the day of the week.

Click the “Next >>” button to move to the next screen, shown below:

The following Time Format properties can be set on this screen of the Digital Clock wizard:

Show seconds:  Checking this box will display the number of seconds of the current time.  It is a dynamic clock so the clock will show the number of seconds incrementing.

Show AM/PM:  Checking this box will display an “AM” or “PM” after the clock depending on the time of day.

24 hour clock (military time):  Checking this box will display a military clock format.  For example 6 o’clock PM will not be displayed as “6:00”.  It will be displayed as “18:00”.

Show Time before Date: The default setting is for the Date to be displayed before the Time (e.g., “November 8, 2001   12:31PM”.  Checking this box will display the time before the date (e.g.  , “12:31 PM   November 8, 2001”

Click the “Next >>” button to move to the next screen, shown below:

The following Clock properties can be set on this screen of the Digital Clock wizard:

Background Color:  Click the color picker to specify the background color of the clock.

Font:  Select a font name from the dropdown list or by clicking on the button labeled “more…”

Font Size: Specify a font size by selecting from the dropdown list.  The font sizes are specified in points.

Font Color:  Click the color picker to specify the color of the Clock text.

Font style:  Select a font style from the dropdown list.  Available styles are Normal, Bold, Italic or Bold Italic.

Padding:  Specify the padding (space or margins) to be placed around the clock text.   This number is specified in pixels.

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Password Protection

Description: This JavaScript special effect allows you to password-protect your Web pages.

Required files:

If using the JavaScript password protection:  None

If using the CGI script password protection: password.cgi

IMPORTANT!

The JavaScript password protection does not provide a high level of security.  It provides enough security so that the average user wouldn’t be able to access your Web pages.

The CGI script password protection provides a high level of security.  Your Internet service provider must allow the use of custom CGI scripts on your Web site to be able to use this protection (Web services like AOL .and GeoCities don’t support the use of CGI scripts on their Web pages.)

JavaScript Password Protection

Browser Compatibility: IE3, IE4, IE5, Netscape 3 and 4

The dialog box for the JavaScript Password Protection effect is shown below:

The following are the settings for the JavaScript Password protection:

There are two types of password protected Web pages that you can create.

1) One password to protect your Web page so that a user must know that password to access the page.

2) Several pages, each with their own password.  The name of the page must be the same as the entered password.  For example, if a user types in "bob" as the password, then the bob.html page is opened.  If a user types "tim" as the password, then the tim.html page is opened.  This is good for having many user-specific pages that you only want your users to know about.

If you choose type 1:

You must fill in the following parameters:

Password:  This is the single password that all users will be using to access the specified Web page.

URL of Web page to display when correct password is given:  This is the Web page that is password protected.  It will be displayed when a user enters the correct password in the input box when viewing your Web page.

If you choose type 2:

You must fill in the following parameters:

URL of Web page to display when user types in password:  This is the Web page URL path of the Web page that is password protected.  Each Web page will be displayed when a user enters the user-specific password in the input box on your Web page.  Enter only the domain and path information (URL and folder/directory) name into this text box.  Do not enter the Web page name.  For example, you can enter

http://www.mcwebsoftware.com/hidden/files

if this is the URL and path where you are storing all of your password protected files.

To expand on this example, you have two friends, Bob and Tim.  You have two Web pages (one for each of them) called bob.html and tim.html.

The entire URL of these Web pages is

http://www.mcwebsoftware.com/friends/bob.html

http://www.mcwebsoftware.com/friends/tim.html

In the J-Perk input box labeled ‘URL of Web page to display when user types in password’ you should enter the following:

http://www.mcwebsoftware.com/friends

When either friend accesses your Web page, they will be presented with a pop-up box asking them for a password.  When Bob types the password "bob", the bob.html page will be displayed to him.  Likewise for Tim.

When you have completed setting the password protection properties, click the 'Done' button.  J-Perk will create the HTML code to insert into your Web page.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.

CGI Script Password Protection

The dialog box for the CGI Script Password Protection effect is shown below:

The following are the settings for the CGI Script Password protection:

Specify username:  Type the username that people will use to gain access to your password protected Web page.

Specify password: Type the password that people will use to gain access to your password protected Web page.

Display this Web page (URL) when user logs in:  Specify the Web page that will be displayed when the user enters the correct username and password.

Optional settings:

It is possible that the CGI script will not work correctly using its default settings.  You may have to contact your Internet service provider and request information about:

- the path/location of the PERL compiler on the Web server

- ask if it is required to place CGI scripts in a special cgi-bin directory

If your Internet service provider gives you this information then you can specify these optional settings in J-Perk by checking the ‘Change settings’ checkbox.  The following properties will then be enabled to be set manually.  You can enter the information for the following properties:

Path to PERL compiler:  Specify the path to the PERL compiler in this input box.  The default path is already specified and your Web server’s path may be very similar, but not exactly the same.  Using the information you obtained from your Internet service provider, type the path here.

Directory containing password.cgi file:  Web servers sometimes require CGI scripts to reside in a specific directory on their hard drive.  Usually this directory is named ‘cgi-bin’.  You may have to ask your Internet Service provider to create this directory for you in your account’s Web disk space.  If you know the name of the directory that should contain the CGI file, enter it into this input box.

Once you have set all the properties correctly, click the ‘Done’ button to finish the Password Protector.  The Preview wizard will appear, unfortunately you will not be able to fully preview this particular effect using the Preview wizard since it requires the PERL compiler to run.  Most Windows computers do not have a PERL compiler installed. Click here for more information about the Preview Wizard.

You will need to move on to Step 2 and copy the J-Perk generated HTML code into your own Web page.  Move on to Step 3 and copy the required file (password.cgi) to a folder of your choice.

Uploading the password.cgi file and your Web page

Important! The following instructions assume that the password.cgi file and your Web page are allowed to reside in the same folder(directory) on your Web server.

Unless you are running your own Web server (most of you are not), then you CANNOT test the password.cgi file from your local computer.  You must upload it to your Internet Service Provider's (ISP) Web server and then test it on the Web.

There are a few things you must do to make the password.cgi CGI script work correctly.

First we'll try using the default settings in the CGI script to see if the work on your ISP's server.  Follow these steps:

1) Make sure your ISP allows custom CGI scripts (made by customers) to reside on their server.  Sometimes ISPs don't want CGI scripts other than their own on their server.  They may be afraid of security risks.

2) Upload the password.cgi file and your Web page containing the J-Perk generated HTML code (in ASCII format) to your Web server’s disk space provided by your ISP.  Make sure this file is in the same folder(directory) as your Web page on the Web server.

1) 	You must then set the file permissions for the password.cgi file.  Set the file permissions for password.cgi to be 755 (RWE, RE, RE).

Here is an explanation of file permissions.

Web servers have permissions for each file on their hard disks so different users can have access to files and other users cannot.  Web servers have the capability to restrict users from reading files, writing to files, or executing files.  So there are 3 restrictions for files (each with a corresponding number):

read(4)

write(2)

execute(1)

There are also 3 user levels that can be restricted: User(you), Group, and World.

What we need to set for the password.cgi file are permissions that allow everyone to read and execute this file, but not to be able to write to it.  Using your FTP client software you can specify the permissions by selecting the password.cgi file on the Web server and select permissions from the pull-down menus or use the right-click pop-up menu.  It may give you a box that lets you set permissions easily.  Do this by selecting the following:

User: Read, Write, and Execute

Group: Read and Execute

World: Read and Execute

If you must type in the UNIX command to change permissions then the syntax would be:

chmod password.cgi 755

where the numbers 755 represent the permissions.  Here's how we got the numbers.  Adding the numbers together for Read and Execute permissions results in 4+1=5.  You want to give yourself all permissions, so that would be 4+2+1=7.  So, to represent these permissions for user, group, world we would have the following permission numbers: 7 5 5.

4) Now test it online and see if it works.  Open your online Web page in your Web browser.  Enter the correct username and password into the form fields and click the ‘Log in’ button.  It should have displayed your hidden Web page.

Check Troubleshooting if your special effect doesn't work.


Status Bar Text Ticker

Description: This JavaScript special effect scrolls text across the bottom status bar of the Web browser.

Required files:  None

Browser Compatibility: IE3, IE4, IE5, Netscape 3 and 4

The dialog box for setting Status Bar Text Ticker properties is shown below:

The following are the settings for the Status Bar Text Ticker:

Status bar scrolling text:  Enter the text you wish to scroll across the bottom status bar of the browser window.

When you have completed setting the special effect’s properties, click the 'Done' button.  The code generated for this particular special effect is a full HTML document, so you should paste it into a blank document and insert your other Web page contents between the <BODY></BODY> tags of the text.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Dynamic Buttons

Description: The Dynamic Button special effect creates buttons that change when the user moves the mouse pointer over the button and when the user clicks on the button.  Sounds can also be assigned to the mouseover and mouseclick events.

Required files:  ButtonPLUS3.class

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

Making dynamic buttons is easy with J-Perk.  The process consists of 3 main steps:

STEP 1: Button properties when mouse pointer is not interacting with button

Set the Button properties when mouse pointer is not interacting with button settings.  Click the ‘Browse’ button to select the image that you wish to appear on the button when the user’s mouse is not touching the button.

STEP 2: Button properties when mouse pointer is moved over the button

Set the Button properties when mouse pointer is moved over the button settings.  Use the ‘Browse’ button to select the image that you wish to replace the original image when the mouse is moved over the button.

If you wish to play a sound when the mouse moves over the button, then enter the sound filename in the 'Play this sound' input box.  Only .au sound files are supported (WAV files are not supported).

STEP 3: Button properties when mouse pointer is clicked on the button

Set the Button properties when mouse pointer is clicked on the button settings.  If you are using an image as your button, then use the ‘Browse’ button to select the image that you wish to replace the original image when the mouse is clicked on the button.

If you wish to play a sound when the mouse clicks on the button, then enter the sound filename in the 'Play this sound' input box.  Only .au sound files are supported (WAV files are not supported).

In the 'Go to this URL when button is clicked' input box, enter the URL (Web address) you want the user to go to when he/she clicks on the button.  The URL must have the 'http://' prefix or the link will not work.  For example, typing www.yahoo.com will not work, but http://www.yahoo.com will work.

STEP 4: Specify button properties

This screen allows you to enter settings for the Dynamic Button:

The following settings are available:

Width(pixels):  This is the width of the button (specified in pixels).  The width should be large enough to show the button image.  This is a required setting.  It will automatically be inserted by J-Perk if you select your images using the 'Browse' button on Steps 1 through 3 in this wizard.

Height(pixels):  This is the height of the button (specified in pixels).  The height should be large enough to show the button image.  This is a required setting.  It will automatically be inserted by J-Perk if you select your images using the 'Browse' button on Steps 1 through 3 in this wizard.

Background Color:  This sets the background color of the button.  Settings are specified in RGB values.  Click on the color picker to select a color.

3D border size:  This controls the 3D 'look' of the button.  A higher number will result in a more protruding button (a raised button).

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.

Special thanks to Eric Harshbarger and the Catalyst New Media Marketing lab for letting McWeb Software include their Java applets in J-Perk!!!!


Animator Special effect
Advanced Animation Wizard

Description: The Advanced Animation Wizard creates Web page animations including sounds, transitions, and links to other Web page URLs.

Required files:  Animate1.class and CoolTool3.class

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

Making animations is easy with J-Perk.  The process consists of 3 main steps:

1.	Using the drive/folder/file list boxes on the left side of the screen, add image files to the Animation image list (right side of screen).

2.	Set properties for each image such as pauses, sounds, transitions, URLs to link to, how many times to loop the animation, and animation dimensions

3.	Save the animation and view it in your favorite browser (See troubleshooting if your animation isn't working correctly)!

Step 1:

Using the drive, folder and file lists, find the folder where your image files reside.  Once the image files are displayed in the file list, you can insert them into the Animation Image list on the left side of the screen.  You can do this by double-clicking on each image file or by selecting/highlighting an image file and clicking on the 'Add to Image List' button.

Insert the images in the order in which you want them to display in your animationYou can use the Move up, Move down and Delete buttons to rearrange the order of the images in your list.

A maximum of 30 images may be used per animation.

Step 2:

When you have completed inserting the images into the Animation Image list, you can set properties for each image.  Set properties by selecting an image in the Animation image list and click on the 'Set Image  Properties' button or right-click and select 'Set Properties, or double-click on the image in the Animation image list.

These are the available properties that can be set for each image:

     Pauses - controls how long to wait (in milliseconds) after the image loads before loading the next image in the sequence (a value of -1 causes the current frame to remain visible until the user clicks on it and a value of -2 causes the current frame to remain visible until the user moves his/her mouse over it.  The default pause is 100 milliseconds.

     Sounds - controls what sound files are associated with each frame of the animation.  The sound files must be AU files (not WAV files) with the (.au) extension.  The associated sounds play as an image loads.

     Transitions - controls how the images are loaded into the animation and how they change from one to the next (e.g., an image may slide in from the left, fade away, or scroll down to uncover the next image).  The default is for an image to directly overwrite the previous image.

Descriptions of Transitions

overwrite

This is the default transition which simply writes the new image right overtop the old file; no apparent 'transition' really.

slidein(#)

slidein(#) causes the new frame to enter in slowly from a particular direction and cover up the previous image. The direction of entry is determined by the number in parentheses where '1' is the northwest corner, '2' is the northern edge corner, and progressing clockwise until '8' refers to the western edge. Instead of 1-8, an 'r' may be entered... the special effect will then randomly choose a direction each time.

slideout(#)

Similar to slidein(#), slideout(#) causes the old frame to exit the display... uncovering the new image below. The direction of exit is determined by the number in parentheses (numbers correspond to the directions given in slidein(#)). Again, and 'r' may be used in place of a numeric value.

scroll(#)

scroll(#) is similar to slidein(#) except that the new frame appears to 'push' the old frame out instead of overlapping it. Note that only directions 2, 4, 6, and 8 are valid for this transition (corresponding to north, east, south, and west respectively).

expand(#)

expand(#) causes the new frame to start at a point and slowly 'grow' so that it covers the old frame. The point of origin for the expanding frame is determined by the number in parentheses ('1' is the northwest corner, '2' is the center of the northern edge, and progressing clockwise until '8' refers to the western edge). expand(9) puts the point of origin in the center of the display; expand(r) may be used to let the special effect pick a point of origin randomly.

shrink(#)

Similar to expand(#) except that the old image collapses to a point, revealing the new image.

squish(#)

The new image 'squishes' out the old frame. Number values may only be '2' (north) or '6' (south). East and West squishes do not currently work right because of some image rendering loopiness in Java.

shutter

This causes the border of the frame to close over the old image completely then open up, revealing the next frame. The shutter will be the same color as the BORDERCOLORS value for the frame.

random

This causes the special effect to randomly pick a transition

     URLs to link to - this controls which images are associated with Web URLs (addresses) so that the user can click on the image and will be linked to the associated Web page URL,

     Cycles - this controls how many times to loop the animation (0 is used to loop the animation indefinitely),

     Animation Width and Height - this sets the width and height of the animation in pixels.    In general, the animation size will be the size of the images contained within the animation,  These values are required.  These values will be automatically inserted and are equal to the largest dimensions of the largest image in your animation.  You can type in your own values if you wish the size of the animation to be larger.

     Background Color  -  Click on the 'Click to Select Color' button to select a background color from the palette.  The color is specified as the RGB values in this form R,G,B where each color is represented by a number ranging from 0 to 255.  or example, gray would be represented by 192,192,192.

Step 3:

When you have completed inserting all images and setting their properties, you are ready to preview your animation!!  Click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your animation doesn't work.

Special thanks to Eric Harshbarger and the Catalyst New Media Marketing lab for letting McWeb Software include their Java applets in J-Perk!!!!


Animation Wizard

Description: The Animation Wizard is used to create simple animations for Web pages.

Required files:  Animate1.class and CoolTool3.class

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

Making animations is easy with the Animation wizard.

Step 1: Choosing the Animation Images

Using the file and folder lists, select the images (one at a time) for your animation and click on the 'Add to Image List' button (or double-click the file) to add it to the Animation image list.  It's easiest to insert the images in the order you wish them to be animated in, but you can change the image order by using the Move Up, Move Down, and Delete buttons located next to the animation image list.

After inserting all the images, move on to the next step.

Step 2: Setting Animation Properties

The following properties can be set for your animation:

Frame delay: - the amount of time between frames specified in milliseconds

URL: You can specify the URL to associate with your animation.  When a user clicks on your animation the specified URL will load.  The Target frame for the URL is also specified here.

Sounds: Specify a sound to play when your animation begins. If your animation loops several times, then it will play at the beginning of each loop.  Only .au format is supported.  Use an audio editor such as CoolEdit to convert your WAV files to AU files.

After setting these properties, move on to the next step.

Step 3: Setting Animation Properties

The following properties are set using this step:

Animation height and width specified in pixels.  Usually the animation height and width are the same size as the height and width of the animation images.    These values will be automatically inserted and are equal to the largest dimensions of the largest image in your animation.  You can type in your own values if you wish the size of the animation to be larger.

Background color:  Click on the 'Click to Select Color' button to select a background color from the palette.  The color is specified as the RGB values in this form R,G,B where each color is represented by a number ranging from 0 to 255.  or example, gray would be represented by 192,192,192.

Repeat the animation:  Set the number of times you want your animation to loop (iterate).  Setting this value to 0 will keep the animation running forever.

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Rotating Banner/Billboard effect
Rotating Banner/Billboard Wizard

Description: The Rotating Banner/Billboard Wizard is used to create rotating ad banners and image billboards for your Web page.

Required files:  Animate1.class and CoolTool3.class

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

Making rotating Banners and Billboards is easy with the Banner/Billboard wizard.

Step 1: Choosing the Banner/Billboard Images

The image below shows Step 1 of the Banner/Billboard wizard.  Using the file and folder lists, select the images (one at a time) for your banner/billboard and click on the 'Add to Image List' button or double-click the file to add it to the Banner image list.  It's easiest to insert the images in the order you wish them to be animated in, but you can change the image order by using the Move up, Move down, and Delete buttons located next to the Banner image list.

After inserting all the images, move on to the next step.

Step 2: Setting Banner/Billboard Properties

The following properties can be set for each image in your banner/billboard:

URL: You can specify the URL to associate with each image of your banner/billboard.  When a user clicks on a particular image in your banner/billboard the URL associated with that image will load.  The Target frame for the URL is also specified here (if using Frames).

Direction: This controls the direction of motion of each image in your banner/billboard.  There are 4 different settings.  An image can scroll in from the top of the banner to the bottom of the banner, from the bottom to the top, from the left side to the right side, and from the right side to the left side.  The default is scrolling from the top to the bottom.

After setting these properties for each image, move on to the next step.

Step 3: Setting Banner Properties

The following properties are set using this step:

Banner height and width (specified in pixels).  Usually the Banner height and width are the same size as the height and width of the images in your banner/billboard.  These values will be automatically inserted and are equal to the largest dimensions of the largest image in your animation.  You can type in your own values if you wish the size of the animation to be larger.

Background color:  Click on the 'Click to Select Color' button to select a background color from the palette.  The color is specified as the RGB values in this form R,G,B where each color is represented by a number ranging from 0 to 255.  or example, gray would be represented by 192,192,192.

Banner alignment: This sets the alignment of the banner to surrounding text and images on your Web page.

Display each banner image for… (specified in seconds): This sets the delay between each image frame in your billboard.  Setting this property equal to 1 second will result in each image being displayed for 1 second until the next image scrolls in.

Banner rotation speed: This specifies how quickly the banner image will scroll into view.

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Animated Button

Description: The Animated Button effect is used to create buttons that animate when the user’s mouse moves over them or clicks on them.  URLs can be linked to the Animated Button.

Required files:  Animate1.class and CoolTool3.class

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

Step 1: Choosing the Default Button Image

The following image shows step 1 of the Animated Button Wizard:

Using the ‘Browse’ button select the default image that will appear on your button.  Click the ‘Next’ button to move on to the next step.

Step 2: Setting Banner/Billboard Properties

The following image shows step 2 of the Animated Button Wizard:

Using the file and folder, select the images (one at a time) for the animation part of the button.  Click on the 'Add to Image List' button or double-click the file to add it to the Banner image list.  It's easiest to insert the images in the order you wish them to be animated in, but you can change the image order by using the Move up, Move down, and Delete buttons next to the Button image list.

When you have finished adding the animation images to the Button list, click the ‘Next’ button to proceed to step 3.

Step 3: Setting Animated Button Properties

The following image shows step 3 of the Animated Button Wizard:

The following properties can be set for your Animated button:

Frame Delay:  Specify the amount of time (in milliseconds) to delay between frames/images for the animated part of the button.  The default is 200 milliseconds.

URL: You can specify the URL to associate with the Animated Button.  When a user clicks on the button the browser will load the URL/Web page.  The Target frame for the URL is also specified here (if using Frames).

Sounds:  Use the ‘Browse’ button to select a sound file which will activate when the user moves the mouse over or clicks on the Animated Button.

Step 4: Setting Applet Properties

The following image shows step 4 of the Animated Button Wizard:

The following properties can be set for your special effect:

Button Width and Height:  Specify the width and height of the Animated Button in pixels.  The width and height values will automatically be inserted when you select your Animated Button images, but you may want to enlarge the size of the button manually.

Background Color:  Click on the 'Click to Select Color' button to select a background color from the palette.  The color is specified as the RGB values in this form R,G,B where each color is represented by a number ranging from 0 to 255.  or example, gray would be represented by 192,192,192.

Set the Button’s alignment to neighboring text:  The alignment to neighboring text is similar to the alignment used by Web images in Web pages.  The same options apply to this special effect: top, bottom, middle, baseline, texttop, absbottom, left and right.

Behavior:  Select when you want the animation to start:

when the user moves the mouse over the button

or

when the user clicks on the button

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Image Fade effect

Description: This special effect fades from one image into another and then repeats.  Each image can be linked to a URL or another Web page. The images must all be the same size in height and width.

Required files:  ImageFade2ech.class and Pixelator3.class

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

The Image Fade dialog box is shown below:

Using the ‘Add Image’ button, select each image (one at a time) that you want to be in the image fading sequence.  Select them in the order that you wish them to fade.  The images must all be the same size (height and width in pixels).  J-Perk will notify you if an of the images are not the same size.  You can change the order of the images in the fade sequence by using the Move Up, Move Down, and Remove Image buttons.

To link each image to a URL, select the image in the Image List and click the ‘Link to URL…’ button.  The following dialog box will be displayed.  Enter the URL you wish to link to and click ‘OK’.

Simply enter the following properties for the Image Fade effect:

Pause after each fade (seconds):  Specify the amount of time (in seconds) between each image fade.  For example, if you specify 2 seconds, each image will display for 2 seconds and then fade to the next image.  The default is 2 seconds.

Speed of Fade:  Specify how quickly you want the images to fade.

Target Frame (optional, only if using Frames):  Specify the name of the Frame in which the linked URL will open.

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Image Cube effect

Description: This special effect applies an image to each face of a cube and then rotates it.

Required files:  TmapCube.class and TmapCubeb.class

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

Example:

The Image Cube effect dialog box is shown below:

Simply enter the following properties for this special effect:

Image filename:  This is the filename of the image that is applied to each face of the cube.  Use the ‘Browse’ button to select the image from your hard drive.  Note: The image must be 256 x 256 pixels in size.

Applet height and width: These are the measurements of the height and width of the applet in pixels.  These properties will automatically be inserted by J-Perk if you selected your images using the 'Browse' button

Background Color:  Click on the 'Click to select color' button to select a background color from the palette.  The color is specified as the RGB values in this form R,G,B where each color is represented by a number ranging from 0 to 255.  or example, gray would be represented by 192,192,192.

Size of cube:  This sets the visible size of the cube.

Rotation speed:  This sets the cube's speed of rotation about it's X-axis.

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.

Applet programmer: Fabio Ciucci


More Image effects

Description: More Image effects provides you with 8 more effects that you can apply to your images.  The effects include:

Shutter-in:  Your image will be displayed with a camera shutter effect.

Shutter-out: Your image will be displayed with a different camera shutter effect.

Slide-in:  Your image will slide into your Web page from any direction.

Slide-out: Your image will slide out of your Web page in any direction.

Slide-in & Slide-out: Your image will slide in and out of your Web page from any direction.

Expand:  Your image will zoom into the page from a small size to full size.

Shrink:  Your image will zoom out of the page from full size to a small size.

Expand & Shrink:  Your image will zoom in and out of the page.

Required files:  Animate1.class and CoolTool3.class

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

The More Image Effects dialog box is shown below:

Simply enter the following properties for this special effect:

Pick an effect:  Choose from the 8 different image effects.

Select an Image:  Use the ‘Browse’ button to select an image from your hard drive.

Applet Width and Height:  The width and height of the special effect will automatically be inserted when you select your image.  You can specify a smaller or larger size in pixels.

Background Color:  Specify the background color of the effect by clicking on the 'Click to Select Color' button.  The Color picking dialog box will appear and allow you to select a color from the palette.

Loop/repeat the effect:  Specify how many times you want the effect to repeat itself.

Pause after each loop:  Specify how long you want the effect to pause before repeating itself.  Specified in seconds.

Image starts from the ____ of the applet:  Specify the location where you want the image to enter the special effect when it first begins.

Speed:  Specify the speed of the special effect.

Link to URL:  Specify a URL that the image will link to.   For example, ‘http://www.mcwebsoftware.com’

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Image Ripple effect

Description: This special effect produces a ripple effect on an image to make it look like it's made of water.

Required files:  ripple.class

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

Example:

The Image Ripple dialog box is shown below:

Simply enter the following properties for this special effect:

Applet height and width: These are the measurements of the height and width of the applet in pixels.  It should be the same as the height and width of the image.  These properties will automatically be inserted by J-Perk if you selected your image using the 'Browse' button.

Image filename:  This is the filename of the image you want to ripple.  Use the ‘Browse’ button to select the image from your hard drive.

Number of frames (speed):  This is the number of frames used to animate the ripple effect.  A low number of frames will result in a fast, choppy animation.  A higher number of frames will result in a smoother and slower animation.  A frame number that is too high may result in a crash or you may have to wait a long time for the applet to calculate.

Ripple size:  This sets how large the ripples (waves) on the image are made.

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.

Applet programmer: David Griffiths


Lake Reflection effect

Description: This special effect makes your image appear to be reflecting on a pool of water.

Required files:  Lake.class

Browser Compatibility: IE3, IE4, IE5, Netscape 2 through 4

Example:

The Lake Reflection dialog box is shown below:

Simply enter the following properties for this special effect:

Image filename:  This is the filename of the image to be reflected on the pool of water.  Use the ‘Browse’ button to select the image from your hard drive.

Image height and width: These are the measurements of the height and width of the applet in pixels.  It should be the same as the height and width of the image.  These properties will automatically be inserted by J-Perk if you selected your image using the 'Browse' button.

URL to link to:  This is URL of the Web page that the Lake special effect will link to.  When the user clicks on the special effect, the specified URL will load.

Target frame:  This specifies the target frame in which the URL will be displayed.

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.

Applet programmer: David Griffiths


Browser Window Earthquake

Description: This special effect makes your Web browser window shake like an earthquake.

Required files:  None

Browser Compatibility: IE and Netscape

The Browser Window Earthquake dialog box is shown below:

Simply enter the following properties for this special effect:

Size of earthquake:  This controls how much your browser window will shake.  Use the slider to set the value between 1 and 10.

Shake the browser window: This controls the frequency of the shaking.  You can choose to have your window shake once or it can repeat the shaking every x number of seconds.

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Image Brighten effect

Description: This special effect makes your image appear dimmed and it will brighten when the users mouse moves over it.  The brightening effect can occur immediately or gradually.

Required files:  None

Browser Compatibility: IE4, IE5

The Image Brighten dialog box is shown below:

Simply enter the following properties for this special effect:

Image filename:  This is the filename of the image to be dimmed and brightened.  Use the ‘Browse’ button to select the image from your computer’s hard drive.

Image height and width: These are the measurements of the height and width of the applet in pixels.  It should be the same as the height and width of the image.  These properties will automatically be inserted by J-Perk if you selected your image using the 'Browse' button.

URL to link to:  This is URL of the Web page that the image will link to.  When the user clicks on the special effect, the specified URL will load.

Gradual brighten:  Check this box if you want the image to gradually brighten.

Speed:  This specifies how fast the image will brighten.

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


J-Perk Order Form

If ordering with Credit Card, please use the online order form at:

http://www.mcwebsoftware.com/order.asp

To call in your order visit http:// www.mcwebsoftware.com/order.asp for phone info.

Fax in your order at (561) 423-4610

If ordering with cash, check or money order:

Please fill out the following registration form, enclose payment in US dollars in form of check or money order, and send to the address at the bottom of this page.  The fee will license one copy for use on one computer at any one time.  We will email you to notify you of new updates.

PLEASE PRINT CLEARLY!

Name:________________________________________   Date:__________________

Company:_____________________________________________________________

Address:______________________________________________________________

City, State, Zip:_________________________________________________________

Country:___________________________   Phone:__________________________

Email address:____________________________________(Your email address will

NOT be given to any mailing lists, etc.)

------------------------------------------------------------------------------------------------------------------

      __Quantity __	Product	Total

____@ $29.95 each	Web Weaver 98 for Windows 95/98/NT/ME/2000	______

____@ $34.95 each	Web Weaver 98 Gold for Windows 95/98/NT/ME/2000	______

with Site Management/Analysis tool

____@ $34.95 each	J-Perk for Windows 95/98/NT/ME/2000	______

____@ $44.95 each	Web Weaver 98 and J-Perk bundle	______

____@ $49.95 each	Web Weaver 98 Gold and J-Perk bundle	______

Add $8.50 Shipping & Handling if shipped on CD (domestic/ USA)	______

Add $12.50 Shipping & Handling if shipped on CD (international)	______

TOTAL_____________

Pick shipping method:    CD-ROM ___        Download ___

-------------------------------------------------------------------------------------------------------------------

Make checks payable to McWeb Software.

Mail payment and order form to:

McWeb Software

31 Harris St, Ste 201

Brookline, MA 02446

USA

Email McWeb Software at:  info@mcwebsoftware.com if you have any questions.

IN NO EVENT SHALL LICENSOR OR ITS SUPPLIERS BE LIABLE FOR ANY

CONSEQUENTIAL OR INCIDENTAL DAMAGES ARISING OUT OF THE USE OF THE

LICENSED PROGRAM OR RELATED TO THIS LICENSE.

McWeb Software

Copyright 1995-2001


Scrolling Credits

Description: The Scrolling Credits special effect vertically scrolls your Web page like the credits at the end of a movie.  Only version 4.0 browsers support this special effect.

Required files:  None

Browser Compatibility: IE4, IE5, Netscape 4

The Scrolling Credits dialog box is shown below:

Simply enter the following properties for this special effect:

Length of Web page:  Specify the vertical length of your Web page.  This is a number that directly relates to the vertical length of your Web page.  It determines when the scrolling will stop and then repeat from the top of the Web page.  Begin by specifying the default length of 1000.  Test this special effect and determine if you need to increase or decrease the number.

Scrolling speed:  Specify the scrolling speed of this effect.  This determines how fast the page scrolls vertically.

When you have completed setting the special effect’s properties, click the ‘OK’ button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Typewriter Text

Description: The Typewriter Text special effect allows you to display text on a Web page and animate it as if it were being typed on a typewriter.

Required files:  Typewriter4.class and AppletSettings.class

Browser Compatibility: IE3, IE4, IE5, Netscape2 through 4

The Typewriter Text dialog box is shown below:

The following are the property settings for the Typewriter Text effect:

Typewriter Text:  Type the text you wish to be displayed (animated) on your Web page.  If you wish to use a text file to supply the text, click the checkbox marked “or click here to read text from a file” and specify the text file in the text box provided.

Click the ‘Next’ button to proceed to Step 2 (Text Properties).  The following screen will be displayed:

Set the Text Properties of the effect with the following settings:

Font:  Select a font (Arial, Dialog, Courier, Helvetica or TimesRoman) from the dropdown menu.

Font Size (points):  Specify the font size in points.  The default is 12.

Text Color:  Specify the text color by clicking the ‘Click to Select Color’ button.  A color picking dialog box will appear allowing you to select a color from the palette.

Bold:  Check the checkbox to specify a boldface font.

Italic: Check the checkbox to specify an italicized font.

Click the ‘Next’ button to proceed to Step 3 (Special Effect Properties).  The following screen will be displayed:

Set the Special Effect Properties of the effect with the following settings:

Width and Height (pixels):  Specify the width and height of the special effect in pixels.

Web page URL to link to:  Specify the URL of the Web page you want the Typewriter Text effect to link to when the user clicks on it.

Background Image:  Click the ‘Browse’ button to select an image that you want as the background image of the Typewriter Text effect.

Background Color:  Specify the background color of the Typewriter Text effectby clicking the 'Click to Select Color' button.  A color picking dialog box will appear allowing you to select a color from the palette.

Loop the animation:  Specify the number of times you want the Typewriter animation to repeat itself.

Typing speed:  Specify the typing speed.  The typing speed defaults to a value of 100.  The lower the number, the faster the typing.  So, a value of 25 would result in fast typing while a value of 2000 would result in a very slow typing speed.

When you have completed setting the special effect’s properties, click the 'Done' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.

Special thanks to Eric Harshbarger and the Catalyst New Media Marketing lab for letting McWeb Software include their Java applets in J-Perk!


Text Effects

Description: The Text Effects offers two special effects that can be applied to text of your choice:

Text Grow:  The specified text grows from a very small font size to a large size, or vice versa.

Text Stretch:  The text appears to be stretched out like a rubber band.

Required files:  None

Browser Compatibility: IE4, IE5

The Text Effects dialog box is shown below:

The following are the property settings for the Text Effects:

Text:  Type in the text you wish to apply the effect to on your Web page.

Text Effect:  Select the effect you wish to apply to the text (either Grow Text or Stretch Text).

For Grow Text:

Starting Text size: This is the font size of the text before the Grow effect is applied. Values CAN NOT be negative numbers.

Ending Text size:  This is the font size of the text after the Grow effect is applied. Values CAN NOT be negative numbers.

For Stretch Text:

Starting Letter spacing:  This is the spacing between the text characters before the Stretch effect is applied.  Values CAN be negative numbers.

Ending Letter spacing:  This is the spacing between the text characters after the Stretch effect is applied. Values CAN be negative numbers.

Speed:  Specify the speed of the effect.  This setting determines how quickly the effect is applied.

When you have completed setting the special effect’s properties, click the 'OK' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Text Transitions
Text Transition effects

Description: The Text Transition effects display text on your Web page using different transitions such as:

Box in

Box out

Circle in

Circle out

Wipe up

Wipe down

Wipe right

Wipe left

Vertical blinds

Horizontal blinds

Checkerboard across

Checkerboard down

Random dissolve

Split vertical in

Split vertical out

Split horizontal in

Split horizontal out

Strips left down

Strips left up

Strips right down

Strips right up

Random bars horizontal

Random bars vertical

Random

Required files:  None

Browser Compatibility: IE4, IE5

The Text Transitions dialog box is shown below:

Add text items to the list by clicking on the “Add…” button.

To edit the text in a particular list item, select the list item and click on the “Edit…” button or double-click the list item.

If you wish to change the order of the list items use the Move up, Move down, and Delete buttons.

The following are the property settings for the Text Transition effects:

Text:  Type in the text you wish to apply the effect to on your Web page.

Text Transition:  Select the transition effect you wish to apply to the text.

Duration:  Specify the duration of the effect in seconds.  This setting determines how quickly the effect is applied to the text.

Play the Transition…:  By default, the transition occurs when the Web page is first loaded.

When you have completed setting the special effect’s properties, click the 'OK' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Web page Transitions
Web page Transition effects

Description: The Web page Transition effects create transitional effects on your Web page when you load or exit your Web page.  The different transitions are:

Box in

Box out

Circle in

Circle out

Wipe up

Wipe down

Wipe right

Wipe left

Vertical blinds

Horizontal blinds

Checkerboard across

Checkerboard down

Random dissolve

Split vertical in

Split vertical out

Split horizontal in

Split horizontal out

Strips left down

Strips left up

Strips right down

Strips right up

Random bars horizontal

Random bars vertical

Random

Required files:  None

Browser Compatibility: IE4, IE5

The Web Page Transition Effects dialog box is shown below:

The following are the property settings for the Web page Transition effects:

Transition:  Select the transition effect you wish to apply to your Web page.

Duration:  Specify the duration of the transition effect in seconds.  This setting determines how quickly the effect is applied to the Web page.

Play the Transition…:

When the user enters the Web page:  The transition occurs when the Web page is first loaded.

When the user exits the Web page:  The transition occurs when the Web page is exited.

When you have completed setting the special effect’s properties, click the 'OK' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


PopUp Window

Description: The PopUp Window opens another browser window when the user clicks a hyperlink or image or when the user enters/exits the Web page.

Required files:  None

Browser Compatibility: IE3, IE4, IE5, Netscape 3 and 4

The PopUp Window dialog box is shown below:

The following are the property settings for the PopUp Window:

I want the PopUp Window to appear:  Select the action that will cause the PopUp Window to open.  Choose from the following actions:

- when the Web page is loaded

- when the Web page is exited

- when the user clicks on a hyperlink

- when the user clicks on an image

Link Settings:  Specify the hypertext or image filename if you have chosen to open the PopUp Window when the user clicks a hyperlink or image.  You can use the browse button to search your computer’s hard drive for images.

Clicking the ‘Next’ button displays the following screen:

PopUp Window name:  Type the name of the PopUp Window.  You can later refer to the PopUp Window by this name if you need to change it’s contents or close it.

Web page URL or image to display in PopUp window:  Specify the Web page URL or filename or the image filename that you wish to be displayed in the PopUp Window when it opens.  This can be a local URL or a remote (http://…) URL address.  You can click the browse button to search your computer’s hard drive for Web pages or images.

PopUp window width (pixels):  Specify the width of the PopUp Window in pixels.

PopUp window height (pixels):  Specify the height of the PopUp Window in pixels.

Horizontal screen location:  Specify the distance (in pixels) from the left side of the screen where you want the PopUp Window to appear.

Vertical screen location:  Specify the distance (in pixels) from the top of the screen where you want the PopUp Window to appear.

Other PopUp Window properties

Show browser Toolbar:  Selecting this box will force the PopUp Window to display the standard browser toolbar at the top of the browser window.

Show browser StatusBar:  Selecting this box will force the PopUp Window to display the standard browser status bar at the bottom of the browser window.

Show browser Location box:  Selecting this box will force the PopUp Window to display the standard browser URL Location bar at the top of the browser window.

Show browser Menu bar:  Selecting this box will force the PopUp Window to display the standard browser menu bar at the top of the browser window.

Show browser Directory buttons: Selecting this box will force the PopUp Window to display the standard browser directory buttons at the top of the browser window.

Show browser Scrollbars: Selecting this box will force the PopUp Window to display scrollbars in the browser window.

Make browser window resizable:  Selecting this box will force the PopUp Window to be resizable so users can change the size of the window.

When you have completed setting the special effect’s properties, click the 'OK' button.

The Preview Wizard will appear and allow you to preview your special effect and insert it into your Web page.  Click here for Preview Wizard instructions.

Check Troubleshooting if your special effect doesn't work.


Troubleshooting

Frequently asked questions and technical support can also be found at:

http://www.mcwebsoftware.com/j-perk/jpfaq.asp

INSERTING J-PERK’S SPECIAL EFFECTS INTO WEB PAGE EDITORS

Click the links below to find out how to insert special effects into your Web page editor.

Frontpage

FrontpageExpress

Netscape Composer

Microsoft Publisher 98

NetObjects Fusion

AOLPress

Yahoo/Geocities PageBuilder

DreamWeaver

Why doesn't the special effect seem to be working?

1.  First, be sure that the class files are named correctly in the J-Perk folder. You MUST use a 32-bit version of WinZip to unzip the zip file containing the class files. If you use a 16-bit version or the DOS version of PKUNZIP to unzip the class zip file, then the SPECIAL EFFECTS WILL NOT WORK.

Also, the Java class files must be spelled exactly as they are shown below (make sure they are spelled exactly as they are shown here. Case-sensitivity is important.)

Animate1.class

AudioLoader3.class

ButtonPLUS3.class

ColorSwirl.class

DetachFrame.class

ImageFade2ech.class

Lake.class

Pixelator3.class

ripple.class

TmapCube.class

TmapCubeb.class

Typewriter9.class

2.  It is imperative that you put:

·	all the images,

·	the required Java class file(s) and

·	the HTML document containing the special effect HTML code

in the same folder in order for your special effect to work correctly.

Make sure the required Java class files are located in the same folder as the images and HTML document and make sure they are spelled correctly.

When you create an special effect with J-Perk it tells you which Java class files are required in order to make that particular special effect work correctly. These Java class files are located in the J-Perk folder and have the file extension ".class". These files are also case-sensitive, so Java class filenames containing uppercase letters and lowercase letters should not be renamed. They must remain exactly as they are named. For example, the Animate1.class file MUST appear exactly as it is shown. If it is renamed to animate1.class it WILL NOT WORK.

Also, some of the special effects have required parameter lines in the special effect HTML code that J-Perk creates. Do not delete these parameters because the special effects will not work without them. For example, the animation special effect has a parameter named COPYRIGHT (<PARAM NAME=COPYRIGHT VALUE=...>) which is required for it to work.

3.  Other special effects have certain requirements for them to work correctly.

·	The Image Cube special effect must use a 256x256 pixel image, otherwise it will not work.

·	The images used in the Image Fade special effect MUST be exactly the same pixel size. If one image is 100x100 pixels then the other must also be 100x100 pixels.

The best way to troubleshoot your special effect is to preview the examples that come with J-Perk and see if they work with your browser. If they do, then compare the example HTML code with the code in the special effect that you are creating.

When uploading your special effect to the Web (to your Web space) upload the images and Java class files as BINARY format, and upload the HTML document as ASCII format. This is extremely important. If you upload the Java class files in ASCII format they WILL NOT WORK.

Why doesn't the animation work?  I don't see any pictures.

You may be viewing the animation using Internet Explorer 3.02.  Microsoft has prevented the loading of files/images from the local hard drive for security reasons.  Simply download and install Internet Explorer 4.0 or Netscape Navigator 4.0.

Or you can download the bug fix (updated Java virtual machine) from Microsoft's site to correct this problem.  Go to http://www.microsoft.com/java and select the 'Java VM Update' hyperlink which will take you to the update download page.  Download the appropriate Build of the Java VM (Build 1518 for Windows 95 as of 6/16/97).  This will correct the problems.

Otherwise, if you wish to view the animation locally from your hard drive then you must use Netscape Navigator or another browser (IE prior to version 3.02).  You can use Internet Explorer 3.02 if you upload the animation to a Web server and view it from the Web.

2)  You may have put the files in a folder which has a long filename with spaces in it (like c:\J-Perk\special effects).  The animator special effect doesn't understand the space between the words 'special' and 'effects'.

Solution:  Put your HTML, image and sound files in a folder which doesn't have any spaces in it's name (like c:\animations\files).

3)  You may have put your Web page containing the special effect HTML code in one folder and your image files in a separate folder.

Solution:  This is OK as long as you specify folder names while creating the special effect HTML code in J-Perk.

The easy way to make your animations work is:  Be sure that you have the following things in the same folder:

     the HTML document (Web page) containing the animation HTML code (which is created by J-Perk)

     the Animate1.class and CoolTool3.class files

     the images and sound files .

The default is for the HTML document (that has the special effect HTML code embedded in it) to be in the same folder as the images and sounds which are used by the animation (no image or sound folders need to be specified in this case).  If these files are all in the same folder, then you should not specify any folder names during creation of the special effect in J-Perk (specifying folder names in this case will result in errors).

4)  Putting the images and sound files in different folders than the Animate1.class and CoolTool3.class files and the HTML file with the special effect HTML code can be done, but it involves specification of these folders.  For example, if you have the HTML document in a folder such as C:\WEBPAGE, you have the images in a folder C:\WEBPAGE\IMAGES and the sounds in the folder C:\WEBPAGE\SOUNDS, then you must specify these folders in J-Perk.  The folders that you specify should be specified relative to the location of the HTML document containing the animation special effect.  You can specify the entire folders, but this may be inconvenient if you have to move your Web pages to another site or from your local hard disk to disk space on an Internet Service Provider's server.

As recommended, specify the folders relative to the folder which contains the Animate1.class, CoolTool3.class and HTML files.  Continuing our example, specify the image folder to be IMAGES/ and the sound folder to be SOUNDS/.

Why do my images not look clear in the animation?  Why are they pixelated or have strange colors?

The use of GIF images which have transparent background colors set will show the background colors of the HTML web page in which the special effect is embedded.  Also, Netscape seems to have trouble with GIF images in these animations.  Sometimes they appear pixelated (not perfectly clear).

It is best to use JPEG images in your animations.  They are usually smaller in file size and you won't have problems with transparency settings as you do with GIFs.

Also, older versions of Netscape Navigator seem to have a 256 color palette when they display Java applets.  This may dither or pixelate your images if they have more than 256 colors.

Why doesn't the Screen Color Fade-in/Fade-out special effect work?

You may have specified a very fast speed.  This will result in the fade occurring at a speed which is 'faster than the human eye'.

Solution: Slow it down.

If you set the different colors on a computer with a 24 bit (16.7 million) color setting and you view it on a computer which has 8 bit (256 color) setting then you may not see a fade because the two colors may have been to similar.  On a 256 color machine these colors will be converted to the nearest color in the 256 color palette, and if these colors were similar then they may have been converted to the same color (resulting in no fading).

Solution:  Choose colors from the 256 color palette.

Why is J-Perk's Preview Wizard unable to copy the necessary files to my specified folder?

If J-Perk has trouble finding the required files it will alert you and provide a 'Copy From' file list so that you can manually find the files on your hard drive and copy them to the specified folder.  One reason why J-Perk might not be able to find the required files (such as an image) is that when originally creating your special effect you might have manually typed a filename into an input box instead of using a 'Browse' button to select the file.  When you manually type the filename into an input box, J-Perk has no idea where to look for that file.  ut when you use the 'Browse' buttons to select the files (images, sounds) J-Perk remembers which folder you selected the files from and will use that information to correctly copy those files in STEP 3 of the Preview Wizard.


Microsoft FrontPage Support- inserting special effects
FrontPage Support

How do I use Microsoft FrontPage with J-Perk?

You can use J-Perk’s Auto-Insert feature to automatically insert your special effect into your Web page.

OR…

To manually insert the special effect into your Web page:

1. Create a special effect with J-Perk.

2. When you've completed your special effect, J-Perk's Preview Wizard will appear and allow you to preview your special effect in your Web browser (Step 1 of the Preview wizard).  Once the preview is to your liking, move on to Step 2 of the Preview wizard.

3. Choose “Manual Copy” in the Preview Wizard and move to the next step.

4. Open FrontPage Explorer and open the web page that you want to insert the special effect into.  The FrontPage Editor will appear.  Place the cursor where you want to insert the J-Perk special effect.

5. Click on the HTML tab at the bottom of the FrontPage Editor and the Web page HTML code will be displayed.

6. Depending on the special effect that you have created you may have to insert HTML code in three(3) different locations in the FrontPage Editor. J-Perk’s Preview Wizard explains which locations you will need to insert the code into.  Let’s discuss these locations now:

“Paste the script code into the HEAD section of your HTML document” - The HEAD section is usually located at the top of the HTML code and is surrounded by the <HEAD> and </HEAD> HTML tags. Paste the given J-Perk code between the <HEAD> and </HEAD> tags.

“Paste the body HTML code into the BODY section of your HTML document” - The BODY section is located after the HEAD section in the HTML code and is surrounded by the <BODY> and </BODY> HTML tags. Paste the given HTML code between the <BODY> and </BODY> tags in the location where you want the special effect to appear.  (For this particular code insertion you may want to go into FrontPage Preview mode, place your cursor in the location where you want the special effect to appear and then go back into the FrontPage HTML view to paste the code.)

“Paste the code into the <BODY> tag of your HTML document” - For example, J-Perk will give you the following code to paste into the <BODY> tag:

onLoad="playEnterSound()"

You must find the existing <BODY> tag in the HTML code in the FrontPage Editor and insert the code within the < and > brackets as shown below:

<BODY onLoad="playEnterSound()">

7. Switch back to J-Perk and move on to the next step (“Publish Required files to Local Hard Drive”) in the Preview Wizard.  Using the folder list on the Publish step of the Wizard, copy the required special effect files (if any) locally to a folder on your computer's hard drive.

8. Switch back to FrontPage Explorer.  Click on the File | Import... menu item and then click the Add File... button.  FrontPage will display a dialog box that allows you to select files or folders.  In this dialog box open the folder that contains the required special effect files that you copied in J-Perk (in item 6 of these instructions) and select the required special effect files. Click OK. This will copy the entire J-Perk special effect into the FrontPage Web site (web).

9. Save your Web page in FrontPage Editor and then click the Preview tab located along the bottom of the FrontPage Editor. After a few seconds the special effect will be displayed.

You must now upload the Web page and special effect required files to the Web.


Microsoft Publisher 98 Support

How do I use Microsoft Publisher 98 with J-Perk?

You can use J-Perk’s Auto-Insert feature to automatically insert your special effect into your Web page.

OR…

To manually insert the special effect into your Web page:

To include a J-Perk special effect in Publisher, simply create the special effect in J-Perk and move to Step 2 of J-Perk's Preview Wizard.

The HTML code that J-Perk generates for the special effect must be pasted into your Publisher Web page.

1.  Open your Web page in Publisher. On the Insert menu, click 'HTML Code Fragment'.

2.  Click the place on your Web page where you want the HTML code fragment to appear. The HTML Code Fragment Properties dialog box appears.

3.  In the HTML Code Fragment box, paste the J-Perk generated HTML code fragment by pasting it in.

4.  Click OK.

The code fragment appears as code in the frame on your Web page.

If your J-Perk special effect requires other files to be included (such as images, sound files, Java class files, etc) then it makes it a little more difficult. You can't simply preview your Web page in Publisher because Publisher creates a temporary folder on your hard drive, copies all the Web page entities (HTML file, images, etc.) to that temporary folder and previews it. Publisher doesn't know about the files the J-Perk special effect requires so it doesn't copy them to the temporary folder for previewing. Previewing the Web page in Publisher won't display the special effect properly.

Here's what you can do...

Save the Web page in Publisher to a specific folder (I believe the command is "Save as HTML" from the File menu) and in J-Perk copy all the required files to that same folder (Step 3 of Preview Wizard). Then preview the Web page in your Web browser (not in Publisher).

When you finally publish your Web page/site in Publisher, you will need to manually publish/copy the required J-Perk files to the same location (folder/Web server).

You must now upload the Web page and special effect required files to the Web.


NetObjects Fusion Support

How do I use NetObjects Fusion with J-Perk?

You can use J-Perk’s Auto-Insert feature to automatically insert your special effect into your Web page.

OR…

To manually insert the special effect into your Web page:

1.  To include a J-Perk special effect in Fusion, simply create the special effect in J-Perk and copy the required files to a folder on your hard drive using the J-Perk Preview Wizard.

2.  Then go to Fusion and place your cursor in the location where you want to insert the special effect.

3.  Click the "External HTML" button at the bottom of the Fusion toolbar and find the "jptemp.html" file in the folder where you copied the J-Perk files.

4.  Insert this HTML file and then publish your page.

5.  You must now upload the Web page and special effect required files to the Web.


Yahoo/Geocities PageBuilder Support

How do I use Yahoo/Geocities PageBuilder with J-Perk?

To include a J-Perk special effect in Yahoo/Geocities PageBuilder, simply create the special effect in J-Perk  and use J-Perk’s Preview Wizard.

Inserting the special effect into an existing Web page

You must choose “Manual Copy” in J-Perk’s Preview Wizard in order to correctly insert your special effect into an existing Web page.  You must perform the following steps for each section of code that is required for your special effect (HEAD code, BODY section code, BODY tag code).

1.  In PageBuilder, click on the "Add-ons" button on the toolbar.

2.  When the pop-up window appears, click on "Forms and Scripts" from the left-hand frame.

3.  Click on "HTML Code."

4.  When the pop-up window appears, enter the following:

Description: Enter a description of your HTML code. This will show up as a yellow or blue box on your page while editing in PageBuilder. What you type here is just for your own reference so you know what the box is for.

Script: Enter your HTML code. You can copy and paste HTML code here by using the keyboard shortcuts Ctrl-C for copy and Ctrl-V for paste.

5.  Click "OK."

6.  Once you have completed inserting the special effect code into PageBuilder, you must publish the special effect required files to a folder on your hard drive using the J-Perk Preview Wizard.

7.  You must now upload the special effect required files to your Yahoo/Geocities Web space.

Creating a new Web page with your special effect

If you wish to create a new Web page and upload it to your Yahoo/Geocities Web space follow these steps:

1.  Create your special effect in J-Perk.

2.  In J-Perk’s Preview Wizard, select the “Create a New Web Page” option.

3.  On the next screen, click the “Save As new Web page” button and specify a folder and filename for your Web page.  J-Perk will save the new Web page and all the required files to the specified folder.

4.  You must now upload the Web page and special effect required files to your Yahoo/Geocities Web space.


DreamWeaver Support

How do I use Macromedia DreamWeaver with J-Perk?

You can use J-Perk’s Auto-Insert feature to automatically insert your special effect into your Web page.

OR…

To manually insert a J-Perk special effect in DreamWeaver, follow these steps:

1.  Create the special effect in J-Perk and preview the effect in J-Perk’s Preview Wizard.

2.  In J-Perk’s Preview Wizard, click the “Next” button until you see the screen labeled “ Select Method for Inserting your Special Effect”.

3.  Select the option labeled “Manual copy” and click the “Next” button.

4.  Open your Web page in DreamWeaver and select Code from the View menu.  The HTML code of your Web page will be displayed.

5.  In J-Perk, follow the Preview Wizards instructions for copying and pasting the J-Perk code into your Web page.  Depending on the special effect that you have created you may have to insert J-Perk code in three(3) different locations in your Web page.  Let’s discuss these locations now:

“Paste the script code into the HEAD section of your HTML document” - The HEAD section is usually located at the top of the HTML code and is surrounded by the <HEAD> and </HEAD> HTML tags.  Paste the given J-Perk code between the <HEAD> and </HEAD> tags.

“Paste the body HTML code into the BODY section of your HTML document” - The BODY section is located after the HEAD section in the HTML code and is surrounded by the <BODY> and </BODY> HTML tags. Paste the given HTML code between the <BODY> and </BODY> tags in the location where you want the special effect to appear.  (For this particular code insertion you may want to go into DreamWeaver Design view, place your cursor in the location where you want the special effect to appear and then go back into the DreamWeaver Code view to paste the code.)

“Paste the code into the <BODY> tag of your HTML document” - For example, J-Perk will give you the following code to paste into the <BODY> tag:

onLoad="playEnterSound()”

You must find the existing <BODY> tag in the HTML code in DreamWeaver and insert this code within the < and > brackets as shown below:

<BODY onLoad="playEnterSound()">

6.  In J-Perk’s Preview Wizard, click the “Next” button.  If the special effect requires other files in order to work correctly, the “ Publish Required Files to local hard drive”screen will appear.  Follow the instructions on that screen to copy the required files to a folder on your hard drive.  The files should be copied to the same folder that contains your Web page.

7.  You must now upload the Web page and special effect required files to the Web.


Netscape Composer Support

How do I use NetScape Composer with J-Perk?

You can use J-Perk’s Auto-Insert feature to automatically insert your special effect into your Web page.

OR…

To manually insert the special effect into your Web page:

There really is no easy way to add special effects to Netscape Composer.  Netscape has made this quite difficult.

1.  To include a J-Perk special effect in Composer, create your special effect in J-Perk, preview it and then move on to Step 2 of J-Perk’s Preview Wizard.

2.  In Composer, open your Web page and select the Edit/HTML Source menu item.  Composer will ask you which application you wish to use as your HTML editor.  You can choose any text-based HTML editor or select Windows Notepad (as a simple text editor).

3.  Using the HTML/text editor that you have chosen, insert the J-Perk HTML code into the appropriate areas of the Web page and then save the Web page.

4.  Refresh or re-open the Web page in Composer and preview it.

5.  You must now upload the Web page and special effect required files to the Web.


FrontPage Express Support

How do I use FrontPage Express with J-Perk?

You can use J-Perk’s Auto-Insert feature to automatically insert your special effect into your Web page.

OR…

To manually insert the special effect into your Web page:

1.	Create a special effect with J-Perk.  In step 2 of J-Perk’s Preview wizard, copy the special effect HTML code by clicking the copy button.

2.	Open FrontPage Express and open the web page that you want to insert the special effect into.  Place the cursor where you want to insert the J-Perk special effect.

3.	Click the Insert/HTML Markup menu item in FrontPage Express and a dialog box containing a text box will appear.  Paste the special effect HTML code into the text box and click OK.

4.	Switch back to J-Perk and move on to Step 3 in the Preview Wizard.  Using the folder list in Step 3 of the Wizard, copy the required special effect files (if any) to the same folder that contains your Web page (the Web page you are currently editing in FrontPage Express).

5.	Save your Web page in FrontPage Express and click the Preview button to preview your Web page in a browser.

6.	You must now upload the Web page and special effect required files to the Web.


AOLPress Support

How do I use AOLPress with J-Perk?

You can use J-Perk’s Auto-Insert feature to automatically insert your special effect into your Web page.

OR…

To manually insert the special effect into your Web page:

Create the special effect in J-Perk and move to Step 2 of J-Perk's Preview Wizard.

The HTML code that J-Perk generates for the special effect must be pasted into your AOLPress Web page.

1.	Open your Web page in AOLPress and place your cursor where you want the special effect to appear.

2.	Select the "Show HTML" menu item from the Tools menu in AOLPress. The HTML code of your Web page will appear.

3.	Depending on which special effect you have created, insert the special effect HTML code that J-Perk created for you. If the special effect requires copying and pasting more than one section of HTML code then follow the J-Perk instructions to paste each section of code into the appropriate location in your Web page HTML code.

4.	Close the HTML view window in AOLPress and save your Web page.

5.	Using J-Perk, copy the special effect's required files (class files, images, sounds, etc. if any) to the folder on your computer's hard drive that contains your Web page.

6.	You must now upload the Web page and special effect required files to the Web.

The special effect will not be displayed in the AOLPress editor. AOLPress is unable to display Java and JavaScript effects. You must preview your Web page in a Web browser in order to see the special effects.


FrontPage Express Support for JavaScript
FrontPage Express Support - JavaScript special effects

How do I use FrontPage Express with J-Perk?

You can use J-Perk’s Auto-Insert feature to automatically insert your special effect into your Web page.

OR…

To manually insert the special effect into your Web page:

1.	Create a special effect with J-Perk.

2.	Open FrontPage Express and open the web page you want to insert the special effect into.

3.	Select the View/HTML menu item from FrontPage Express and a dialog box will appear displaying the HTML code of your Web page.

4.	Depending on the special effect that you have created you may have to insert HTML code in three(3) different locations in this box.  Step 2 of J-Perk’s Preview Wizard explains which locations you will need to insert the code into.  Let’s discuss these locations now:

“Paste the script code into the HEAD section of your HTML document” - The HEAD section is usually located at the top of the HTML code and is surrounded by the <HEAD> and </HEAD> HTML tags. Paste the given J-Perk code between the <HEAD> and </HEAD> tags.

“Paste the body HTML code into the BODY section of your HTML document” - The BODY section is located after the HEAD section in the HTML code and is surrounded by the <BODY> and </BODY> HTML tags. Paste the given HTML code between the <BODY> and </BODY> tags in the location where you want the special effect to appear.  (For this particular code insertion you may want to go into FrontPage Preview mode, place your cursor in the location where you want the special effect to appear and then go back into the FrontPage HTML view to paste the code.)

“Paste the code into the <BODY> tag of your HTML document” - For example, J-Perk will give you the following code to paste into the <BODY> tag:

onLoad="playEnterSound()"

You must find the existing <BODY> tag in the HTML code in the FrontPage Editor and insert the code within the < and > brackets as shown below:

<BODY onLoad="playEnterSound()">

5.	Switch back to J-Perk and move on to Step 3 in the Preview Wizard.  Using the folder list in Step 3 of the Wizard, copy the required special effect files (if any) to the same folder that contains your Web page (the Web page you are currently editing in FrontPage Express).

6.	Save your Web page in FrontPage Express and click the Preview button to preview your Web page in a browser.

7.	You must now upload the Web page and special effect required files to the Web.


Preview Wizard

PREVIEWING YOUR SPECIAL EFFECT

Once you've finished setting all the properties of your special effect, you are ready to preview it and put it into your Web page.  The Preview Wizard is the next step in this process.

There are a few things you should note about the Preview Wizard window:

There is a Preview button that will load your special effect in a Web browser of your choice so that you can preview it.  If you are using the Internet Explorer version of J-Perk you can preview the special effect directly in Step 1 of the Preview Wizard.

Click on the Preview button to preview your special effect in a Web browser (if you are using the Internet Explorer version of J-Perk you can preview the special effect directly in the Preview Wizard).  The browser should automatically load and display your special effect when you click this button.  (If your special effect did not preview properly or you encountered problems while previewing, refer to the Troubleshooting guide)

Also, at the bottom of the Preview Wizard window are the navigational buttons, '<<Previous' and 'Next>>'.  Use these to move from step to step within the Preview Wizard.

Once you preview your special effect you can choose to go back and edit it by clicking on the ‘<<Previous’ button or you can click the ‘Next>>’ button and move on to the next step >>


Preview Wizard: Selecting your Web page editor
Preview Wizard

SELECTING YOUR WEB PAGE EDITOR

J-Perk allows you to specify which Web page editor you use to create your Web pages.  J-Perk can then tailor the Preview Wizard to your Web page editor and offer specific help based on which editor you choose.

Select your editor from the list of available choices shown in the figure below:

Move on to the next step >>


Preview Wizard: Inserting the Special Effect into your Web page
Preview Wizard

INSERTING THE SPECIAL EFFECT IN YOUR WEB PAGE

J-Perk gives you a choice of how you wish to insert the Special Effect into your Web page.   The three choices are explained below:

Three choices:

Auto-insert

J-Perk can auto-insert your special effect into an existing Web page and copy all the required special effect files to the folder where your Web page resides.  J-Perk will insert the special effect code snippets into the correct sections of your Web page.  After the code is inserted, you may need to move the special effect’s location on your Web page by using your Web page editor.

Manual Copy

J-Perk will take you through the step-by-step process of manually copying the special effect code into your Web page.  This is safer than auto-inserting the special effect because you have more control over where the special effect code is placed.

Create new web page

J-Perk can also create a new Web page that contains your special effect.  You can specify the location and filename of the Web page you want J-Perk to create.


Preview Wizard: Auto-insert the Special Effect into your Web page
Preview Wizard

AUTO-INSERT INTO YOUR WEB PAGE

J-Perk will auto-insert the special effect code into an existing Web page and will copy the required special effect files into the folder where the Web page resides.

The Auto-Insert screen is shown in the figure below:

Follow these steps to auto-insert the special effect into your Web page:

1.  Using the “Browse” button, find the Web page that you wish to auto-insert the special effect into.

2. Be sure to close your Web page if it is open in any other application, such as your Web page editor.

3. Click the “AutoInsert your Special Effect” button to insert the code and copy the required files.  The special effect code will be inserted into your Web page and the required special effect files will be copied to the folder where your Web page resides.

J-Perk will make a backup copy of your Web page before it auto-inserts the code into it.  The backup file will be the same name as your Web page, but it will be preceded by “Backup of”.  For example, if your Web page filename is “MyPage.html” the backup file will be named “Backup of MyPage.html”

Move on to the next step >>


Preview Wizard: Manually Copy the Special Effect into your Web page
Preview Wizard

MANUALLY COPY INTO YOUR WEB PAGE

J-Perk allows you to manually insert the special effect code into your Web pages as well as manually publish the special effect required files.

There can be up to 4 steps for manually inserting your special effect:

1. Insert special effect code into the HEAD section of your Web page

2. Insert special effect code into the BODY section of your Web page

3. Insert special effect code into the BODY tag of your Web page

4. Publish special effect required files to a folder on your local hard drive

These steps are discussed in more detail below.

Insert special effect code into the HEAD section of your Web page

If the particular special effect you are creating requires you to insert code into the HEAD section of your Web page, the following screen will appear:

To manually copy the HEAD code you must click the “Copy” button (as shown in the image above).  The code in the text box on the J-Perk screen will be highlighted and copied to the Windows Clipboard.

You must now open your Web page in your Web page editor and find the HEAD section of the HTML code.  The HEAD section begins with the following HTML tag:

<HEAD>

and ends with:

</HEAD>

Paste the code from J-Perk into this section of your Web page (anywhere between the <HEAD> tag and the </HEAD> tag) by clicking the Paste button or by selecting Edit/Paste from your Web page editor's main menu.

Once you have pasted the copied code, you can move on to the next step by clicking the “Next >>” button.

Insert special effect code into the BODY section of your Web page

If the particular special effect you are creating requires you to insert code into the BODY section of your Web page, the following screen will appear:

To manually copy the BODY code you must click the “Copy” button (as shown in the image above).  The code in the text box on the J-Perk screen will be highlighted and copied to the Windows Clipboard.

You must now open your Web page in your Web page editor and find the BODY section of the HTML code.  The BODY section begins with the following HTML tag:

<BODY>

and ends with:

</BODY>

Place your cursor in the location where you want the special effect to appear.  Paste the code from J-Perk into this section of your Web page (anywhere between the <BODY> tag and the </BODY> tag) by clicking the Paste button or by selecting Edit/Paste from your Web page editor's main menu.  The location of the pasted code is important in the BODY section because it determines where the special effect will be displayed on your Web page.  Once you have pasted the copied code, you can move on to the next step by clicking the “Next >>” button.

Insert special effect code into the BODY tag of your Web page

If the particular special effect you are creating requires you to insert code into the BODY “tag” of your Web page, the following screen will appear:

To manually copy the BODY code you must click the “Copy” button (as shown in the image above).  The code in the text box on the J-Perk screen will be highlighted and copied to the Windows Clipboard.

You must now open your Web page in your Web page editor and find the BODY tag of the HTML code.  The BODY tag looks like this:

<BODY>

Paste the code from J-Perk into the BODY tag (between the opening bracket “<” and the closing bracket “>”) by clicking the Paste button or by selecting Edit/Paste from your Web page editor's main menu.  For example, if the J-Perk BODY tag code is the following:

onload=”helloFunction(param1, param2)”

you should paste it inside the <BODY> tag like this:

<BODY onload=”helloFunction(param1, param2)”>

Once you have pasted the copied code, you can move on to the next step by clicking the “Next >>” button.

Move on to the next step >>


Preview Wizard: Creating a new Web page for your Special Effect
Preview Wizard

CREATE A NEW WEB PAGE FOR THE SPECIAL EFFECT

J-Perk will create a new Web page for the special effect and will copy the required special effect files into the folder where the Web page is stored.

The “Create new Web page” screen is shown in the figure below:

Click the “Save as new Web page” button on this screen and a dialog box will appear requesting the filename of the Web page you wish to create.  Specify a filename and folder location and click “OK”.  J-Perk will create the Web page with the special effect and will publish all the required files to the same folder where the Web page is stored.

Move on to the next step >>


Preview Wizard: Publishing Required files for your Special Effect
Preview Wizard

PUBLISHING REQUIRED FILES TO LOCAL HARD DRIVE

If the special effect requires files (images, sounds, Java class files, etc) in order to work correctly, the following screen will appear:

Using the Folder list on this screen, browse to the folder where you want to publish the required special effect files.  This folder is the same folder that contains your Web page with the special effect.  The specified folder should contain the Web page with the J-Perk special effect HTML code (the Web page that contains the J-Perk special effect code).  THE REQUIRED FILES MUST RESIDE IN THE SAME FOLDER AS THE WEB PAGE THAT CONTAINS THE HTML CODE FOR CONTROLLING YOUR SPECIAL EFFECT!

Be sure to double-click on the desired folder to select it.  You can also click on the 'Create New Folder' button to create a new folder.

Once you have browsed to the desired folder, click the “Publish” button and your files will be copied to the specified folder.

IF J-PERK HAS DIFFICULTY FINDING THE REQUIRED FILES

If J-Perk has trouble finding the required files it will alert you and provide a 'Copy From' file list (on the left side of the Preview Wizard window) to enable you to manually find the files on your hard drive and copy them to the specified folder.

J-Perk might not be able to find the required files (such as an image) because when originally creating your special effect you might have manually typed a filename into an input box instead of using the 'Browse' button to select the file.  When you manually type the filename into an input box, J-Perk doesn't know which folder the file is located in. When you use the 'Browse' buttons to select the files (images, sounds) J-Perk remembers which folder you selected the files from and will use that information to correctly copy those files.

To manually copy the required files:

     Search for the required image and sound files that your special effect uses in the file list on the left side of the Preview Wizard window.  Select them and click the 'Copy' button to copy them to the selected folder on the right side of the Preview Wizard window.

     If J-Perk can't find the required Java class files required by the special effect you must also search for them in the left-hand file list.  These class files are located in the J-Perk folder (where you installed J-Perk).

Once all required files have been copied successfully, click the “Next >>” button to move on to the next step.

Move on to the next step >>


Preview Wizard: Finished inserting your Special Effect
Preview Wizard

FINISHED

Congratulations!  You have finished creating, previewing, inserting and publishing your special effect!  The following screen indicates that you have completed the necessary steps for your J-Perk special effect:

This screen lists the files that are required for your special effect to work correctly.  Use this list of files to transfer/upload these files to your Web server or space on your Internet Service Provider’s Web servers.

If you need help uploading the files to your Web server, click here.


Uploading/Transferrring your special effect to the Web
Uploading/Transferring your Special Effect

Uploading/Transferring you special effect to the Web

You’ve completed your special effect and it looks great, but now you want everyone to see it.  You want to upload your special effect to the Web.  Follow the instructions below.

General Instructions for putting your Special Effect on the Web

To put your special effect on the Web you must do two things:

1.  Upload your Web page that contains the special effect code.

2.  Upload the special effect required files

In order to upload these files to your Web server, you need to use File Transfer software (FTP).  Web page editors such as Microsoft FrontPage have built-in file-transfer tools to publish files to the Web.  If your Web page editor does not have a built-in tool for transferring files, you should use a program called WS_FTP to transfer your files.  You can download it from http://www.ipswitch.com.

To publish files to the Web using an FTP tool like WS_FTP, you must have three pieces of information:

1. The server name of the Web server you are publishing files to.  For example, ftp.geocities.com might be the server name if your Web page was hosted by Geocities.

2. Your username.

3. Your password.

You will need these three items to access your Web server and publish files to it.  The File Publishing software that you use to transfer files will require the information when you are logging in to your Web server.

Once you understand how to transfer files using the publishing tool of your choice, you need to transfer/publish the correct files for your special effect.  Luckily, J-Perk’s Preview Wizard tells you exactly which files are needed for each special effect.  After you have finished creating, previewing and inserting your special effect in the Preview Wizard, J-Perk lists all the required files on the last screen of the Wizard.  Use this list to transfer the required files to your Web server.

If you have tried to transfer the files to the Web and your special effect is not working correctly, read the Troubleshooting section of this helpfile for helpful tips.

Yahoo/Geocities PageBuilder

Go to the Yahoo Geocities main page.  Log in if you aren’t already logged in

In the Advanced Tools section, click on the “Upload & FTP” link.  You will see a screen with an “Easy Upload” section.  For each file that you must upload, click on the “Browse…” buttons and select each file from your hard drive.

When you have selected all the required files, click the “Upload Files” button to upload them all in one click. DO NOT check the checkbox labeled “Automatically convert filenames to lowercase”

When all required files have been transferred, view your Web page to make sure the special effect is working correctly.

Other Web page editors (such as FrontPage and DreamWeaver) have their own built-in publishing tools.  Please refer to their instructions for uploading files to the Web.


Editing existing effects

If you wish to re-edit existing special effects and special effects that you have created in the past, you can do so using the Edit Special Effect window.  A screen shot of this window appears below:

You can access the Edit Special Effect window by selecting Edit | Edit Special Effect from J-Perk's Main screen pull-down menu.

To re-edit a special effect, copy the special effect HTML code from your Web page and insert it into the input text box on the Edit Special Effect window.

     The HTML code must begin with the <APPLET> tag and end with the </APPLET> tag.

After you have inserted the HTML code into the input box click the 'Edit' button to load the wizard which will allow you to re-edit your special effect.  If you are editing an animation, the Edit Special Effect screen will ask you which wizard you wish to use to edit the special effect(Advanced Animation Wizard, Animation wizard or Banner/Billboard wizard).

After the values are loaded into the appropriate wizard, modify the special effect to your liking and click the 'Done' button on the wizard to create the new HTML code.

Problems

Not all special effects are supported by this function.  The Screen Color Fade special effect and the Pull-down menu special effect cannot be re-edited using this function.  You must recreate these special effects or edit them by hand.

If the special effect height and width values are not being loaded into the wizard, it is because the values are not enclosed by quotes in the HTML code.  If you want the special effect height and width values to be loaded into the wizard, enclose them as shown below:

like this:  <APPLET CODE="..." WIDTH="434" HEIGHT="222">

not like this:  <APPLET CODE="..." WIDTH=434 HEIGHT=222>