Panel slide problem - need help

I have recreated my problem with sliding panels (as i can not show any content or share original RP). How to create, so that hovering closed panels would show one by one? Example, i i go with mouse from right to left all panels hover (logical, but annoying). When i hover on 2, all 3+ panels move to right, this is OK, but than i hover 3 panes and all panels first close, than 4 opens if i have luck placing mouse on the spot. How to create that hover works IF i am with mouse hovering for 1s on that panel? And how to slide panels one by one when i go with mouse from one to other, without moving all panels to start state and than hover state?

I have included my RP
panels.rp (56.7 KB)

I took a few cracks at this. You are probably better off setting this up with a repeater, or at least dynamic panels for each of your “cards” each with an “open” and “closed” state. Not sure if that makes sense for your context. Nevertheless, for what you have posted, it gets pretty tricky trying to control when, where and how to move each card, especially as you move left-to-right through the cards, because you need to basically move the current card left and keep all the cards to the right in the same position. Otherwise they will need to move left then back right again, as you’ve found.

To make it easier for me, I set up hotspots to mark the various “stop points” for open and closed cards, and then moved cards according to which card was “open” --and I think this achieves what you are trying to do. It’s not perfect, but hopefully works well enough.

To create a delayed hover effect, so the movement occurs 1 s after hovering, I add a wait of 1000 ms then trigger a different event, OnSelected. The OnSelected then tests if the cursor is still hovering over the card and if so moves the other cards. So, if you hover less than a second, nothing should happen. This does slow everything down, so if you move the mouse pointer back and forth randomly over the cards, it can get kind of wonky.

See Page 1 for a demonstration of this. Page 2 uses a slightly different approach with a simpler test condition, by setting a “local page variable” at the OnMouseEnter event to keep track of which card is currently being “hovered.” You could also use a global variable for this.

panels2.rp (119.0 KB)

This is the same as i have done it (later). I remove hover delay and i did all by moving panels. With move i solved all (quite a lot of work, but it has done the job).
Another question, can global variable store mouse position?

Yes, a global variable can store any kind of number or text. If you want to continually update a variable with the mouse position, just use the OnPageMouseMove event. Look in the “More Events” droplist for the page properties for this event.

See this example:

Cursor Tracker.rp (50.0 KB)

The cursor position is stored in a few different variables for demonstration as well as using and saving the cursor location in different ways. If you click on the “Console” button in the left panel of the prototype, you can track all the global variables in real time to see what is going on as you move your mouse around. If you click, the cursor location is saved by adding it to the global variable curLocs.

Of course, you can also use the OnMouseMove event for any widget or group, to track the cursor position only when the mouse is over that widget or group.

This is very helpful, thank you. Altho i have one more question. How can i track one panel position inside of scrolling panel (horizontal)? I try with Window.ScrollX but would not work. I want to track every panel so i can than do IF statement for positioning.
Another question, i want to do something like: IF scrollX is 24 than fix panel at 24, is this possible? When panel scrolls to some scrollX value, it gets fixed and does not scroll?
Explanation is here:
Or you could answer in my other topic: Dynamic horizontal stacking panels with scroll

Scrolling panel.rp (55.7 KB)

Sorry for all these questions, i really hit the wall here.

You can track a panel position by capturing its x-location with an OnMove event. Each panel could get its own global variable or hidden text widget which gets updated every time the panel moves. You can get the relative location within a dynamic panel by subtracting the panel’s location, as in "[[This.x - LVAR1.x]] " where LVAR1 is the outer dynamic panel widget. It looks like you may have done this already in your other thread.

I’m not quite sure what you’re trying to do with tracking the panels and scrolling to move them… ??? Dragging won’t work? Do you need to convert a scroll event to do the same thing as dragging, or do you want the dynamic panel to be much smaller so that it has to be scrolled to see all the boxes inside it?

Scrolling and Window.ScrollX applies to the browser window, not widgets–like a dynamic panel. You could make a separate page for your dynamic panel and call that from an inline frame widget. The inline frame acts like a browser window within a browser window, so you could make it about the same size as your dynamic panel and it would get built-in scrollbars. You’d track the scrolling on that second page. So, if your dynamic panel was 700x300 px, you could size your inline frame at something like 300x321 or 600x321 (to account for borders and the horizontal scrollbar.) But you’d be able to scroll left/right only so far…

It turns out that dynamic panels have built-in variables for .scrollX and .scrollY --I just found these. I’ll have to play around with it to learn more. Looks like you can track how far the dp scrolls and maybe move the widgets inside it accordingly. However, I suspect it may get jittery as you scroll, because you’d have to keep moving panels to the right as you scroll right…

In this topic, user PierreJ got very close to solving. Altho i still do not know why some things work different (scroll-you can see different margins between panels depends if you scroll fast or slow). To see what i mean, look at RP and topic.

The RP is here:
Scrolling panel_VP.rp (90.4 KB)

And topic:

Aha. Yes, looks like same basic approach I was thinking of trying… I’ll respond in that thread.