Skip to content

Commit b2019b8

Browse files
SyncfusionBuildSyncfusionBuild
authored
Merge pull request #3181 from Syncfusion-Content/hotfix/hotfix-v26.1.35
DOCINFRA-2341_merged_using_automation
2 parents d1472db + c06212a commit b2019b8

File tree

4 files changed

+124
-0
lines changed

4 files changed

+124
-0
lines changed

‎ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/how-to/restricting-zoom-in-mobile-mode.md

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
---
2+
layout: post
3+
title: Restrict Zoom Percentage in EJ2 ASP.NET MVC PDF Viewer | Syncfusion
4+
description: Learn here all how to restrict zoom percentage in ASP.NET MVC PDF Viewer component of Syncfusion Essential JS 2 and more.
5+
platform: ej2-asp-core-mvc
6+
control: PDF Viewer
7+
publishingplatform: ##Platform_Name##
8+
documentation: ug
9+
---
10+
11+
# How to Restrict Zoom Percentage on Mobile Devices
12+
13+
In Syncfusion PDF Viewer, you can easily restrict the zoom percentage on mobile devices using the **maxZoom** and **minZoom** property. This feature allows you to set specific limits for zooming, ensuring smoother scrolling performance and efficient document loading, on mobile devices.
14+
15+
{% tabs %}
16+
{% highlight html tabtitle="Standalone" %}
17+
18+
<div style="width:100%;height:600px">
19+
@Html.EJS().PdfViewer("pdfviewer").DocumentLoad("documentLoad").DocumentPath("https://cdn.syncfusion.com/content/pdf/hive-succinctly.pdf").Render()
20+
</div>
21+
22+
<script>
23+
function documentLoad() {
24+
var viewer = document.getElementById('pdfviewer').ej2_instances[0];
25+
if (ej2_base_1.Browser.isDevice && !viewer.enableDesktopMode) {
26+
viewer.maxZoom = 200;
27+
viewer.minZoom = 10;
28+
}
29+
else {
30+
viewer.zoomMode = 'Default';
31+
}
32+
}
33+
</script>
34+
35+
{% endhighlight %}
36+
{% highlight html tabtitle="Server-Backed" %}
37+
38+
<div style="width:100%;height:600px">
39+
@Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/api/PdfViewer/")).DocumentLoad("documentLoad").DocumentPath("https://cdn.syncfusion.com/content/pdf/hive-succinctly.pdf").Render()
40+
</div>
41+
42+
<script>
43+
function documentLoad() {
44+
var viewer = document.getElementById('pdfviewer').ej2_instances[0];
45+
if (ej2_base_1.Browser.isDevice && !viewer.enableDesktopMode) {
46+
viewer.maxZoom = 200;
47+
viewer.minZoom = 10;
48+
}
49+
else {
50+
viewer.zoomMode = 'Default';
51+
}
52+
}
53+
</script>
54+
{% endhighlight %}
55+
{% endtabs %}
56+
57+
By implementing this, you ensure that the maximum zoom percentage on mobile devices is limited to 200% and the minimum zoom percentage is set to 10%. This prevents performance issues that may arise from excessive zooming on mobile platforms.

‎ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/how-to/restricting-zoom-in-mobile-mode.md

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
---
2+
layout: post
3+
title: Restrict Zoom Percentage in ##Platform_Name## PDF Viewer Component| Syncfusion
4+
description: Learn here all about how to restrict zoom percentage in Syncfusion ##Platform_Name## PDF Viewer component of Syncfusion Essential JS 2 and more.
5+
platform: ej2-asp-core-mvc
6+
control: PDF Viewer
7+
publishingplatform: ##Platform_Name##
8+
documentation: ug
9+
---
10+
11+
# How to Restrict Zoom Percentage on Mobile Devices
12+
13+
In Syncfusion PDF Viewer, you can easily restrict the zoom percentage on mobile devices using the **maxZoom** and **minZoom** property. This feature allows you to set specific limits for zooming, ensuring smoother scrolling performance and efficient document loading, on mobile devices.
14+
15+
{% tabs %}
16+
{% highlight html tabtitle="Standalone" %}
17+
18+
<div style="width:100%;height:600px">
19+
<ejs-pdfviewer id="pdfviewer"
20+
style="height:600px"
21+
documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf">
22+
</ejs-pdfviewer>
23+
</div>
24+
25+
<script>
26+
function documentLoad() {
27+
var viewer = document.getElementById('pdfviewer').ej2_instances[0];
28+
if (ej2_base_1.Browser.isDevice && !viewer.enableDesktopMode) {
29+
viewer.maxZoom = 200;
30+
viewer.minZoom = 10;
31+
}
32+
else {
33+
viewer.zoomMode = 'Default';
34+
}
35+
}
36+
</script>
37+
38+
{% endhighlight %}
39+
{% highlight html tabtitle="Server-Backed" %}
40+
41+
<div style="width:100%;height:600px">
42+
<ejs-pdfviewer id="pdfviewer"
43+
style="height:600px"
44+
serviceUrl="/api/PdfViewer"
45+
documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf">
46+
</ejs-pdfviewer>
47+
</div>
48+
49+
<script>
50+
function documentLoad() {
51+
var viewer = document.getElementById('pdfviewer').ej2_instances[0];
52+
if (ej2_base_1.Browser.isDevice && !viewer.enableDesktopMode) {
53+
viewer.maxZoom = 200;
54+
viewer.minZoom = 10;
55+
}
56+
else {
57+
viewer.zoomMode = 'Default';
58+
}
59+
}
60+
</script>
61+
62+
{% endhighlight %}
63+
{% endtabs %}
64+
65+
By implementing this, you ensure that the maximum zoom percentage on mobile devices is limited to 200% and the minimum zoom percentage is set to 10%. This prevents performance issues that may arise from excessive zooming on mobile platforms.

‎ej2-asp-core-toc.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1904,6 +1904,7 @@
19041904
<li><a href="/ej2-asp-core/pdfviewer/how-to/signatureselect-signatureunselect">SignatureSelect and SignatureUnselect event</a></li>
19051905
<li><a href="/ej2-asp-core/pdfviewer/how-to/download-start-event">Controlling File Downloads</a></li>
19061906
<li><a href="/ej2-asp-core/pdfviewer/how-to/min-max-zoom">Minimum and Maximum Zoom Properties</a></li>
1907+
<li><a href="/ej2-asp-core/pdfviewer/how-to/restricting-zoom-in-mobile-mode">Restrict Zoom Percentage on Mobile Devices</a></li>
19071908
</ul>
19081909
</li>
19091910
<li>Troubleshooting

‎ej2-asp-mvc-toc.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1864,6 +1864,7 @@
18641864
<li><a href="/ej2-asp-mvc/pdfviewer/how-to/signatureselect-signatureunselect">SignatureSelect and SignatureUnselect event</a></li>
18651865
<li><a href="/ej2-asp-mvc/pdfviewer/how-to/download-start-event">Controlling File Downloads</a></li>
18661866
<li><a href="/ej2-asp-mvc/pdfviewer/how-to/min-max-zoom">Minimum and Maximum Zoom Properties</a></li>
1867+
<li><a href="/ej2-asp-mvc/pdfviewer/how-to/restricting-zoom-in-mobile-mode">Restrict Zoom Percentage on Mobile Devices</a></li>
18671868
</ul>
18681869
</li>
18691870
<li>Troubleshooting

0 commit comments

Comments
 (0)