# 3D Slider for jQuery

**URL:** <https://discourse.threejs.org/t/3d-slider-for-jquery/10170>\
**Category:** Showcase\
**Tags:** orbit-controls, camera, animation, textures, materials\
**Created:** [October 12, 2019, 4:58am UTC](https://discourse.threejs.org/t/3d-slider-for-jquery/10170 "2019-10-12T04:58:38Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![dario\_corbelli](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/dario_corbelli/32/7576_2.png) [@dario\_corbelli](https://discourse.threejs.org/u/dario_corbelli)\
**Post date:** [October 12, 2019, 4:58am UTC](https://discourse.threejs.org/t/3d-slider-for-jquery/10170/1 "2019-10-12T04:58:38Z")

</div>

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! 😊

[https://www.dariocorbelli.it/webgl/plugins/jquery-dcwebgl-slider/demo/](https://www.dariocorbelli.it/webgl/plugins/jquery-dcwebgl-slider/demo/)

---

<div class="post-metadata">

**Author:** ![looeee](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/looeee/32/59_2.png) [@looeee](https://discourse.threejs.org/u/looeee)\
**Post date:** [October 12, 2019, 1:56pm UTC](https://discourse.threejs.org/t/3d-slider-for-jquery/10170/2 "2019-10-12T13:56:09Z")

</div>

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

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

---

<div class="post-metadata">

**Author:** ![Usnul](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/usnul/32/2355_2.png) [@Usnul](https://discourse.threejs.org/u/Usnul)\
**Post date:** [October 12, 2019, 2:17pm UTC](https://discourse.threejs.org/t/3d-slider-for-jquery/10170/3 "2019-10-12T14:17:52Z")

</div>

Looks a bit sloppy for a commercial product, but very nice for an initial version! 🧜‍♀️

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.

---

<div class="post-metadata">

**Author:** ![TheHappyKoala](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/thehappykoala/32/6074_2.png) [@TheHappyKoala](https://discourse.threejs.org/u/TheHappyKoala)\
**Post date:** [October 12, 2019, 2:41pm UTC](https://discourse.threejs.org/t/3d-slider-for-jquery/10170/4 "2019-10-12T14:41:13Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![dario\_corbelli](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/dario_corbelli/32/7576_2.png) [@dario\_corbelli](https://discourse.threejs.org/u/dario_corbelli)\
**Post date:** [October 13, 2019, 3:31pm UTC](https://discourse.threejs.org/t/3d-slider-for-jquery/10170/5 "2019-10-13T15:31:19Z")

</div>

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 😉

@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.

---

<div class="post-metadata">

**Author:** ![braegy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/braegy/32/7804_2.png) [@braegy](https://discourse.threejs.org/u/braegy)\
**Post date:** [October 25, 2019, 1:42pm UTC](https://discourse.threejs.org/t/3d-slider-for-jquery/10170/6 "2019-10-25T13:42:02Z")

</div>

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???

---

<div class="post-metadata">

**Author:** ![Fyrestar](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/fyrestar/32/52793_2.png) [@Fyrestar](https://discourse.threejs.org/u/Fyrestar)\
**Post date:** [October 25, 2019, 2:07pm UTC](https://discourse.threejs.org/t/3d-slider-for-jquery/10170/7 "2019-10-25T14:07:42Z")

</div>

> [@dario\_corbelli](#):
>
> but i haven’t really seen a slider like that before

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.