Free Support Forum - groupdocs.com

Change Viewer height/width base on screen size?


#1

Hi,

Trying to see if viewer div can change height and width base on different monitor screen.
I have 32 inches screen then a laptop 14 inches screen and mobile phone around 6 inches screen.

I am trying to make viewer look seamless across to take full size of screen, at chat your colleague helped me with the script but it seems not effective on mobile phone browser and tablets.

here is code



and here is div



any ideas?

Thanks,
LEE.


#2

Hello Lee,


We are sorry to hear that you have such issue. We have checked it with the mobile 5.5 inches and the Viewer was resized. Could you please check if you have enabled JavaScript on your mobile browsers. Also which browser you use on the mobile devices?

Will be helpful if you will share full code of the web page.

Thank you.

#3

Thank you for quick reply.

Here are 2 screen shots,

one taken from mobile and other from desktop.


#4

Hello Lee,


Thank you for the screenshots. Unfortunately with out your code we can’t reproduce this issue. Please share with us full code of the web page and if possible document example.

Also which OS on your mobile (Android, IOs etc.)?

Thank you.

#5

Hi,

using Andriod 4.4.4 Samsung Note 4.

Here is aspx file


<%@ Page Language=“C#” AutoEventWireup=“true” CodeBehind=“magVIEWER.aspx.cs” Inherits=“Personal_Magazine.magVIEWER” %>
<%@ Import Namespace=“Groupdocs.Web.UI” %>









<%=Viewer.CreateScriptLoadBlock().LoadJquery().LoadJqueryUi().UseHttpHandlers()%>





<%=Viewer.ClientCode()
.TargetElementSelector("#viewAREA")
.FilePath(this.Filename)
.OpenThumbnails(false)
.ShowThumbnails(true)
.PreloadPagesCount(2)
.UseHtmlBasedEngine(true, true)
.ZoomToFitWidth()
%>





Here is code behind

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace Personal_Magazine
{
public partial class magVIEWER : System.Web.UI.Page
{
public System.IO.Stream ByteStream = null;
public String Filename = null;
public String Extension = null;

protected void Page_Load(object sender, EventArgs e)
{
this.Filename = Request.QueryString[“MagID”].ToString();

}
}
}



web.config created by taking code from

http://groupdocs.com/docs/display/viewernet/How+to+use+GroupDocs.Viewer+for+.NET+in+an+ASP.NET+Project

and global.asax have only this function

protected void Application_Start(object sender, EventArgs e)
{
Groupdocs.Web.UI.Viewer.SetRootStoragePath(Server.MapPath("~/Magazines/"));
}


#6

Hello Lee,


Thank you for the code examples. We have checked it and reproduced not exactly the same but similar issue (the Viewer block was not stretched over the entire screen on the mobile) with your code. We have fixed it by changing “viewAREA” div style options to this:
style="width:970px; height:800px; margin-bottom:20px; background-color:gray;"

Please try with this options and notify us with the results.

Best regards