0

I am using JQuery Mobile, and I have a panel that appear on the right of the screen, is it possible to have the panel appear on the right column (middle of the page) and not to the far right of the screen.

Omar
  • 32,302
  • 9
  • 69
  • 112
Annie
  • 33
  • 6

2 Answers2

1

jQuery mobile panels are positioned absolutely. So, if the panel has a defined width, you can give it these CSS attributes:

#panel {
width: xx; /* width of the panel */
left: 50%;
margin-left: -xx; /* subtract half the width of panel */
}

Then it should appear in the middle of the page.

marswoody
  • 41
  • 4
  • Awesome, that really helped a lot. Thanks a mill – Annie Sep 16 '14 at 14:04
  • Thank you so much for your help above, would you happen to know how I might be able to place the panel in between my header and footer, so that that it only appears between the header and footer. P.s sorry am not able to vote until I reach 15 reputation, promise to vote when I reach 15. – Annie Sep 17 '14 at 14:39
0

I found a way to place the panel in-between my header and footer. I just added data-position ="fixed" to my header section and it worked like a charm.

<div data-role="header" data-position="fixed">
Annie
  • 33
  • 6