Matt Miller
2006-Apr-06 23:35 UTC
Bug? In scriptaculous -- double text drawn one pixel off
Hello, I''m working with scriptaculous, and i''ve narrowed down
a bug i''m
having to the following code:
http://rate.urbanpug.com
I''m using the latest release (as of sending this mail) of
scriptaculous.
I''ve actually seen this bug before, and random tweaking fixed it.
Unfortunately, i can''t figure it out this time. I''ve reduced
the bug to the
smallest amount of code that reasonably demonstrates the bug.
Basically, what happens is that when the effect.toggle starts to happen, all
the text in the the div i''m toggling gets redrawn on top of the
existing
text. Then, when the effect is finished, the text is put back to normal.
(That''s not shown in this example, it''s just one div fading
out).
I''m setting the width of the div to "give it layout."
What''s up with this? (you can see the code in action at the above URL,
but
i''m pasting it below anyway)
Thanks for your help. I love scriptaculous.
-Matt Miller
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "
http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script src="/js/prototype.js"
type="text/javascript"></script>
<script src="/js/scriptaculous.js"
type="text/javascript"></script>
<title>CameraPuppy.com</title>
<meta http-equiv="content-type" content="text/html;
charset=UTF-8">
<style type="text/css">
#loginform {
width: 165px;
}
</style>
<script type="text/javascript">
function createAccountForm() {
Effect.toggle(''loginform'',''appear'');
}
</script>
</head>
<body>
<div id="loginform" onclick="createAccountForm()">div
one</div>
<br/><br/>
Notice, when you click on "div one" in IE 6.0, the text appears to be
drawn
over the existing text, one pixel off.
</body>
</html>
_______________________________________________
Rails-spinoffs mailing list
Rails-spinoffs-1W37MKcQCpIf0INCOvqR/iCwEArCW2h5@public.gmane.org
http://lists.rubyonrails.org/mailman/listinfo/rails-spinoffs
Thomas Fuchs
2006-Apr-07 07:55 UTC
Re: Bug? In scriptaculous -- double text drawn one pixel off
Heya, This is a bug, but not in script.aculo.us, but with the IE text rendering engine. When you''re using Appear/Fade, you can work around by overlaying the DIV with an other DIV that just contains white as background color and appear that in (so it makes it look like the other div is fading). After that, you remove the overlay and hide the element. Note that this works only in situations where you have a single background color "behind the element". There might be other workarounds as well. -Thomas Am 07.04.2006 um 01:35 schrieb Matt Miller:> Hello, I''m working with scriptaculous, and i''ve narrowed down a bug > i''m having to the following code: > > http://rate.urbanpug.com > > I''m using the latest release (as of sending this mail) of > scriptaculous. I''ve actually seen this bug before, and random > tweaking fixed it. Unfortunately, i can''t figure it out this > time. I''ve reduced the bug to the smallest amount of code that > reasonably demonstrates the bug. > > Basically, what happens is that when the effect.toggle starts to > happen, all the text in the the div i''m toggling gets redrawn on > top of the existing text. Then, when the effect is finished, the > text is put back to normal. (That''s not shown in this example, > it''s just one div fading out). > > I''m setting the width of the div to "give it layout." > > What''s up with this? (you can see the code in action at the above > URL, but i''m pasting it below anyway) > > Thanks for your help. I love scriptaculous. > > -Matt Miller > > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http:// > www.w3.org/TR/html4/strict.dtd"> > <html> > <head> > <script src="/js/prototype.js" type="text/javascript"></script> > <script src="/js/scriptaculous.js" type="text/javascript"></script> > > <title> CameraPuppy.com</title> > <meta http-equiv="content-type" content="text/html; charset=UTF-8"> > <style type="text/css"> > #loginform { > width: 165px; > } > </style> > > <script type="text/javascript"> > > function createAccountForm() { > Effect.toggle(''loginform'',''appear''); > } > </script> > </head> > <body> > <div id="loginform" onclick="createAccountForm()">div one</div> > <br/><br/> > Notice, when you click on "div one" in IE 6.0, the text appears to > be drawn over the existing text, one pixel off. > </body> > </html> > > _______________________________________________ > Rails-spinoffs mailing list > Rails-spinoffs-1W37MKcQCpIf0INCOvqR/iCwEArCW2h5@public.gmane.org > http://lists.rubyonrails.org/mailman/listinfo/rails-spinoffs-- Thomas Fuchs wollzelle http://www.wollzelle.com http://www.fluxiom.com :: online digital asset management http://script.aculo.us :: Web 2.0 JavaScript http://mir.aculo.us :: Where no web developer has gone before _______________________________________________ Rails-spinoffs mailing list Rails-spinoffs-1W37MKcQCpIf0INCOvqR/iCwEArCW2h5@public.gmane.org http://lists.rubyonrails.org/mailman/listinfo/rails-spinoffs