Glitch Slider — Expressive Transition Effect icon

Glitch Slider — Expressive Transition Effect

Go to Website
Hot or Not
Glitch Slider — Expressive Transition Effect

Description

Installation

1. Include Glitch Slider’s files on your page:

  • js / jquery-3.3.1.min.js (if you don’t have jQuery linked already)
  • js / glitch-slider.js
  • css / glitch-slider.css
<script src="./js/jquery-3.3.1.min.js"></script>
<script src="./js/glitch-slider.js"></script>
<link rel="stylesheet" href="./css/glitch-slider.css">

2. You need to have structure in HTML page like this: 

<div id="glitch-slider">
  <img src="image-3.jpg">
  <img src="image-2.jpg">
  <img src="image-1.jpg">
</div>

Each <img> tag will be slider frame. Use as much <img> tags as you need wrapped into <div> with `glitch-slider` ID.

Settings

The `glitch-slider.js` file has available the following settings at the end of the file:

  • `speed` – time in milliseconds between transitions
  • `buttons` – enable / disable navigation buttons

For the best result use image size the same like `glitch-slider` container size.

TypeJavaScript Script
AuthorEasyTools
CategoryJavascript / Sliders
Price$9
Sales10
PublishedApr 5, 2019
Last UpdateApr 5, 2019
Compatible BrowsersFirefox, Safari, Opera, Chrome, Edge
Compatible SoftwarejQuery
Source Files IncludedJavaScript JS, HTML, CSS

Categories

Sliders

Tags

abstractanaglyphanimationdigitaldistortioneffecterrorglitchhackerinternetnoisesecureslidersportvhs

External listing. code.market does not sell this product and does not process payment for it. Pricing, payment, delivery, licensing, refunds, and support are handled by the third-party merchant on its own website. We may earn an affiliate commission from a referral. Details.

Products of the Week.

Submit