Transition Slider - Responsive jQuery Slider Plugin

Transition Slider - Responsive jQuery Slider Plugin

Cart 150 sales

Transition Slider is unique innovative image and video slider with seamless transitions and responsive animated layers.

Showcase your images and videos in your website across all browsers & devices with this unique and most powerful Slider around. Create beautiful responsive slideshow, image slider, video slider, layer slider with animated layers and effects Slide, Fade, Zoom, Warp, Crossfade, Flash, Twirl, Roll, Stretch.

Next-Gen Transitions

Bring your website to new level with transition effects only seen in professional videos. Impress visitors with original animations that will catch their attention. Transition Slider enables you to use video editing effects inside your website. It includes advanced effects like motion blur, radial blur, flash, fade and crossfade.

Easy to use

Build sliders in minutes and embed them anywhere in your website. Professionally designed templates make this slider easy to use and fully customizable.

Slider Templates

Transition Slider includes slider templates for easy start. Choose one of prebuilt templates, then replace images and edit slide elements and your slider is ready.

View All Templates

Animated Layers

Design your slides easily by adding animated Text, Image, Button and Video elements, with advanced settings for each element. Each element has In animation, Out animation with customisable duration and delay.

Mobile and Tablet Settings

With mobile and tablet settings you can create fully responsive slider that will look great on all devices. You can have different slider size (portrait on mobile, landscape on desktop and tablet) and change any setting for layer elements (font size, position, spacing)

NEW (2.11) – Line Transitions

Transition between slides using a line that reveals next slide.

Draggable Slides

Transition Slider has draggable slides, which makes awesome WebGL effects even more attractive. You can drag slides with touch or mouse, in both directions.

Lazy Loading

Slider starts to load when it becomes visible on screen, so you can have multiple sliders on the same oage with fast page loading time. You ca also have slider lower on the page, which will make site load even faster.

High Performance

Slider is rendering only when it is visible in viewport, so you can have multiple full width sliders on the page without problem. This enables you to create rich website with animations, videos and images with high performance.

Touch Slider

Transition Slider has draggable slides, which makes awesome effects even more attractive. You can drag slides with touch or mouse, in both directions

Date: 31/5/2021
Version: 2.19.0

*   All layer elements have been expanded with another new option called box shadow. While the text and heading element got another text shadow option.
*   We have expanded the Lightbox options so that now the Button element can open any image or video you want, just enter the URL.
*   New template - Static App Slider
*   New template - Cinematic Lightbox Slider
*   New template - Real estate with Tabs

*   A text effect called Effect9 (typing effect) enhanced and optimized to support multiple line text.
*   Improved transitions where it is now possible for the current slide to go slower or its brightness to decrease.
*   We've created a cleanup of some old options that are no longer needed: "contentAnimationType".

*   Special text effects optimized and removed bugs that appeared when there were multiple text elements with the same text effect on the slider.

Date: 17/5/2021
Version: 2.18.1

*   Fixed issue where slider crashed when checking static elements.

Date: 17/5/2021
Version: 2.18.0

*   From now on, each element has a static option with which any element can remain visible on any slide (eg you can add a watermark to your slide or custom navigation ...)
*   Through the static elements it is possible to arrange custom navigation and pagination, with which you can go to the next, previous or jump to any slide you define.
*   Extended autoplay option where now each slide can have its own autoplay duration.
*   The autoplay option now has a "Pause on hover" extension, when the user moves the mouse over the slider the current slide will be paused.
*   Autoplay also has an additional option - visual progress, with this option you can display a small circular progress bar that shows in real time what is duration of current slide.
*   From now on, the background slide does not have to be an image or a video, but can also be a color. We have expanded the option so that you can add two colors and create a gradient color, there is also the option of a horizontal or vertical gradient.
*   A new option that allows slides within the slider to be displayed in a random order when loading.
*   Crossfade - custom alpha map | it is possible to add any alpha map for the crossfade effect and thus we have enabled even more combinations to create new transitions.
*   From now on you can add cssClass to any element and thus access each element from the slide from the outside. Add your custom CSS class WITHOUT the dot, e.g: my-class. Add multiple classes separated with space, e.g: my-class my-class-2. Classes for slide navigation: slide-next, slide-prev. Classes for go to slide: slide-1, slide-2, ...

