# View Controller Manu showing at the bottom of PDF insted of under the menu parent

**URL:** <https://pdfjs.community/t/view-controller-manu-showing-at-the-bottom-of-pdf-insted-of-under-the-menu-parent/2558>\
**Category:** Technical Support\
**Created:** [May 2, 2023, 6:14am UTC](https://pdfjs.community/t/view-controller-manu-showing-at-the-bottom-of-pdf-insted-of-under-the-menu-parent/2558 "2023-05-02T06:14:39Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![mehul](https://avatars.discourse-cdn.com/v4/letter/m/e8c25b/32.png) [@mehul](https://pdfjs.community/u/mehul)\
**Post date:** [May 2, 2023, 6:14am UTC](https://pdfjs.community/t/view-controller-manu-showing-at-the-bottom-of-pdf-insted-of-under-the-menu-parent/2558/1 "2023-05-02T06:14:39Z")

</div>

**Which product are you using?**  
PDF.js Express Viewer

**PDF.js Express Version**

| UI version | ‘8.7.0’ |
| --- | --- |
| Core version | ‘8.7.2’ |
| webviewer.min.js | ‘8.7.2’ |
| Build | ‘My8zMC8yMDIzfDRjYmI5MWQ4OGI=’ |
| WebViewer Server | false |
| Full API | false |

**Detailed description of issue**  
I have implemented the FREE version of your application,  
The issue I face is that when I open the view Controller menu it was showing at the bottom of the page instead of the under the menu item.

**Expected behaviour**

 ![image](https://canada1.discourse-cdn.com/flex031/uploads/pdfjscommunity/original/2X/1/1f8e74e94a55f6c2d8d743ce94f98c5a0346e987.png)

**Does your issue happen with every document, or just one?**  
All documents

**Link to document**  
It was the demo PDF as shown in the DEMO of your application.

**Code snippet**

```
function loadPDFToolsInModal(pdf_url, dir = 0, angle = 0) {

// Remove any existing WebViewer instance from the viewer element
$('#pdfkit').empty();

// Create a new element for the WebViewer instance
const viewerElement = $('<div style="height: 100%;width:100%;">').appendTo('#pdfkit');

// Load WebViewer on the new element
WebViewer({
	path: '{{ asset(config('app.public_prefix').'assets/PDFJSExpress-view-only/lib') }}',
	licenseKey: 'rw2fu **************',
	initialDoc: pdf_url,
}, viewerElement[0])
.then(instance => {
	// now you can access APIs through the WebViewer instance
	const { Core, UI } = instance;

	// adding an event listener for when a document is loaded
	Core.documentViewer.addEventListener('documentLoaded', () => {
		console.log('document loaded');
	});

	// adding an event listener for when the page number has changed
	Core.documentViewer.addEventListener('pageNumberUpdated', (pageNumber) => {
		console.log(`Page number is: ${pageNumber}`);
	});
});
}

```

---

<div class="post-metadata">

**Author:** ![tgordon](https://avatars.discourse-cdn.com/v4/letter/t/aca169/32.png) [@tgordon](https://pdfjs.community/u/tgordon)\
**Post date:** [May 2, 2023, 9:10pm UTC](https://pdfjs.community/t/view-controller-manu-showing-at-the-bottom-of-pdf-insted-of-under-the-menu-parent/2558/3 "2023-05-02T21:10:15Z")

</div>

Hello mehul,

This is actually an intended feature for mobile sized widths, to get around this you can use:

```javascript
instance.UI.enableDesktopOnlyMode()

```

Best regards,  
Tyler