autosize icon indicating copy to clipboard operation
autosize copied to clipboard

autosize on ID element

Open tombit-sro opened this issue 4 years ago • 3 comments

It is possible to apply autosize to element ID. Trying autosize ($ ('#data-div'));

HTML:

...

Thank you

tombit-sro avatar Mar 17 '20 10:03 tombit-sro

@tombit-sro Yeah, you should be able to pass autosize any DOM element, or an Array or Array-like-object of nodes, which includes jQuery objects. For example:

autosize(document.getElementById("data-div"))
// or
autosize(document.querySelector("#data-div"))
// or
autosize($("#data-div"))
// or
$("#data-div").each(function(){
    autosize(this)
})
// or
autosize(document.querySelectorAll("#data-div"))

So if the code you posted is not working for you, the first thing I would check is that #data-div exists in the DOM at the time you try to assign autosize.

jackmoore avatar Mar 17 '20 16:03 jackmoore

I'm trying to use your autosize.js with emoji-picker(https://github.com/OneSignal/emoji-picker) and unfortunately I can't. I try it through css class, element ID, but I can't Thank you

tombit-sro avatar Mar 17 '20 18:03 tombit-sro

@tombit-sro I had a look at that demo and it looks like they are hiding the textarea element and visually replacing it with a div. Autosize only works with textarea elements, but applying it to the hidden textarea element probably has no effect on the emoji-picker.

However, hacky workaroundarounds like Autosize aren't needed for divs, their default behavior is to expand to fit content without overflowing. I looked at the demo and see they are setting a height and max-height for their div, it make it seem like a textarea, where you actually want it to behave like a div.

I can't really help you from here on out, but, as a suggestion, try adding the following lines to your stylesheet:

.emoji-wysiwyg-editor {
height: auto !important;
max-height: auto !important;
}

jackmoore avatar Mar 17 '20 18:03 jackmoore