3D Slider for jQuery

Hi guys, i’d like to show you my latest work, a 3D slider entirely made with three.js. Hope you like it.

Let me know your thoughts! :blush:

https://www.dariocorbelli.it/webgl/plugins/jquery-dcwebgl-slider/demo/

3 Likes

“First real 3D slider ever” - quite a claim :stuck_out_tongue:

Looks good though. A couple of points:

  • Seems like it doesn’t work with adblock (tested with Brave browser on Android)
  • Loading could be faster. Seems to take around 10 - 15 seconds before I see the images, on mobile

Looks a bit sloppy for a commercial product, but very nice for an initial version! :mermaid:

Seams between the tiles are lingering for far too long. It’s probably because you don’t snap them together but keep easing them for a long while after the the viewer perceives them as a whole already.

I’ve just done a 3D slider inventory of the observable Universe and can confirm that his was indeed the first one; ever!

4 Likes

Hi guys, thanks for your opinions.

First of all, the claim could be too impressive, i know, but i haven’t really seen a slider like that before. Do you have any link? Anyway i changed it (the claim) with a smoothed version :wink:

@looeee i will start a test session on Brave browser, trying to fix any kind of bug. Also, the loading is relative to the images showed into the slider. The mobile version currently loads the same heavy images of the desktop version due to the high quality demo required by the reseller.
Anyway i’m already working to a new release that let you specify different images for different devices.

@Usnul are you talking about the desktop or mobile version? Anyway there are a lot of params that you can change to achieve a better experience, like the speed of the camera or the distance from the cubes (both on desktop and mobile version).

Thanks again for your thoughts.

2 Likes

I have a little problem:
When i initialise the slider i become an error that the light.hdr file could not be found
Can you help me pls???

The thing is even though WebGL has great support there are a lot desktop machines not supporting it, mostly office machines without GPU, so slider usually are done with CSS3D since for such elements which are essential informative part of the page a solid support is important. CSS3D also basically comes almost for free depending on the library if any.

1 Like