y-*******@em-lyon.com (Yep) wrote:
rh wrote :
(sorry for the delayed answer, rh)
(as if I'm always timely :))
Your script was already very good, it's even better now:-)
Thanks for the positive feedback!
[About code complexity]
if (lastScrollLeft != doc.scrollLeft) {
There comes the discussion about code complexity and cost that you
were mentioning before; there's no definite solution of course and
this can be a difficult choice, especially when the original
conception is strong; personally I tend to prefer code complexity over
cost of doing so, especially in environments as unstable as browsers,
but that's my way of coding.
To me, a good program can be defined as fulfilling the customer needs,
efficiently, flexibly and solidly (strong error-catching system).
However, this makes the program good, not more, that's just the basics
you could say. The real thing, to me, is aesthetic, when a program can
expose a beautiful flow to the reader. Striving for aesthetic is one
of the biggest quality for a programmer IMHO (with the ability to take
one's time in imagining the program, and of course common qualities
like analytical and logical skills, good memory and curiosity).
Yes, there can be endless debate about this aspect of programming (and
there has been a certain amount recently in this forum). Fully
understanding a problem, and the tools that are available to solve it,
will often lead to the most elegant solution. There are also times,
through this virtue, when the most elegant solution may be the most
difficult for others, perhaps not as well versed, to understand.
Regardless, I think we all aspire to the "best solution" using the
"best practises" that can be acheived within the time that can be
allotted to the process. There's no question that your way is to be
admired.
However in the current script there shouldn't be any hesitation,
testing window.onscroll would probably be a good thing:-)
I also think that you could remove the hideDuringScroll and setVis
parameters and hide automatically; there's no real added value in not
hiding during the scroll if you just move the object when the scroll
has stopped.
Agreed, the ability to set hideDuringScroll was included for no
purpose other than to emulate the behaviour of your original.
I tend not to use switches if they can be avoided. However,
eliminating setVis relates to whether you wish to tolerate unecessary
settings of the style visibility, since the value of window.onscroll
is insufficient to make the determination (i.e., it's desirable to set
the visibility once when beginning to show the motion, even though the
onscroll setting remains null throughout the animation).
(I found that setting the visibility is highly efficient in some
prominent browsers and highly inefficient in others. What else would
we expect?)
See below (if you're not getting too bored by now :)) for a final
version that minimizes setting of visibility, and allows both
horizontal and vertical scroll placement of a div with absolute (0,0)
positioning.
[About var a=b="foo"]
As you've said, this should be used only in global context; however in
most conceptions using too many global variables just keeps polluting
the global namespace, so such constructs are very unlikely to appear
in advanced scripts. Now, "a=b='foo'" can be used effectively, if the
variables have been defined on the correct scope beforehand.
That relates to some extent to my "(if ever?!)" comment, regarding
use. I too am a general anti-globalist (and often cringe a bit when I
see suggestions like "what you have to is set a global variable." in
clj), and share your concern regarding overuse of this namespace.
BTW, IIRC it's the first time I've seen you using a closure-based
style with your scripts; what are your impressions on this matter?
If one is writing relatively small snippets of code, it doesn't all
that often lend itself to introducing closures. However, the use
setTimeout almost always seems to be a natural lead-in to creation of
a closure.
I'm highly impressed with closures, and try to make use of them
whenever it seems appropriate to do so.
Regards,
../rh
window.onload=function(evt){
var doc=document.compatMode &&
document.compatMode.indexOf("CSS")!=-1 &&
document.documentElement || document.body;
if(document.getElementById && document.body) {
var div=document.getElementById("BTN1");
var onScrollInit = function(){
var skidDistance = 75;
var leftReductionRate = 2, topReductionRate = leftReductionRate;
var left = doc.scrollLeft, lastScrollLeft = left;
var top = doc.scrollTop, lastScrollTop = top;
var delayBase = 42;
var delayFactor = 3;
var setVis = false;
var setPos = function(axis, pos, red) {
var scrollPos = doc["scroll"+axis.substr(0,1).toUpperCase()
+axis.substr(1)];
if ( Math.abs(scrollPos - pos) > skidDistance)
pos = Math.abs(scrollPos-skidDistance);
if ( Math.abs(scrollPos - pos) < 1 << red) red >>= 1;
div.style[axis] = ( pos +=(scrollPos - pos) >> red)+"px";
if (axis == "top") { top = pos; topReductionRate = red; }
else { left = pos; leftReductionRate = red; }
}
var onscroll = function() {
if (lastScrollLeft != doc.scrollLeft
|| lastScrollTop != doc.scrollTop) {
if (! setVis && (setVis = true))
div.style.visibility = "hidden";
if (window.onscroll) window.onscroll = null;
setTimeout(onscroll, delayFactor*delayBase);
}
else {
if (setVis && ! (setVis = false))
div.style.visibility = "visible";
setPos("top", top, topReductionRate); // conditional call?
setPos("left", left, leftReductionRate); // " "
if (leftReductionRate
|| topReductionRate) setTimeout(onscroll, delayBase);
else window.onscroll = onScrollInit();
}
lastScrollLeft = doc.scrollLeft;
lastScrollTop = doc.scrollTop;
}
return onscroll;
}
window.onscroll = onScrollInit();
}
}