Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > How to force text re-render after padding change from javascript in Chrome?

Reply
Thread Tools

How to force text re-render after padding change from javascript in Chrome?

 
 
David Mark
Guest
Posts: n/a
 
      08-14-2010
On Aug 13, 11:37*am, williamc <te...@williamc.com> wrote:
> On 8/12/2010 8:17 PM, me wrote:
>
>
>
>
>
> >

>
> > [This is a Chrome-specific problem, but since their help forum is all
> > questions and
> > no answers, I thought I'd try and see if anyone here has any idea.]

>
> > When you change the left and right padding of a DIV from a javascript, you
> > would
> > expect the text elements inside it to be rendered and justified again;
> > indeed, this is
> > what IE and FF do; Chrome 5.0 however, does not. The text moves
> > horizontally,
> > but retains its width. (see the example below)

>
> > I have tried setting the right-padding before the left-padding, or setting
> > all four
> > padding values together, but to no avail. I could make an imperceptibly
> > small change
> > to the font size, but setting font size to 14.99px may have undesirable
> > side-effects.
> > Is there a better way to force Chrome to re-render the content of the DIV ?

>
> > Marc.

>
> > <HTML><BODY>
> > <DIV ID="MyContainer" STYLE="width: 360px; background-color: orange;">
> > <DIV ID="MyContent" STYLE="padding: 20px;" onclick="this.style.padding='20px
> > 60px';">
> > <H1>Dynamic Padding Test</H1>
> > <P>Click anywhere in this rectangle to change the left and right padding
> > from 20 to 60 pixels.</P>
> > </DIV></DIV>
> > </BODY></HTML>

>
> Don't know the answer to your question, but interestingly it's
> reproduced with...
>
> onclick="this.style.padding='20px 60px';this.style.width='240px';
>
> but not with...
>
> onclick="this.style.padding='20px 60px';this.style.width='239px';
>
> onclick="this.style.padding='20px 60px';this.style.width='241px';
>
> and other values which are *not* equal to the implicit width of your
> content. One of the ace browser scripters in here can no doubt tell you why.
>


No rational reason. Just a bug in Webkit that has been around for
years.
 
Reply With Quote
 
 
 
 
David Mark
Guest
Posts: n/a
 
      08-14-2010
On Aug 13, 5:25*pm, Ry Nohryb <jo...@jorgechamorro.com> wrote:
> On Aug 13, 10:43*pm, "Evertjan." <exjxw.hannivo...@interxnl.net>
> wrote:
>
>
>
> > Even better would be a DOM-command to refrain from re-rendering:

>
> > Window.render(false);

>
> > and one to start re-rendering [the default]:

>
> > Window.render(true);

>
> window.render= function render (a) {
> *if (a) {
> * if (!render.f) {
> * *render.f= setTimeout(function () {
> * * delete render.f;
> * * document.body.style.display= "";
> * *},0);
> * }
> *} else document.body.style.display= "none";
>
> }
>


Will you please stop posting examples that augment host objects? And
no, that's not a cue to start up with your "window is the global
object in browsers" nonsense.

Thanks!


 
Reply With Quote
 
 
 
 
me
Guest
Posts: n/a
 
      08-14-2010

"me" <> wrote in message
news:T1i9o.26318$Vv6.4616@hurricane...
> "Ry Nohryb" <> wrote in message
> news:e9bf2585-5c9d-41f4-9880-...
> On Aug 13, 2:17 am, "me" <m...@example.com> wrote:
>>> Is there a better way to force Chrome to re-render the content of the
>>> DIV ?

>>(...)To force a re-render, set its display to none momentarily, (...)
>>HTH,
>>--
>>Jorge.

>
> Thanks, I'll use that. I'll have a look and see whether I can have the
> script detect the bug, and only use the display trick when necessary.


Fortunately, the bug is easy to detect:

<HTML>
<HEAD>
<SCRIPT TYPE="text/javascript">
function changePadding(that) {
that.style.padding = "20px 60px";
if (document.getElementById("MyWidthCheck").offsetWid th > 260) {
alert("Text not adapted; forcing render...");
that.style.display = "none";
setTimeout(function() {that.style.display = "";}, 0);
}
}
</SCRIPT>
</HEAD>
<BODY>
<DIV ID="MyContainer" STYLE="width: 360px; background-color: orange;">
<DIV ID="MyContent" STYLE="padding: 20px;" onclick="changePadding(this);">
<H1>Dynamic Padding Test</H1>
<P ID="MyWidthCheck">Click anywhere in this rectangle to change the left and
right padding from 20 to 60 pixels.</P>
</DIV>
</DIV>
</BODY>
</HTML>


 
Reply With Quote
 
Ry Nohryb
Guest
Posts: n/a
 
      08-14-2010
On Aug 14, 2:26*am, David Mark <dmark.cins...@gmail.com> wrote:
> On Aug 13, 5:25*pm, Ry Nohryb <jo...@jorgechamorro.com> wrote:
>
> > window.render= function render (a) {
> > *if (a) {
> > * if (!render.f) {
> > * *render.f= setTimeout(function () {
> > * * delete render.f;
> > * * document.body.style.display= "";
> > * *},0);
> > * }
> > *} else document.body.style.display= "none";

>
> > }

>
> Will you please stop posting examples that augment host objects? *And
> no, that's not a cue to start up with your "window is the global
> object in browsers" nonsense.
>
> Thanks!


BTW. It's not only that that window isn't a host object: it's also
that augmenting DOM elements (which are host objects) is ok, yes, I'll
repeat it: again: it's *OK* to augment host objects: I *know* that it
can be done safely, 100% error-free, in all the browsers I've ever
done it, except in the most broken ones ever: Microsoft's IEs.

That's so because nothing prevents a host object to be a native object
too. And it seems to be the case that the clever minds @ Mozilla,
Opera and WebKit have made them so... so much for Microsoft, the
better and the biggest -until Apple outgrown it- software company in
the world.

David, David... get well !
--
Jorge.
 
Reply With Quote
 
David Mark
Guest
Posts: n/a
 
      08-14-2010
On Aug 14, 4:21*am, Ry Nohryb <jo...@jorgechamorro.com> wrote:
> On Aug 14, 2:26*am, David Mark <dmark.cins...@gmail.com> wrote:
>
>
>
>
>
> > On Aug 13, 5:25*pm, Ry Nohryb <jo...@jorgechamorro.com> wrote:

>
> > > window.render= function render (a) {
> > > *if (a) {
> > > * if (!render.f) {
> > > * *render.f= setTimeout(function () {
> > > * * delete render.f;
> > > * * document.body.style.display= "";
> > > * *},0);
> > > * }
> > > *} else document.body.style.display= "none";

>
> > > }

>
> > Will you please stop posting examples that augment host objects? *And
> > no, that's not a cue to start up with your "window is the global
> > object in browsers" nonsense.

>
> > Thanks!

>
> BTW. It's not only that that window isn't a host object:


Did you just say that the window object isn't a host object? So I
presume you've found some long lost chapter of the ECMA specs that
(oddly enough) defines a browser-specific object. Please share,
Jorge. This could change everything!

And don't bother quoting that bit where they speculate what the host
object might reference (or mimic) in browsers.

> it's also
> that augmenting DOM elements (which are host objects) is ok, yes,


Ok? No.

> I'll
> repeat it: again: it's *OK* to augment host objects:


You've lost it El Abuelo. Senility setting in?

http://www.cinsoft.net/host.html

> I *know* that it
> can be done safely, 100% error-free, in all the browsers I've ever
> done it,


Show you where it fails?

> except in the most broken ones ever: Microsoft's IEs.


Oh it's your old stalwart: the insanity defense. I should have known
you were leading up to that one.

>
> That's so because nothing prevents a host object to be a native object
> too.


Your logic is swiss cheese. Nothing prevents them from *not* being
native objects. In fact (depending on how you look at it) by
definition they cannot be considered native objects. Black can't be
white; up can't be down; Jorge can't be sane; and so on...

> And it seems to be the case that the clever minds @ Mozilla,
> Opera and WebKit have made them so...


By "made them so", you seem to be indicating that behind-the-scenes
they use the same code used to implement native objects in those three
"clever" browsers. It's interesting though that some of their
"native" objects break the rules in the specs. Perhaps they are
restless native objects? Something between a native and a host
object?

Or perhaps you are (once again) wasting everyone's time with confused
babbling?

> so much for Microsoft, the
> better and the biggest -until Apple outgrown it- software company in
> the world.


You aren't helping Apple any more than you helped Yahoo!

>
> David, David... get well !


Get your own shtick, Jorge.
 
Reply With Quote
 
Ry Nohryb
Guest
Posts: n/a
 
      08-14-2010
On Aug 14, 2:58*pm, David Mark <dmark.cins...@gmail.com> wrote:
> On Aug 14, 4:21*am, Ry Nohryb <jo...@jorgechamorro.com> wrote:
>
> > BTW. It's not only that that window isn't a host object:

>
> Did you just say that the window object isn't a host object? *So I
> presume you've found some long lost chapter of the ECMA specs that
> (oddly enough) defines a browser-specific object. *Please share,
> Jorge. *This could change everything! * (...)


Yes David, yes, I've just said -again- that window is an alias of the
global object, which isn't a host object. Pfffff.
--
Jorge.
 
Reply With Quote
 
Gregor Kofler
Guest
Posts: n/a
 
      08-14-2010
Am 2010-08-14 10:21, Ry Nohryb meinte:

> BTW. It's not only that that window isn't a host object: it's also
> that augmenting DOM elements (which are host objects) is ok, yes, I'll
> repeat it: again: it's *OK* to augment host objects: I *know* that it
> can be done safely, 100% error-free, in all the browsers I've ever
> done it


Let me guess: That's Safari and ...er... Safari?

, except in the most broken ones ever: Microsoft's IEs.

Right. Yes, we can ignore these bastards...

> --


Is this supposed to be a sig delimiter? The fix it.


--
http://vxjs.gregorkofler.com
 
Reply With Quote
 
David Mark
Guest
Posts: n/a
 
      08-14-2010
On Aug 14, 10:26*am, Ry Nohryb <jo...@jorgechamorro.com> wrote:
> On Aug 14, 2:58*pm, David Mark <dmark.cins...@gmail.com> wrote:
>
> > On Aug 14, 4:21*am, Ry Nohryb <jo...@jorgechamorro.com> wrote:

>
> > > BTW. It's not only that that window isn't a host object:

>
> > Did you just say that the window object isn't a host object? *So I
> > presume you've found some long lost chapter of the ECMA specs that
> > (oddly enough) defines a browser-specific object. *Please share,
> > Jorge. *This could change everything! * (...)

>
> Yes David, yes, I've just said -again- that window is an alias of the
> global object, which isn't a host object. Pfffff.


You keep saying things without a shred of proof. It doesn't make them
so.
 
Reply With Quote
 
Ry Nohryb
Guest
Posts: n/a
 
      08-14-2010
On Aug 14, 6:02*pm, Gregor Kofler <use...@gregorkofler.com> wrote:
> Am 2010-08-14 10:21, Ry Nohryb meinte:
>
> > BTW. It's not only that that window isn't a host object: it's also
> > that augmenting DOM elements (which are host objects) is ok, yes, I'll
> > repeat it: again: it's *OK* to augment host objects: I *know* that it
> > can be done safely, 100% error-free, in all the browsers I've ever
> > done it

>
> Let me guess: That's Safari and ...er... Safari?


Safari and er... FireFox and Opera and Chrome. All of them, and all of
their version since 2007.
--
Jorge.
 
Reply With Quote
 
David Mark
Guest
Posts: n/a
 
      08-14-2010
On Aug 14, 4:42*pm, Ry Nohryb <jo...@jorgechamorro.com> wrote:
> On Aug 14, 6:02*pm, Gregor Kofler <use...@gregorkofler.com> wrote:
>
> > Am 2010-08-14 10:21, Ry Nohryb meinte:

>
> > > BTW. It's not only that that window isn't a host object: it's also
> > > that augmenting DOM elements (which are host objects) is ok, yes, I'll
> > > repeat it: again: it's *OK* to augment host objects: I *know* that it
> > > can be done safely, 100% error-free, in all the browsers I've ever
> > > done it

>
> > Let me guess: That's Safari and ...er... Safari?

>
> Safari and er... FireFox and Opera and Chrome. All of them, and all of
> their version since 2007.


So you've made unfounded inferences about a handful of modern
browsers? You should write a library.


 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Re: How include a large array? Edward A. Falk C Programming 1 04-04-2013 08:07 PM
Nike air force one, air force 1, air force one low cut, air force one salewholeta@163.com Digital Photography 3 12-31-2008 04:29 PM
Nike Air Force Ones,Air Force One Air Force One-1 lky52193@gmail.com Computer Support 0 01-17-2008 04:40 PM
Nike Air Force Ones,Air Force One Air Force One-1,25th anniversary lky52112@gmail.com Digital Photography 0 01-15-2008 04:46 PM
Nike Air Force Ones,Air Force One Air Force One-1,25th anniversary lky52112@gmail.com Digital Photography 0 01-15-2008 04:34 PM



Advertisments
 



1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57