AEBN Pitch Slider

Load source files

Add the tags that load the required Javascript and CSS files. Typically, these tags are placed in the <head> of your HTML page, but they can be placed anywhere as long as they precede the call to the load method of the pitch slider.

NOTE: An alternative is to skip this and all the steps that follow by building your pitch slider on the test page. You can experiment with different options there, and then copy and paste the resulting code into your web page.

Create target element

Add an empty div element where you would like the pitch to appear on the page and give it a unique ID.

To change the default size of the carousel, add a style attribute (with width and height properties) to your div. It's important for the new size to have the same aspect ratio as the original slides, which measure 1280px x 500px. Some good values would be 640 x 250, 1920 x 750, 320 x 125, etc. To make the sales tool responsive, use viewport units. The default size is 40vw x 15vw.

Examples

Default

Fixed

Responsive

This is not supported in IE.

Load the pitch carousel

Add a script tag to your page and call the pitch function:

Where:

divId:: The ID of the target div element. This ID must be unique on the page.
options:: An object listing the settings for the pitch carousel

Both parameters are required.

To ensure your target element is loaded before the pitch function is called, you should wrap it in a window.onload handler (or $(document).ready in jQuery). This is highly recommended, especially for pages with a large amount of content.

Pitch options

Option	Required?	Value	Default Value
orientation	Yes	"straight" or "gay"	None
refid	Yes	Your Ref ID (i.e., 'AEBN-000001')	None
theaterId	Yes	Your Theater ID	None
theaterCname	No	Your Theater Cname	None
intervalSeconds	No	Number of seconds between slides	3
randomOrder	No	Are the slides in random order? (true or false)	true
openNewWindow	No	When clicked, does the slide open a new window? (true or false)	false

Examples

Default:

aebnPitchSlider.load('pitch-slider', {orientation: 'straight', refid: 'AEBN-000001', theaterId: 13992});

Open links in new window:

aebnPitchSlider.load('pitch-slider', {orientation: 'straight', refid: 'AEBN-000001', theaterId: 13992, openNewWindow: true});

No randomization, 5 seconds between slides

aebnPitchSlider.load('pitch-slider', {orientation: 'straight', refid: 'AEBN-000001', theaterId: 13992, randomOrder: false, intervalSeconds: 5});

Errors

Errors will appear in your browser's console.

No valid div element found with ID of <your div ID>: The ID passed into the aebnPitch function was not found. Check for typos or wrap the function call in an onload event handler.
Required parameter options is missing: Please supply a valid options object.
Required parameter options is not an object: Please supply a valid options object.
Required option orientation is missing: Please supply a vaild value for orientation.
Valid values for option orientation are "straight" and "gay": Please supply a vaild value for orientation.
Required option refid is missing: Please supply a vaild value for refid.
Required option theaterId is missing: Please supply a vaild value for theaterId.
Invalid value for option theaterId: theaterId must be a integer value.
Invalid value for option refid: Please supply a vaild value for refid.
Invalid value for option intervalSeconds: intervalSeconds must be a positive number.
Option randomOrder must be true or false: An invalid value was supplied.
Option openNewWindow must be true or false: An invalid value was supplied.
Could not retrieve pitch data: An error occurred while trying to get the pitch data. The server might be down or too busy, or there may be a connection problem. These issues should be temporary.