Is there some way to put a scroll bar on the popup window on tablets?

2135
4
Jump to solution
04-25-2016 10:08 AM
JayGeisen
New Contributor III


I get complaints that people don't know they can scroll down on iPads because there are no scroll bars. Scrolling does work fine, however. I guess it just isn't apparent to some. Thanks

Tags (1)
0 Kudos
1 Solution

Accepted Solutions
RobertScheitlin__GISP
MVP Esteemed Contributor

Jay,

  I thing about this is IOS/apple specific and is the norm for apple they remove the scroll bar for some reason. You can add this css to your apps theme common.css using this and it will show a scrollbar but it will not really work.

.esriPopup .contentPane::-webkit-scrollbar {

    -webkit-appearance: none;

}

.esriPopup .contentPane::-webkit-scrollbar:vertical {

    width: 11px;

}

.esriPopup .contentPane::-webkit-scrollbar:horizontal {

    height: 11px;

}

.esriPopup .contentPane::-webkit-scrollbar-thumb {

    border-radius: 8px;

    border: 2px solid white; /* should match background, can't be transparent */

    background-color: rgba(0, 0, 0, .5);

}

.esriPopup .contentPane::-webkit-scrollbar-track {

    background-color: #fff;

    border-radius: 8px;

}

View solution in original post

4 Replies
RobertScheitlin__GISP
MVP Esteemed Contributor

Jay,

  I thing about this is IOS/apple specific and is the norm for apple they remove the scroll bar for some reason. You can add this css to your apps theme common.css using this and it will show a scrollbar but it will not really work.

.esriPopup .contentPane::-webkit-scrollbar {

    -webkit-appearance: none;

}

.esriPopup .contentPane::-webkit-scrollbar:vertical {

    width: 11px;

}

.esriPopup .contentPane::-webkit-scrollbar:horizontal {

    height: 11px;

}

.esriPopup .contentPane::-webkit-scrollbar-thumb {

    border-radius: 8px;

    border: 2px solid white; /* should match background, can't be transparent */

    background-color: rgba(0, 0, 0, .5);

}

.esriPopup .contentPane::-webkit-scrollbar-track {

    background-color: #fff;

    border-radius: 8px;

}

JayGeisen
New Contributor III

Thanks Robert.

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Jay,

  Don't forget to mark this question as answered by clicking on the "Correct Answer" link on the reply that answered your question.

0 Kudos
JayGeisen
New Contributor III

These "new" forums are taking some getting used to for me. Done!

0 Kudos