883856: How to Restrict Zoom Percentage on Mobile Devices

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

@@ -0,0 +1,57 @@
+---
+layout: post
+title: Restrict Zoom Percentage in EJ2 ASP.NET MVC PDF Viewer | Syncfusion
+description: Learn here all how to restrict zoom percentage in ASP.NET MVC PDF Viewer component of Syncfusion Essential JS 2 and more.
+platform: ej2-asp-core-mvc
+control: PDF Viewer
+publishingplatform: ##Platform_Name##
+documentation: ug
+---
+
+# How to Restrict Zoom Percentage on Mobile Devices
+
+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.
+
+{% tabs %}
+{% highlight html tabtitle="Standalone" %}
+
+<div style="width:100%;height:600px">
+    @Html.EJS().PdfViewer("pdfviewer").DocumentLoad("documentLoad").DocumentPath("https://cdn.syncfusion.com/content/pdf/hive-succinctly.pdf").Render()
+</div>
+
+<script>
+    function documentLoad() {
+        var viewer = document.getElementById('pdfviewer').ej2_instances[0];
+        if (ej2_base_1.Browser.isDevice && !viewer.enableDesktopMode) {
+            viewer.maxZoom = 200;
+            viewer.minZoom = 10;
+        }
+       else {
+            viewer.zoomMode = 'Default';
+        }
+    }
+</script>
+
+{% endhighlight %}
+{% highlight html tabtitle="Server-Backed" %}
+
+<div style="width:100%;height:600px">
+    @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/api/PdfViewer/")).DocumentLoad("documentLoad").DocumentPath("https://cdn.syncfusion.com/content/pdf/hive-succinctly.pdf").Render()
+</div>
+
+<script>
+    function documentLoad() {
+        var viewer = document.getElementById('pdfviewer').ej2_instances[0];
+        if (ej2_base_1.Browser.isDevice && !viewer.enableDesktopMode) {
+            viewer.maxZoom = 200;
+            viewer.minZoom = 10;
+        }
+       else {
+            viewer.zoomMode = 'Default';
+        }
+    }
+</script>
+{% endhighlight %}
+{% endtabs %}
+
+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

@@ -0,0 +1,65 @@
+---
+layout: post
+title: Restrict Zoom Percentage in ##Platform_Name## PDF Viewer Component| Syncfusion 
+description: Learn here all about how to restrict zoom percentage in Syncfusion ##Platform_Name## PDF Viewer component of Syncfusion Essential JS 2 and more.
+platform: ej2-asp-core-mvc
+control: PDF Viewer
+publishingplatform: ##Platform_Name##
+documentation: ug
+---
+
+# How to Restrict Zoom Percentage on Mobile Devices
+
+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.
+
+{% tabs %}
+{% highlight html tabtitle="Standalone" %}
+
+<div style="width:100%;height:600px">
+    <ejs-pdfviewer id="pdfviewer"
+                   style="height:600px"
+                   documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf">
+    </ejs-pdfviewer>
+</div>
+
+<script>
+    function documentLoad() {
+        var viewer = document.getElementById('pdfviewer').ej2_instances[0];
+        if (ej2_base_1.Browser.isDevice && !viewer.enableDesktopMode) {
+            viewer.maxZoom = 200;
+            viewer.minZoom = 10;
+        }
+       else {
+            viewer.zoomMode = 'Default';
+        }
+    }
+</script>
+
+{% endhighlight %}
+{% highlight html tabtitle="Server-Backed" %}
+
+<div style="width:100%;height:600px">
+    <ejs-pdfviewer id="pdfviewer"
+                   style="height:600px"
+                   serviceUrl="/api/PdfViewer"
+                   documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf">
+    </ejs-pdfviewer>
+</div>
+
+<script>
+    function documentLoad() {
+        var viewer = document.getElementById('pdfviewer').ej2_instances[0];
+        if (ej2_base_1.Browser.isDevice && !viewer.enableDesktopMode) {
+            viewer.maxZoom = 200;
+            viewer.minZoom = 10;
+        }
+       else {
+            viewer.zoomMode = 'Default';
+        }
+    }
+</script>
+
+{% endhighlight %}
+{% endtabs %}
+
+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

@@ -1903,6 +1903,7 @@
 		<li><a href="/ej2-asp-core/pdfviewer/how-to/signatureselect-signatureunselect">SignatureSelect and SignatureUnselect event</a></li>
 		<li><a href="/ej2-asp-core/pdfviewer/how-to/download-start-event">Controlling File Downloads</a></li>
 		<li><a href="/ej2-asp-core/pdfviewer/how-to/min-max-zoom">Minimum and Maximum Zoom Properties</a></li>
+    <li><a href="/ej2-asp-core/pdfviewer/how-to/restricting-zoom-in-mobile-mode">Restrict Zoom Percentage on Mobile Devices</a></li>
 		</ul>
 		</li>
 		<li>Troubleshooting

ej2-asp-mvc-toc.html

@@ -1863,6 +1863,7 @@
 		<li><a href="/ej2-asp-mvc/pdfviewer/how-to/signatureselect-signatureunselect">SignatureSelect and SignatureUnselect event</a></li>
 		<li><a href="/ej2-asp-mvc/pdfviewer/how-to/download-start-event">Controlling File Downloads</a></li>
 		<li><a href="/ej2-asp-mvc/pdfviewer/how-to/min-max-zoom">Minimum and Maximum Zoom Properties</a></li>
+    <li><a href="/ej2-asp-mvc/pdfviewer/how-to/restricting-zoom-in-mobile-mode">Restrict Zoom Percentage on Mobile Devices</a></li>
 		</ul>
 		</li>
 		<li>Troubleshooting