+ Start a Discussion
sfdc@isha.ax1814sfdc@isha.ax1814 

scroll bar is not working in mobile in vfpage

HI team,


I have my below vfpage . which is working on both lighting and classic with mobile. but in mobile scroll bar is not working kindly any help on this.


<apex:page standardController="Account" tabStyle="Account">
 <!--<apex:includeLightning />-->
 <apex:slds >
   <apex:iframe src="" scrolling="true" height="650px" id="NPXAccountChartFrame"/>
  

   <!--if you embed mutiple chart add some index to id-->
   <script>
    document.getElementById("NPXAccountChartFrame").style.overflow:auto; 
   
    var embeddedLink = '{!$Setup.SFDC_URL__c.NPX_Account_View_Embed__c}';
    var embedChartUrl = '/main/embed?'+embeddedLink;//this need to change as per chart/view embed link
    //var enterpriseIdfier = 'SMXCONNECTORS';//this need to change as per enterprise
    var enterpriseIdfier = 'RASMITHA';//this need to change as per enterprise
    console.log('Account.Id = {!Account.Id}');
    var smxServer = '{!$Setup.SMX_URL__c.SMX_URL__c}'; 
    var varSessionID = '{!$Api.Session_ID}';
    var saleforceServer = '{!$Setup.SFDC_URL__c.SFDC_URL__c}';
    var varOwner = '{!$User.Id}';
    var varUsername = '{!$User.Username}';
    embedChartUrl = embedChartUrl + '&urlParams={"INTEGRATION_COMPANY_CODE":"{!Account.Id}"}';
    
    var url = smxServer + '/app/core/j_satmetrix_security_check?session='+ varSessionID + '&server="'+saleforceServer+'"&owner='+varOwner+'&username='+varUsername+'&version=3&enterpriseIdfier='+enterpriseIdfier+'&requestTokenType=SALES_FORCE&requestToken=NONE&targetUrl='+embedChartUrl;
    
    document.getElementById('NPXAccountChartFrame').src = url;
    
    <!--if you embed mutiple chart add some index to id-->
   </script>
    </apex:slds>   
</apex:page>


Regards,
Isha
Khan AnasKhan Anas (Salesforce Developers) 
Hi,

Greetings to you!

The mobile browsers have issues when you have horizontal and vertical scrolling in iframes on mobile. Please refer to the below links which might help you further with the above issue.

https://gist.github.com/msrivastav13/c84d835d13574d8403f0

https://salesforce.stackexchange.com/questions/25276/visualforce-page-will-not-scroll-on-salesforce1-app

I hope it helps you.

Kindly let me know if it helps you and close your query by marking it as solved so that it can help others in the future. It will help to keep this community clean.

Thanks and Regards,
Khan Anas
sfdc@isha.ax1814sfdc@isha.ax1814
Hi Khan,

Thanksfor the reply.

my X-axis scrol bar is not working in mobile.Please help me 


User-added image

My code:

<apex:page standardController="Account" tabStyle="Account">
 <!--<apex:includeLightning />-->
 <apex:slds >
  
   <apex:iframe src="" scrolling="true" height="650px" id="NPXAccountChartFrame"/>
  
   <!--if you embed mutiple chart add some index to id-->
   <script type="text/javascript">
    
  
    var embeddedLink = '{!$Setup.SFDC_URL__c.NPX_Account_View_Embed__c}';
    var embedChartUrl = '/main/embed?'+embeddedLink;//this need to change as per chart/view embed link
    //var enterpriseIdfier = 'SMXCONNECTORS';//this need to change as per enterprise
    var enterpriseIdfier = 'RASMITHA';//this need to change as per enterprise
    console.log('Account.Id = {!Account.Id}');
    var smxServer = '{!$Setup.SMX_URL__c.SMX_URL__c}'; 
    var varSessionID = '{!$Api.Session_ID}';
    var saleforceServer = '{!$Setup.SFDC_URL__c.SFDC_URL__c}';
    var varOwner = '{!$User.Id}';
    var varUsername = '{!$User.Username}';
    embedChartUrl = embedChartUrl + '&urlParams={"INTEGRATION_COMPANY_CODE":"{!Account.Id}"}';
    
    var url = smxServer + '/app/core/j_satmetrix_security_check?session='+ varSessionID + '&server="'+saleforceServer+'"&owner='+varOwner+'&username='+varUsername+'&version=3&enterpriseIdfier='+enterpriseIdfier+'&requestTokenType=SALES_FORCE&requestToken=NONE&targetUrl='+embedChartUrl;
   
    document.getElementById('NPXAccountChartFrame').src = url;
    
 (function() {
        try {
            var a = navigator.userAgent;
            if ((a.indexOf('Salesforce') != -1) && (a.indexOf('iPhone') != -1 || a.indexOf('iPad') != -1) && (a.indexOf('OS/8') != -1 || a.indexOf('OS 8') != -1 || a.indexOf('OS/9') != -1 || a.indexOf('OS 9') != -1) && (a.indexOf('Safari') == -1)) {
                var s = document.createElement('style');
                if (a.indexOf('OS/8') != -1 || a.indexOf('OS 8') != -1) {
                    s.innerHTML = "html,html body{overflow: auto;-webkit-overflow-scrolling:touch;}body{position:absolute;left:0;right:0;top:0;bottom:0;}";
                } else if (a.indexOf('OS/9') != -1 || a.indexOf('OS 9') != -1) {
                    s.innerHTML = "html,html body{overflow: auto;-webkit-overflow-scrolling:auto;}body{position:absolute;left:0;right:0;top:0;bottom:0;}";
                }
                document.getElementsByTagName('NPXAccountChartFrame')[0].appendChild(s);
            }
        } catch (e) {}
    })();
    
    <!--if you embed mutiple chart add some index to id-->
   </script>
  
    </apex:slds>   
</apex:page>


Regards,
Isha