Slow: Fast:

ORIGINAL

A real 3D slider

INNOVATIVE

WebGL technology applied

CROSS PLATFORM

Tested on several devices

ELEGANT

Suitable for any context

SIMPLE TO USE

Few settings easy to set up

DCWebGL Slider 1.0

A new jQuery plugin to show your photos in a real 3D world!

DCWebGL Slider is the latest jQuery plugin to show images in a creative way, taking advantage of the latest web technologies, especially the WebGL library.
Everything is showed in a real 3D world and you are able to change many different settings to customize your experience.

Great performance!

From desktop to mobile device.

Everything has been tested on several devices to grant always the best experience.
The slider detects whenever it's loaded on mobile device and automagically applies specific settings to increase the performance.

Buy It Now!

Nike Air Max

$150,00

Nike Shoes

$110,00

Woman Shoe

$74,99

Air Jordan

$184,99

Air Jordan

$184,99

Nike Shoes

$89,99

Comfortable Shoes

$64,90

Nike Free

$134,90

Nike Free

$134,90

Embed it everywhere!

You can show your slider wherever you want.

Choosing different settings for each slider is super easy.
Every instance may have its own background, images, text and even fonts!

Buy It Now!

Show your content in a

Real 3D World

Elegant and simple code.

Set the options according to your needs, control the 3D camera with specific settings, choose your background. A simple setup to make the magic happens!

$('#dcWebglSliderDiv').dcWebglSlider();

$('#dcWebglSliderDiv').dcWebglSlider({
	envPreset: 'adams_place_bridge',
	cameraRadius: 90,
	slowSpeed: 1.6,
	fastSpeed: 21,
});

Dedicated setup for mobile devices.

You can differentiate the camera properties on mobile devices to achieve the best results.

$('#dcWebglSliderDiv').dcWebglSlider({
	envPreset: 'studio',
	cameraRadius: 90,
	slowSpeed: 1.6,
	fastSpeed: 21,
	cameraRadiusM: 100,
	slowSpeedM: 2.1,
	fastSpeedM: 20.2
});

3D environments included!

You can select from many different background presets.

Choose your favourite background by defining it into the initial settings or simply create your own preset.
You can specify the url of an equirectangular image, a HDR source light, background blur and many more settings.

Visit HDRIHaven.com for high quality HDRIs for free!

$('#dcWebglSliderDiv').dcWebglSlider({
	envPreset: 'small_hangar', // Choose from many different presets
});

$('#dcWebglSliderDiv').dcWebglSlider({
	// Type the absolute url of your preset directory
	envPreset: 'https://www.my-url.com/dcwebglslider/presets/‹your-preset-url›/',
});