mirror of
https://github.com/ONLYOFFICE/web-apps.git
synced 2026-07-25 03:43:08 +08:00
58 lines
4.3 KiB
HTML
58 lines
4.3 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<title>View Settings and Navigation Tools</title>
|
||
<meta charset="utf-8" />
|
||
<meta name="description" content="The description of view settings and navigation tools such as zoom, previous/next page buttons" />
|
||
<link type="text/css" rel="stylesheet" href="../../../../../../common/main/resources/help/editor.css" />
|
||
<link type="text/css" rel="stylesheet" href="../../images/sprite.css" />
|
||
<script type="text/javascript" src="../callback.js"></script>
|
||
<script type="text/javascript" src="../../../../../../common/main/resources/help/search/js/page-search.js"></script>
|
||
</head>
|
||
<body>
|
||
<div class="mainpart">
|
||
<div class="search-field">
|
||
<input id="search" class="searchBar" placeholder="Search" type="text" onkeypress="doSearch(event)">
|
||
</div>
|
||
<h1>View Settings and Navigation Tools</h1>
|
||
<p>The <!--<a href="https://www.onlyoffice.com/en/document-editor.aspx" target="_blank" onclick="onhyperlinkclick(this)">--><b>Diagram Viewer</b><!--</a>--> offers several tools to help you view and navigate your diagram: zoom, set the interface theme, etc.</p>
|
||
<h3>Adjust the view settings</h3>
|
||
<p>
|
||
To adjust default view settings and set the most convenient mode to work with the diagram, go to the <b>View</b> tab and select which interface elements you want to be hidden or shown.
|
||
You can select the following options on the <b>View</b> tab:
|
||
</p>
|
||
<ul>
|
||
<li><b>Zoom</b> – to set the required zoom value from 50% to 500% from the drop-down list.</li>
|
||
<li><b>Fit to Page</b> - to fit the whole diagram page to the visible part of the working area.</li>
|
||
<li><b>Fit to Width</b> - to fit the diagram page width to the visible part of the working area.</li>
|
||
<li><b>Interface Theme</b> – choose one of the available interface themes from the drop-down menu: <em>Same as system</em>, <em>Light</em>, <em>Classic Light</em>, <em>Dark</em>, <em>Contrast Dark</em>, <em>Gray</em>.</li>
|
||
<li>
|
||
<b>Always Show Toolbar</b> – when this option is disabled, the top toolbar that contains commands will be hidden while tab names remain visible.
|
||
<p class="note">Alternatively, you can just double-click any tab to hide the top toolbar or display it again.</p>
|
||
</li>
|
||
<li><b>Status Bar</b> – when this option is disabled, the bottommost bar where the <b>Zoom</b>, <b>Fit to page</b>, <b>Fit to width</b> buttons are situated will be hidden. To show the hidden <b>Status Bar</b>, enable this option.</li>
|
||
<li><b>Left Panel</b> - when disabled, hides the left panel where <b>Chat</b>, <b>About</b>, etc. buttons are located. To show the left panel, check this box.</li>
|
||
</ul>
|
||
<p>
|
||
When the <b>Chat</b> panel is opened, the width of the left sidebar is adjusted by simple drag-and-drop:
|
||
move the mouse cursor over the left sidebar border so that it turns into the bidirectional arrow and drag the border to the right to extend the width of the sidebar. To restore its original width, move the border to the left.
|
||
</p>
|
||
<h3 id="navigationtools">Use the Navigation Tools</h3>
|
||
<h4>Navigating pages</h4>
|
||
<p>The page navigation buttons are located at the bottom of the screen.</p>
|
||
<ul>
|
||
<li><div class="icon icon-nextpage"></div> - go to the next page of the diagram file.</li>
|
||
<li><div class="icon icon-previouspage"></div> - go to the previous page of the diagram file.</li>
|
||
</ul>
|
||
<h4>Zoom</h4>
|
||
<p>The <b>Zoom</b> buttons are situated in the right lower corner and are used to zoom in and out of the current diagram.</p>
|
||
<p>
|
||
To change the currently selected zoom value that is displayed in percent, click it and select one of the available zoom options from the list (50% / 75% / 100% / 125% / 150% / 175% / 200% / 300% / 400% / 500%)
|
||
or use the <b>Zoom in</b> <span class="icon icon-zoomin"></span> or <b>Zoom out</b> <span class="icon icon-zoomout"></span> buttons. The set scaling is maintained for all files during the current session.
|
||
</p>
|
||
<p>Click the <b>Fit to width</b> <span class="icon icon-fitwidth"></span> icon to fit the document page width to the visible part of the working area.</p>
|
||
<p>To fit the whole document page to the visible part of the working area, click the <b>Fit to page</b> <span class="icon icon-fitpage"></span> icon.</p>
|
||
<p>Zoom settings are also available on the <a href="../ProgramInterface/ViewTab.htm" onclick="onhyperlinkclick(this)">View</a> tab.</p>
|
||
</div>
|
||
</body>
|
||
</html> |