Allow scroll of the canvas if the device height exceeds the available height
Just add style overflow: auto to .gjs-cv-canvas__frames
Read full answer below βQuestion
Given the following code example...
editor.DeviceManager.add('test', '300px', {
height: '1000px',
widthMedia: '300px',
});
editor.setDevice("test");
Results in no ability to scroll to top of canvas if editor display area is less than specified height of the device.
See Fiddle for demonstration...
Answers (3)
Just add style overflow: auto to .gjs-cv-canvas__frames
After exploring a bit more about this issue I'd suggest just not to exceed the canvas height with the device one. Unfortunately, currently, making any part of the canvas scrollable (solution suggested by @TheDiamondKing ) will lead to unexpected behaviors. I'm working on the frame and canvas refact...
@artf Is your comment still true? Does adding overflow: auto (especially in a "designer mode" / "absolute mode" canvas) still cause problems?
Related Questions and Answers
Continue research with similar issue discussions.
Issue #2207
[BUG]: Can't drag component if there is some space on top/left with Mode Absolute
Given the following code example... Results in no ability to drag and drop elements to correct position using drag icon on the panel. See F...
Issue #3575
grapes.min.js:2 Uncaught TypeError: Cannot read property 'length' of undefined
I got this error when add the <iframe src="https://app.conversiobot.com/boot/fvMEvO" width="100%" height="500" frameBorder="0" allow="geolo...
Issue #2122
[Question] Adding script to content with chart js
Hello I am trying to add a Graph JS block with this code but whenever I would drag the new block I would get an error: How do I add a scrip...
Issue #3722
Want to Add fixed sized height of canvas
I'm using it for making dynamic PDF content. Wanted to fixed the height of canvas so user can't add more blocks from given size (height). I...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins βPremium plugins ship with support, regular updates, and production-ready features β save days of integration work.
Browse premium plugins βBrowse Plugin Categories
Jump directly to plugin category pages on the marketplace.