Prevents horizontal scroll

[firedev]

I have replaced elastic plugin with this one and then found horizontal scroll on the site caused by a hidden <textarea>, fixed by moving it further to the left.

[jackmoore]

Thanks for the pull request, but you'll have to demonstrate the problem for me to be able to merge this. If this is really causing an issue then a different solution will have to be found because your commit causes exactly the problem you describe for sites that use direction:rtl.

[jackmoore]

Maybe your textarea element is wider than the document.

[firedev]

Good point let me check.

[firedev]

What about this then?

[jackmoore]

Thanks

[jackmoore]

Sorry, had to revert the change made here because it break things under IE8 (didn't test other IEs).

[jackmoore]

You can still implement your direction:rtl change locally by attaching it to the mirrored elements class selector:

.autosizejs { direction: rtl; }

[firedev]

Sorry, beaks how exactly? I have checked in IE and everything is fine. Also I am not changing direction, I just had invisible textarea wider than the document (probably because of box-sizing)

[jackmoore]

#69

I also tested it in IE8 native on XP. Autosize was just off. Starts off the wrong size, enlarges at the wrong time, shrinks randomly. Just a mess in IE8, non-emulated. My mistake about the ltr text, I misremembered that being your original fix instead of moving it left. You could still set the width in the CSS, or change the left position:

.autosize { left:-999px !important; /* or width:0; */}

!important has a higher specificity than the inline style.

[firedev]

Ok fair enough. However width: 0 is exactly what I have added. Plus there is no class on the <textarea>. And it gets even worse when I try to target it in CSS.

[onokazu]

I had the exact same issue and the only way to prevent this is to manually add width:0 to the javascript source file.
The autosize method is called like below in my app:

$('textarea', context).autosize();

The problem is that an empty textarea element is always appended to the body tag even when there is no textarea present in the page. And there is no way to fix this via css as you said since there is no class in that textarea element. Should we call the autosize() method only when there is a textarea element in the current page? Or can you fix your code so that the textarea element is appended to the body tag only when there is at least one textarea in the page, something like below:

if (!this.length) return;

[onokazu]

Anything on this issue?

[jackmoore]

Setting the width to zero may no longer be necessary. Another user pointed out that they were using a size of 100% on textareas, but padding caused it to be greater than 100%. A recent commit set padding is explicitly to 0 for the mirror element (that may resolve your horizontal scroll issue). However, I will add your line for quicker failure.

[jackmoore]

Done:

autosize/jquery.autosize.js

Line 53 in 1baef2a

if (!this.length) {