Hello,
When viewing the wix pricing plans on the mobile, the repeater automatically collapses. Whereas on the desktop version, it displays fully (see screenshots below). I would like to replicate this with another customized repeater (outside of the pricing plan app).
Since the code already exists (as its already part of a wix app), would it be possible for someone from the wix team to share it here please?
Thank you so much.
![](https://static.wixstatic.com/media/a27d24_2146feaa1ba04dec9dbdc35ab2509baa~mv2.png/v1/fill/w_771,h_1277,al_c,q_90,enc_auto/a27d24_2146feaa1ba04dec9dbdc35ab2509baa~mv2.png)
![](https://static.wixstatic.com/media/a27d24_362af47fd3be478985ca57b1395e793f~mv2.png/v1/fill/w_641,h_1249,al_c,q_90,enc_auto/a27d24_362af47fd3be478985ca57b1395e793f~mv2.png)
I think I previously gave you the wrong advice with my code example (this post dealt with a similar problem).
It looks like the solution is to get rid of the event handler in the Properties panel, and move the Click event into the onReady function for the page. This way everything happens at once.
I tested this on my site and it worked:
import wixWindow from 'wix-window'; $w.onReady(function () { if (wixWindow.formFactor === "Mobile") { $w("#box9").collapse(); $w("#vectorImage18").show(); // Use this instead of the event handler from the Properties panel $w("#vectorImage18").onClick((event) => { // $item limits the event to only the relevant repeater item let $item = $w.at(event.context); $item("#box9").expand(); }); } });
Hi there! Instead of using the app, you could customize the Paid Plans layout in a repeater by following this handy tutorial and catering it to your needs. Here's the API for Paid Plans.
For the expanding/collapsing, you could reference this post and this API to build something like this:
export function yourButton_click(event) { $w("#repeaterName").onItemReady(($item, itemData, index) => { if (event.context.itemId === itemData._id) { // #box1 is the id of all the boxes, but $item maps through each item on the repeater $item("#box1").expand(); } }) }