Pin to browser - only (top) vertical [resolved]


#1

Hey, I came up with the solution I was looking for a long time, and I want to share it.
I wanted to pin the widget (menu) to the top, but in such a way that if the page would be too wide, the menu would shift to the left along with the page content.
As you know there is option “Pin to browser” but widget must be fixed in two dimensions x and y. There is no option to fix only y axle.
I found a workaround:

  1. Make a Dynamic Panel, check “Fit to Content”, Pin to browser -> Top, Left.
  2. In Page “Interactions” OnPageLoad -> Open Link -> Link to external URL click (fx) and put this:
    javascript: $('[data-label="your_DP_name"]').css('position', 'fixed'); $(window).scroll(function(event) { $('[data-label="your_DP_name"]').css("margin-left", -$(document).scrollLeft()); });

pin_only_top.rp (72.8 KB)


#2

Does anyone know the same trick but then for only pinning horizontally?
I found the answer:
javascript: $(’[data-label=“your_DP_name”]’).css(‘position’, ‘fixed’); $(window).scroll(function(event) { $(’[data-label=“your_DP_name”]’).css(“margin-top”, -$(document).scrollTop()); });