SharePoint 2013 on a mobile device does not support scrolling within iframes

Recently, I set up a SharePoint 2013 website with a few iframes. However, when I access the site on my mobile devices (iPad and Android), I am unable to scroll through the entire page by touching within the iframe.

I attempted to solve this issue by including the following in my CSS:

-webkit-overflow-scrolling: touch;

Unfortunately, applying this to the <div> parent container of the iframe did not resolve the problem.

I have researched various solutions for scrolling problems within iframes but have not found one that addresses this specific issue.

Any assistance is greatly appreciated.

androidioscsssharepointiframe

Answer №1

Encountered a similar issue before. One potential solution is to include the following code in your CSS.

#s4-workspace, iframe { 
    -webkit-overflow-scrolling: touch; 
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Use CSS and JavaScript to create a visually appealing and interactive tree structure. Give the tree a dynamic design

I have been experimenting with CSS and JavaScript to create a dynamic graph based on a data table. You can view the graph that I need to replicate using CSS and JavaScript in this PDF. The example provided below showcases what I am attempting to achieve, a ...

javascriptjqueryhtmlcssjson

Arrange elements both at the beginning and the end of a line using FlexLayout in Angular

Using the Angular flexlayout library in angular 7/8, I am trying to align 4 buttons on the left side (flex-start) and two checkboxes on the right side (flex-end) at the same level. I would prefer to achieve this layout using the flexlayout Angular library. ...

htmlcssangularflexboxangular-material

prettyPhoto popup exceeds maximum width and height limitations

I am currently using the most up-to-date version from No Margin for Errors and I have set allow_resize to true. However, the size of the display is still too large. Is there a way to set a maximum width/height? I have already configured the viewport as fo ...

javascriptjqueryhtmlcssprettyphoto

Aligning table elements for optimal responsiveness

Need a hand with my HTML email code. I'm struggling to center the "resort boxes" when viewed on smaller screens like phones. Tried everything but can't crack it. Appreciate any help! <html> <head> <meta content="text/html; c ...

htmlcsshtml-email

Transferring image through email without the need for any additional application

Hello there, I am curious if it's possible to send pictures via email without invoking intent or using Intent.createChooser? ...

androidimageemailandroid-intent

Unique background image that perfectly aligns with the dimensions of a single full screen

Does anyone know how this webpage achieves the effect of having a full-screen background that ends when scrolling down? I have noticed that the picture of the desert always covers my entire browser screen but is not a typical full-screen background as it ...

htmlcssbackgroundbackground-image

How come the margin-bottom is displaying as the margin-top?

When I attempt to add margin-bottom on a div inside its parent, it seems to display as the parent's margin-top. Why is that? HTML: <div id="wrapper"> <div id="content"> <div id="box"></div> </div> </d ...

htmlcss

I'm attempting to make the button hover color transparent, but unfortunately, it's not having any effect

Check out the code snippet below. I'm attempting to adjust the button hover color to transparent. The div class is "button_container" while the button class is "btn". I made changes to the color initially, but it doesn't seem to be working. Any a ...

htmlcsswordpresshover

Importing an oversized image on an android device

Imagine having a picture that is made up of very large images or numerous sets of content. You may only be viewing small sections at a time, avoiding the need to load all the content into memory at once. In iOs, CATiledLayer can be used to draw tiles cont ...

androidiosimagelarge-data

Exploring Swift 3 capabilities: effortlessly showcase the JSON data stored within arrays

Facing a challenge while dealing with JSON data in Swift3. I have managed to retrieve all the data except for the street key-value pair which should be considered as an array or dictionary. Struggling to understand how to extract the data for this particu ...

iosjsonswift

Sorting results are not provided by Firebase when indexing on .value

My data structure is organized as follows: { "inbox_events": { "from_users": { "uid1": { "uid2": 1501337181, "uid3": 1501337183, "uid4": 1501337179 }, "uid2" : { "uid6": 1 ...

iosfirebasefirebase-realtime-database

An Android App for Easily Adding Up Two Numbers Together

I'm facing an issue with my Java program on Android that is designed to calculate the sum of two numbers. The application starts running but crashes when I attempt to hit the Calculate button. This happens to be my first experience working with Java f ...

javaandroid

Designing personalized sass components

Seeking advice on developing a custom CSS unit that can be utilized in Sass with Node.js. Is there a tutorial available for creating a Sass plugin specifically for this purpose? For instance, I am looking to establish a unit called "dpx" which functions as ...

cssnode.jswebpacksass

Various lists do not appear directly under each other

Hello everyone, I recently created a webpage displaying different lists of football players. My goal is to keep the lists stacked vertically without any floats that would make them appear side by side. The separate lists are essential for properly categori ...

htmlcsslistcss-floathtml-lists

Images in the JavaScript menu are not remaining fixed in place

Can someone help me with my website? I'm having trouble with the menu for different pages, it should stay gray for the active page. It was working fine before I switched to Wordpress, but now I'm not sure what the issue is. Could someone take a ...

javascripthtmlcsswordpress

Creating a Faux Font-Icon Effect Using CSS and PNG

I am looking for a way to change the color of a transparent, grey-scale PNG icon as easily as changing the color of a font icon. More details: The PNG icons have both outer transparencies and inner white areas for the actual symbol, along with a slight gr ...

csspngfont-facemask

Resizing bitmap with ImageView to fit custom dimensions

My Bitmap is too large for the ImageView it is being placed in, with ScaleType set to center_inside. How can I determine the dimensions of the scaled-down image? ...

androidbitmapimageview

Display an HTML checkbox with intricate design features

I have a simple question - how can I print a green checkbox with a white check mark (Ctrl + P) without it turning black and white? This solution currently works with Bootstrap 4.0.0, but needs to be compatible with bootstrap 3.3.7. I've managed to cr ...

htmlcss

How can I align Javascript output vertically in the middle?

I am currently facing an issue with a JavaScript clock displaying in a narrow frame: <!DOCTYPE html> <HTML> <HEAD> <TITLE>Untitled</TITLE> <SCRIPT> function checkTime(i) { if (i < 10) { ...

javascripthtmlcssvertical-alignment

Use of absolute positioning resulted in the disappearance of the element

Can anyone assist with resolving the issue I am encountering? I currently have three nested divs as follows: <div class="section"> <div class="parent"> <div class="child"> Some random text. </div> </div> </div> To adj ...

javascripthtmlcss