The goal - On phones and tablets, our map takes up most of the screen.
However, the page continues below the map. I want to display the map, and the user still be able to scroll the page which includes dragging inside the map area. I don't want the map to pan, I want to scroll down the page.
I turned off the touch panning, which is great, but now the area inside the map is dead.
I want the standard page scrolling I have everywhere else on the page.

Thank you.

Comments

IKE0088’s picture

IKE0088 CreditAttribution: IKE0088 commented

Try this:
/* Smartphone portrait */
@media only screen and (max-width:320px) {
#openlayer-container{
width:30%
}
}

/* Smartphone landscape */
@media only screen and (min-width:321px) and (max-width:480px) {
#openlayer-container{
width:40%
}

}

/* Tablet portrait */
@media only screen and (min-width:481px) and (max-width:768px) {

#openlayer-container{
width:60%
}

}

/* Tablet landscape */
@media only screen and (min-width:769px) and (max-width:1024px) {
#openlayer-container{
width:70%
}

}

/* Standard layout */
@media only screen and (min-width:1025px) {
#openlayer-container{
width:100%
}
}