1

In html, we can use display:none, font-size:0, or visibility:hidden to hide text, is there a similar way in quill editor?

e.g., can set some op.attributes, then can hide text

James A Mohler
  • 11,060
  • 15
  • 46
  • 72
Jennifer Han
  • 31
  • 3

2 Answers2

2

Thanks for all your answers. I found a solution for that, 1)Register a attribute: const HideAttribute = new Parchment.Attributor.Attribute('hidden', 'hidden', config); Quill.register( HideAttribute, true); 2)For the text need to be hidden, in delta, op.attributes.hidden = true

Then the text for op.insert will be hidden

Thanks!

Jennifer Han
  • 31
  • 3
1

Inside de Quill container there is a div tag with the "ql-editor" class. You can target CSS to this class to change the visibility. The div tag is the parent element of all quill content, if you want to hide a portion of text you can target the children to hide. You can use jquery to.

CSS example to hide all the text:

.ql-editor{
    visibility:hidden;
}

CSS example to hide a specified line of the text:

.ql-editor p:nth-child(7){
    visibility:hidden;
}

Remember the differences in "visibility:hidden;" and "display:none;" What is the difference between visibility:hidden and display:none?