# Horizontal Scrolling with 🐭 Mouse Drag?

**URL:** <https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133>\
**Category:** Plugins\
**Created:** [February 5, 2022, 1:37pm UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133 "2022-02-05T13:37:38Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![buero](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/buero/32/31435_2.png) [@buero](https://forum.bubble.io/u/buero)\
**Post date:** [February 5, 2022, 1:37pm UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/1 "2022-02-05T13:37:38Z")

</div>

Hey - just quick question - i have a horizontal scrolling in my app and need it to get dragged by mouse as well like this.

![ezgif.com-gif-maker](https://us1.discourse-cdn.com/bubble/original/3X/4/a/4afc984cfb759724f2852a92cec936a331f1cf23.gif)

https://codepen.io/thenutz/embed/preview/VwYeYEE?default-tabs=css%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=VwYeYEE

I can not code so any ideas to get this in bubble?

---

<div class="post-metadata">

**Author:** ![pachocastillosr](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/pachocastillosr/32/154570_2.png) [@pachocastillosr](https://forum.bubble.io/u/pachocastillosr)\
**Post date:** [February 21, 2022, 1:22am UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/2 "2022-02-21T01:22:55Z")

</div>

Hi!

I am looking for the same thing, did you find a way to do it?

---

<div class="post-metadata">

**Author:** ![buero](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/buero/32/31435_2.png) [@buero](https://forum.bubble.io/u/buero)\
**Post date:** [February 21, 2022, 7:47am UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/3 "2022-02-21T07:47:00Z")

</div>

Not yet, i will let you know when i find a solution. I think i found a plugin in the pkugin editor that says it does this but i didn’t testet it yet? You saw it? Did it work for you?

---

<div class="post-metadata">

**Author:** ![jmalmeida](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/jmalmeida/32/120123_2.png) [@jmalmeida](https://forum.bubble.io/u/jmalmeida)\
**Post date:** [February 21, 2022, 8:18am UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/4 "2022-02-21T08:18:54Z")

</div>

Hi @buero

1. Add an HTML element to the page where you want the effect with the following code

2. Add the id ‘drag’ to the element you need to be draggable.

---

<div class="post-metadata">

**Author:** ![pachocastillosr](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/pachocastillosr/32/154570_2.png) [@pachocastillosr](https://forum.bubble.io/u/pachocastillosr)\
**Post date:** [February 21, 2022, 2:09pm UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/5 "2022-02-21T14:09:57Z")

</div>

Hi @jmalmeida , thanks for sharing this!

I did what you said and but it did not work for me, I got this errors:

```
Bug in custom html:
SyntaxError: Identifier 'slider' has already been declared
    at p (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:2:523)
    at Ia (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:3:15882)
    at a.fn.init.append (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:3:17153)
    at a.fn.init. (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:3:18257)
    at S (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:3:398)
    at a.fn.init.html (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:3:17935)
    at a.fn.init.e.fn.html (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:24:80939)
    at https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:939160
    at UNMANGLED_html_wrap (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:937611)
    at https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:939119
    at e._run_if_not_destroying (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:1923717)
    at k.fn (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:1923587)
    at k.run_me (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2383873)
    at https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2385945
    at https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2385983
    at Object.a.traceSpan (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2183641)
    at Object.c.traceSpan (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:108108)
    at n (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2385852)
    at root (https://www.healthyfans.co/version-test/crear_plan?debug_mode=true&ic=32ud27rn1&pl=2p30:1:1)Bug in custom html:
TypeError: Cannot read properties of null (reading 'addEventListener')
    at :15:9
    at p (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:2:523)
    at Ia (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:3:15882)
    at a.fn.init.append (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:3:17153)
    at a.fn.init. (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:3:18257)
    at S (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:3:398)
    at a.fn.init.html (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:3:17935)
    at a.fn.init.e.fn.html (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:24:80939)
    at https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:939160
    at UNMANGLED_html_wrap (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:937611)
    at https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:939119
    at e._run_if_not_destroying (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:1923717)
    at k.fn (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:1923587)
    at k.run_me (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2383873)
    at Object.u.autorun (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2382902)
    at e.autorun (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:1923570)
    at Object.initialize (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:937966)
    at Object.e.initialize (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:1003816)
    at Object.t.initialize (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:697021)
    at https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:1929692
    at Object.u.autorun_top (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2385182)
    at e.initialize (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:1929660)
    at e.draw (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:1927888)
    at e.draw_children (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:1930343)
    at e.run_draw_children (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:1928685)
    at e.draw (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:1927956)
    at https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:104726
    at Object.a.traceSpan (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2183641)
    at Object.c.traceSpan (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:108108)
    at https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:104378
    at t.display (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:104737)
    at p (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2479219)
    at S.fn (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2478492)
    at S.notify (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2396448)
    at O._was_updated (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2395546)
    at O._dec (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2398808)
    at O.notify (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2399263)
    at E._was_updated (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2395546)
    at E.turn (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2397341)
    at HTMLDocument. (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:6:2477262)
    at j (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:2:29948)
    at k (https://dhtiece9044ep.cloudfront.net/package/run_debug_js/e9ee27b90e3aec41eedde3ed33b2ca8ea2023b84f16d11430641b64e4e50a185/xfalse/x15:2:30262)
    at root (https://www.healthyfans.co/version-test/crear_plan?debug_mode=true&ic=32ud27rn1&pl=2p30:15:9)

```

Hi, @buero, sounds good, I have not seen any plugin yet

---

<div class="post-metadata">

**Author:** ![jmalmeida](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/jmalmeida/32/120123_2.png) [@jmalmeida](https://forum.bubble.io/u/jmalmeida)\
**Post date:** [February 21, 2022, 2:25pm UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/6 "2022-02-21T14:25:11Z")

</div>

Sorry @pachocastillosr, there is not enough data for me to degub what’s happening there. Could you share screenshots of your implementation?

You only added the code once in the page, right?

---

<div class="post-metadata">

**Author:** ![pachocastillosr](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/pachocastillosr/32/154570_2.png) [@pachocastillosr](https://forum.bubble.io/u/pachocastillosr)\
**Post date:** [February 21, 2022, 2:31pm UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/7 "2022-02-21T14:31:45Z")

</div>

Sure! Here are my screenshots:

 ![reslult5](https://us1.discourse-cdn.com/bubble/original/3X/1/6/16915db4f3946cd4023ca25ef30c1e26b64fddad.png)  
 ![reslult3](https://us1.discourse-cdn.com/bubble/original/3X/8/1/8178f3706aad29238d9c6f61dfdc48295d792e3a.png)  
 ![reslult4](https://us1.discourse-cdn.com/bubble/original/3X/5/3/53d40968344d59464a60d7e254609080daa984fe.png)

Yes, I only added the code once.

The code is working partially, the mouse do turns into a hand when I put my mouse cursor on top of the “drag” element (this did not happen before), but when I try to drag it, it do not drags.

---

<div class="post-metadata">

**Author:** ![buero](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/buero/32/31435_2.png) [@buero](https://forum.bubble.io/u/buero)\
**Post date:** [February 21, 2022, 2:43pm UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/8 "2022-02-21T14:43:20Z")

</div>

same for me

---

<div class="post-metadata">

**Author:** ![jmalmeida](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/jmalmeida/32/120123_2.png) [@jmalmeida](https://forum.bubble.io/u/jmalmeida)\
**Post date:** [February 21, 2022, 2:54pm UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/9 "2022-02-21T14:54:45Z")

</div>

@pachocastillosr, @buero do you have the RG layout as Horizontal scrolling?

![image](https://us1.discourse-cdn.com/bubble/original/3X/a/3/a353effc7a055573d67ec84e4ec5729a41156b4d.png)

---

<div class="post-metadata">

**Author:** ![pachocastillosr](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/pachocastillosr/32/154570_2.png) [@pachocastillosr](https://forum.bubble.io/u/pachocastillosr)\
**Post date:** [February 21, 2022, 2:56pm UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/10 "2022-02-21T14:56:54Z")

</div>

Yes

 ![reslult5](https://us1.discourse-cdn.com/bubble/original/3X/a/c/acf6489eb8f2f8cdc0b698202622ec90f44d555b.png)

---

<div class="post-metadata">

**Author:** ![jmalmeida](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/jmalmeida/32/120123_2.png) [@jmalmeida](https://forum.bubble.io/u/jmalmeida)\
**Post date:** [February 21, 2022, 3:03pm UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/11 "2022-02-21T15:03:14Z")

</div>

It’s working ok for me. I’ve just tried again in a new page:

![Grabar_2022_02_21_16_01_04_476](https://us1.discourse-cdn.com/bubble/original/3X/e/9/e97dc19239cb59596781bb941a0d4da0ac94dfbf.gif)

---

<div class="post-metadata">

**Author:** ![jmalmeida](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/jmalmeida/32/120123_2.png) [@jmalmeida](https://forum.bubble.io/u/jmalmeida)\
**Post date:** [February 21, 2022, 5:12pm UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/12 "2022-02-21T17:12:20Z")

</div>

@pachocastillosr’s RG is working ok

---

<div class="post-metadata">

**Author:** ![pachocastillosr](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/pachocastillosr/32/154570_2.png) [@pachocastillosr](https://forum.bubble.io/u/pachocastillosr)\
**Post date:** [February 21, 2022, 5:17pm UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/13 "2022-02-21T17:17:56Z")

</div>

@jmalmeida Yes it is working perfectly now! Thanks for your help!

---

<div class="post-metadata">

**Author:** ![bkerryk](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/bkerryk/32/184126_2.png) [@bkerryk](https://forum.bubble.io/u/bkerryk)\
**Post date:** [February 28, 2022, 4:37am UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/14 "2022-02-28T04:37:52Z")

</div>

Can you explain the fix so anyone else can see and not need to DM @jmalmeida 😃 Thanks!

---

<div class="post-metadata">

**Author:** ![jmalmeida](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/jmalmeida/32/120123_2.png) [@jmalmeida](https://forum.bubble.io/u/jmalmeida)\
**Post date:** [February 28, 2022, 7:01am UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/15 "2022-02-28T07:01:02Z")

</div>

Hi @bkrryk!

Doesn’t what I shared work for you either? The solution I provided is ok and working.

The fix was for an specific problem, @pachocastillosr was loading the script before making the RG visible, once loading it at the same time as the RG the problem disappeared.

---

<div class="post-metadata">

**Author:** ![daviddr17](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/daviddr17/32/239174_2.png) [@daviddr17](https://forum.bubble.io/u/daviddr17)\
**Post date:** [February 28, 2022, 11:48am UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/16 "2022-02-28T11:48:34Z")

</div>

hey there,

I am trying to use this for more than one repeating group on certain pages, but unfortunately it is only working for one RG. All others are not scrolling on click.

Any solutions for that?

Thanks!

---

<div class="post-metadata">

**Author:** ![jmalmeida](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/jmalmeida/32/120123_2.png) [@jmalmeida](https://forum.bubble.io/u/jmalmeida)\
**Post date:** [February 28, 2022, 1:00pm UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/17 "2022-02-28T13:00:35Z")

</div>

Add a different id to each RG and add those ids to the code.

---

<div class="post-metadata">

**Author:** ![daviddr17](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/daviddr17/32/239174_2.png) [@daviddr17](https://forum.bubble.io/u/daviddr17)\
**Post date:** [February 28, 2022, 1:16pm UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/18 "2022-02-28T13:16:17Z")

</div>

thats what I was trying, but cannot get it to work ☹

---

<div class="post-metadata">

**Author:** ![pachocastillosr](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/pachocastillosr/32/154570_2.png) [@pachocastillosr](https://forum.bubble.io/u/pachocastillosr)\
**Post date:** [February 28, 2022, 2:10pm UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/19 "2022-02-28T14:10:56Z")

</div>

Hi, in my case what he did was put a conditional to make the html element visible only when the RG was visible. That did the trick

---

<div class="post-metadata">

**Author:** ![buero](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/buero/32/31435_2.png) [@buero](https://forum.bubble.io/u/buero)\
**Post date:** [February 28, 2022, 4:48pm UTC](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133/20 "2022-02-28T16:48:07Z")

</div>

Hey, seems like multiple people have the same problem and also a lot will write on this thread in future - could you may give a example how the code would look? i would even pay for your work for all if you dm me your paypal mail

[Next page](https://forum.bubble.io/t/horizontal-scrolling-with-mouse-drag/190133.md?page=2)