+ Start a Discussion

Unable to Open excel(.xls) file on mobile and how to make floating table headers on visualforce page

Hi there,

I am having 2 questions 
1) I have developed an excel workbook with different tabs  using visual force page  by using below api

<apex:page contentType="txt/xml#report.xls">
<Workbook xmlns="urn:schemas-microsoft-com:office:spreadsheet" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns:ss="urn:schemas-microsoft-com:office:spreadsheet" xmlns:html="http://www.w3.org/TR/REC-html40">
<Worksheet ss:Name="Summary"> <Table border="0" ss:StyleID="background" x:FullColumns="1" x:FullRows="1">
<Row ss:Height="25" ss:StyleID="background"> <Cell><Data ss:Type="String">&nbsp;</Data></Cell>
<Cell ss:StyleID="TableColHeader" ><Data ss:Type="String">Test1</Data></Cell>
<Cell ss:StyleID="TableColHeader" ><Data ss:Type="String">Test2 </Data></Cell>
I am able to generate but when I am trying to open it on mobile it is not opening. 
Can any one please let me know how can we open .xls file on mobile.

2)  On visualforce page I am having very long tables. when the users scroll down they want headers need to scroll down(float) .

I was doing google but didn't find  proper code sample with steps. everyone was saying use Jquery . but which version of Jquery and what are other steps.

Can any one please let me know  steps or sample code  how to do floating  table headers on visualforce page.

Thank you,

On Item#2 - I do a <div> that is fixed for the headers.
<div style="position:fixed;height:30px;width:1125px;text-align:left;font-size:8pt;font-weight:900;background-color:#EAEAEA;cellspacing:0 1 0 0;border:1px solid black;">
                        <div style="float:left;height:25px;width:300px;padding:5px 0 0 5px;border-right:2px solid white;">Col1</div>
                        <div style="float:left;height:25px;width:100px;padding:5px 0 0 5px;border-right:2px solid white;">Col2</div>
                        <div style="float:left;height:25px;width:40px;padding:5px 0 0 5px;border-right:2px solid white;">Col3</div>
                        <div style="float:left;height:25px;width:75px;padding:5px 0 0 5px;border-right:2px solid white;">Col4</div>
                        <div style="float:left;height:25px;width:102px;padding:5px 0 0 5px;border-right:2px solid white;">Col5</div>
                        <div style="float:left;height:25px;width:47px;padding:2px 0 0 2px;border-right:2px solid white;">Col6</div>
                        <div style="float:left;height:25px;width:47px;padding:5px 0 0 5px;border-right:2px solid white;">Col7</div>
                        <div style="float:left;height:25px;width:47px;padding:5px 0 0 2px;border-right:2px solid white;">Col8</div>
                        <div style="float:left;height:25px;width:130px;padding:5px 0 0 5px;border-right:2px solid white;">Col9</div>
                        <div style="float:left;height:25px;width:40px;padding:5px 0 0 5px;border-right:2px solid white;">Col10</div>                      

Then just a normal table below it.  You'll need to fix all of the column width and stuff like that.