Tipue Slide, a Sliding Panel Site Search jQuery Plugin

Download for Free
Version 1.0
Tipue Slide is a sliding panel site search jQuery plugin. It's free, open source and fast. Tipue Slide only needs a browser that supports jQuery. It doesn't need MySQL or similar.
Tipue Slide displays a sliding panel with a search box. It uses a simple JavaScript object for content.

Tipue Slide is released under the MIT License. It's free for both commercial and non-commercial use. It doesn't show advertising or branding.

Tipue Slide is easy to use. And we offer a range of flexible support plans, including free.

Tipue Slide has wide browser support. It works with Chrome 49+, Edge 16+, IE11, Firefox 58+, Safari 11+, iOS Safari 10.3+, Chrome for Android 66+, Samsung Internet 4+ and most recent browsers.

Getting Started
Copy the Tipue Slide folder to your site and include the following in the <head> section of your page.
HTML
The first line loads normalize.css, a library that forces browsers to render elements more consistently. This is recommended, but optional. The following line loads jQuery. Then the Tipue Slide content, CSS and jQuery code are loaded.

Add the following directly after the <body> element in your page.

HTML
Call the .tipueslide() method. Add this towards the end of the page.
HTML
Content for Tipue Slide
The search data for Tipue Slide is contained in the tipueslide JavaScript object. Usually this is stored in the tipueslide_content.js file.
JS
Note that the last record doesn't end with a comma. Some characters may need to be escaped, such as " or \. These should be preceded with a backslash.

A JavaScript object has properties. These can be seen as variables attached to the object. Or you can see properties as fields in a database.

The tipueslide object properties
title

The title of the page. This is a required value.

text

Some content of the page. This is a required value.

img

The url of an image that will display in the search result. This can be a full or partial url.

url

The url of the page. This can be a full or partial url, and is also mandatory.

You can store the tipueslide JavaScript object in any file, or even not in a file. The Tipue Slide script just has to have access to the tipueslide object.
Options
The options for Tipue Slide are set as arguments in the .tipueslide() method.
HTML
newTab

The search result opens in a new browser tab if set to true. The default is false.

show

The number of results displayed. The default is 6.

speed

The speed the results display, in milliseconds. The default is 300.

Appearance
The look of Tipue Slide is set entirely via CSS, in tipueslide.css.
More from Tipue

Tipue Search, a jQuery Site Search Plugin

Tipue Search is a site search jQuery plugin. It's free, open source, responsive and fast. Tipue Search only needs a browser that supports jQuery.
More >

A Very Simple CSS Background Zoom

An easy method of creating a CSS background image zoom.

More >