Dragging items do not position on intital drag?
Question
So when I drag a component/item from the bar to the center it will not go where I told it to go... IT always goes about 20% page width to one side? Once added it's adjustable. See this gif: https://gyazo.com/87076de55a1853e80b5dd7ea14ccb94e
Does anyone have any suggestions?
Answers (3)
Hi @tonypartridge
Do you have the last GrapesJS version?
This is working fine for me with the dragMode: "absolute",
Check this basic code below:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>GrapesJS</title>
<link href="https://unpkg.com/grapesjs/dist/css/grapes.min.css" rel="stylesheet">
<script src="https://unpkg.com/grapesjs"></script>
<style>
body,
html {
height: 100%;
margin: 0;
}
</style>
</head>
<body>
<div id="gjs" style="height:0px; overflow:hidden"></div>
<script type="text/javascript">
var editor = grapesjs.init({
height: '100%',
dragMode: "absolute",
noticeOnUnload: 0,
storageManager: {
autoload: 0
},
container: '#gjs',
fromElement: true,
plugins: [],
pluginsOpts: {}
});
editor.BlockManager.add('test-block', {
label: 'Div',
attributes: {
class: 'gjs-fonts gjs-f-b1',
},
content: `<div class="test">This is a simple div</div>
<style>
.test {
width: 200px;
height: 30px;
text-align: center;
background-color: lightgrey;
}
</style>`,
});
</script>
</body>
</html>
yeah... I can actually reproduce the same issue when a smaller device view is enabled, probably some kind of regression. I need time to investigate but at the moment I'm kind of busy with other stuff and dragMode is not my priority right now. So, I hope someone else could look at this
I have the same issue when I'm using the absolute drag mode. Blocks always fall out of the canvas and I need to scroll to grab them and place them back into the original desired position. @tonypartridge Did you figure out any way to fix this?
Related Questions and Answers
Continue research with similar issue discussions.
Issue #3267
BUG: Cannot set 0px box shadow blur
For some reason, the editor does not allow to set the blur to 0px. 0 always magically turns into 5px. <img width="243" alt="Screenshot 2021...
Issue #2656
[BUG] Wrong position of toolbar when duplicate children component
Hi, you can check this example: https://codepen.io/abozhinov/pen/XWbqjEJ Steps to reproduce the problem:If components existing delete them...
Issue #3547
BUG: Dragging multiple blocks reverses the order
Version: 0.17.4 Are you able to reproduce the bug from the demo? YES What is the expected behavior? When dragging the blocks, the order sho...
Issue #1224
[Bug] Media query and classes rendering issue
Hi, I was trying to make a responsive layout but I discovered that the device switcher does not work consistently. The issue can be replica...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.