*   For arabic web page display fixed the problem with the display of navigation arrows.
*   We fixed the initial slide option which now works in preview if the inital slide parameter changes.
*   The autoplay timer was sometimes not reset to change the slide via navigation or pagination.

Date: 6/4/2021
Version: 2.17.1

*   Effect9 or typing effect supports multiple words again (writing and deleting).
*   Effect4 corrected text position when used on a text block element.
*   Fade animation is completely removed from the layer at the end of the animation (100% translate)

Date: 26/2/2021
Version: 2.16.0

*   Added new slider mode "webgl" or "css". If you don't want advanced transitions between slides, you can now use the "css" type of slider, which will work faster because it doesn't load the additional scripts needed for advanced transitions.
*   Added option for image elements, from now on you can put an onClick action of type "url" and set the URL you want the image to open when clicked on it.


*   Fixed predefined transitions "blur2" and "blur3" 

Date: 2/2/2021
Version: 2.15.0

*   A new option that allows a true responsive and fullscreen slider regardless of the width and height of the container of the template in which it is located. The options are forceFullscreen and forceResponsive.
*   Added new transition SpinEffect + RadialBlurShader.
*   From now on slider options can also be specially tuned for mobile, tablet and desktop.
*   Due to the expansion of text effects, we were forced to rearrange the typing effect that you can currently find under Effect 9. You can also find an additional 14 new effects that are perfect for text elements.
*   Video background autoplay can now be turned on and off.

*   Fixed and adjusted templates to look good on mobile and tablet.
*   You no longer need to worry about which protocol the slider assemblies are on (http / https) and which protocol the slider is displayed on, CORS policy is fixed in this version.

*   The "examples" folder has no more errors.
*   Text element font size issues, sometimes to change the font size, the font is not well displayed on the slider.
*   Sometimes the button on the last layer took over the click events on all the previous buttons.

Date: 25/11/2020
Version: 2.14.0

*   Very big change for the elements on the layer, we made a completely different and fast implementation that will soon bring something very big!
*   Added new element "heading" with default tag h2
*   Added option "Reset video on slide change" - resetVideos
*   Thumbnails assets added in all templates
*   Added lightbox and thumbnails templates as an example
*   Added 6 new simple templates

*   Huge transition improvements, from now on all transitions have higher FPS with better blur
*   Improved small bugs in some templates
*   Some templates have improved transitions

*   Fixed that multiple sliders on one page can work with thumbnails included

*   Video tutorial - How to use General Slider options

Date: 4/11/2020
Version: 2.13.0

*   NEW SLIDER MODE: On click open slider in lightbox
*   NEW IMAGE AND VIDEO FILE SUPPORT: Video (".mp4", ".m4a", ".m4p", ".m4b", ".m4r", ".m4v", ".webm", ".ogg") | Image (".jpg", ".jpeg", ".png", ".bmp", ".webp")

*   Shaders and rendering improved and faster

*   Rendering transitions on tab change
*   Resize texture size fix

Date: 21/10/2020
Version: 2.12.1

*   Multiple sliders render fix

Date: 20/10/2020
Version: 2.12.0

*   NEW ELEMENT: added a new iFrame element has come to town!
*   Added more options for slider thumbnails

*   More precise relative / absolute positions for elements
*   Accelerated slider loading
*   Faster blur effect and fixed performance of many transitions

Date: 28/9/2020
Version: 2.11.0

*   Thumbnails are added: Ability to turn on thumbnails in all positions (up, down, left, right)
*   10 new "Line" transitions
*   Added new Premium Template - Travel Adventure
*   Added new Premium Template - Photograph
*   Added new Premium Template - Business Corporate
*   Added new Premium Template - Agency theme
*   Added new Premium Template - Spa
*   Added new Premium Template - Clothing Collection Shop

*   Refactoring template settings, moving empty options

*   Fixed an issue with the stopOnLastSlide option when the first slide was attempted to move to the left the image was missing
*   The trackpad scroll skipped 2 slides

Date: 4/9/2020
Version: 2.10.0

*   Added new option to Video settings: Start video muted, now is possible to start video muted or unmuted (startVideoMuted [boolean])

Date: 31/8/2020
Version: 2.9.0

*   Added new Premium Template - Gym
*   Added new Premium Template - Car 2

Date: 23/7/2020
Version: 2.8.0

*   Added new Premium Template - Fashion
*   Added on click lightbox feature for image and video elements on slide
*   Corssfade effect with new directions

*   All preloader styles are in the center
*   All templates are now with cleaner JSON config
*   Reduced size of templates assets but with same quality

Date: 16/7/2020
Version: 2.7.0

*   Added new Premium Template - Sport news
*   Added letter spacing property

*   Reload slider external call is improved

Date: 2/7/2020
Version: 2.6.3

*   Added new Premium Templates

*   Layer fixes and improvements

Date: 24/6/2020
Version: 2.6.2

*   Mouse wheel slider navigation
*   Added new Premium Templates
*   New preloader styles

*   PNG slide transparency fix
*   Improved old Premium Templates with new features
*   Layer fixes and improvements

Date: 28/4/2020
Version: 2.5.0

*   Added mobile and tablet options for elements
*   Added new Premium Templates

*   Transitions performance improvement
*   Content mode fix
*   Slider target URL fix
*   Font loading improvements

Date: 26/3/2020
Version: 2.3.0

*   Typing animation for text elements
*   Parallax options for layer
*   HTML tag for text element
*   New elements added: row and column
*   Added selector for inverting colors (perfect for situations where slider is under website menu)

*   Now is possible to change color of navigation

Date: 16/12/2019
Version: 2.2.0

*   Added slider background overlay color
*   Content mode for layers
*   Parallax for layer elements and background image or video
*   Block layer element - now is possible to group elements into block element and move around, add properties...
*   Video layer element
*   Progress animation for layer - fade, translate...
*   Lazy loading for multiple sliders on page. Slider is loading and rendering only if visible on website.
*   Added Desktop / Tablet / Mobile view inside slide editor

*   Transitions improvement - blur position & quality, transition duration, change slide on drag
*   Layer size can be "px" or "%" 
*   Moved layer size options from slide to slider
*   Layer editor improvements

*   Autoplay timer is properly resetting on slider change

Date: 11/11/2019
Version: 2.1.1

*   Fixed lib paths for templates

Date: 07/11/2019
Version: 2.1.0

*   Added new Crossfade effect

Date: 30/10/2019
Version: 2.0.3

*   Fixed visual issue with Brightness Effect

Date: 29/10/2019
Version: 2.0.2

*   TEMPLATES are included!

*   Fixed visual issue with video slide buttons

Date: 24/10/2019
Version: 2.0.1

*   Reduced jQuery plugin size
*   Improved loading time
*   Removed usage of webfonts

Date: 21/10/2019
Version: 2.0.0

*   Slide settings: new feature added "Full slide link" 
*   Each element is extended with many new settings and hover parameters
*   Layer size option for mobile and tablet
*   NEW responsive feature: Responsive ratio for all devices: desktop, tablet, and mobile
*   Define breakpoint width for devices (Tablet screen width and mobile screen width)
*   Loading with change text and background color feature
*   Transition progress between slides on touch move/drag
*   Navigation full customizable (change background color, size, radius...)
*   Pagination full customizable (change background color, size, radius...)

*   Fixed many issues with layers, elements positioning, loading...
*   smoother transitions

Date: 10/5/2019
Version: 1.2.0

*   slide layers - click on element inside layer editor will show elements settings
*   now is possible to duplicate slide inside slider settings
*   improved quality of images and videos for mobile devices

*   fixed issue with THREE.js and swiper.js conflicts and overwrite state with other plugins
*   fixed slider stuck issue if ratio responsive is used
*   fixed issue with delete, preview and reordering slides
*   slider shadow is back again

Date: 4/5/2019
Version: 1.1.0

*   slide layers - Add button, add text and add image
*   hash navigation
*   responsive ratio
*   responsive height



Tell us what you think!

We'd like to ask you a few questions to help improve CodeCanyon.

Sure, take me to the survey