Anonymous

Anonymous,

> One bug/quirk I have discovered is that if you left click on the control
> nib and simultaneously click on the right mouse button

I have uploaded version 1.2 to the server:
http://www.howtocreate.co.uk/jslibs/slider.js

This protects Internet Explorer and Mozilla/Firefox and a few minor
browsers from the problem you described.

Mac browsers have no need for this protection (as they do not detect other
clicks anyway). Opera's event handling reguarding right clicks is limited
by a user preference, but it will also be protected if right click
detection has been permitted by the user.

Enjoy.

Mark 'Tarquin' Wilton-Jones - author of http://www.howtocreate.co.uk/

Anonymous,

> Is it possible to add another "property" to the slider that contains a
> "unique" number that identifies the slider
> I'm accessing the slider number by substring of "this.id".  I doubt
> this is the best way to go.

yes, but ....
you are using substring. that is essentially the same as I would have to do
by putting the unique number in the source, only I would also have to make
it store a temporary property for you to access. Believe it or not, your
solution is much more elegant than anything I could do, and since I will
not be changing the ID pattern, what you have done should continue to work
properly. If you _really really_ want it done with a property, let me know,
and I will tell you what you would need to do to change it.

> var s_name = this.id;
> var num = s_name.substring(19);

or just
var num = this.id.substring(19);

> eval("document.forms['seval_form'].elements['score' + num].value =
> Math.round( 10 * sliderPosition);");

there is no need to use eval.
document.forms['seval_form'].elements['score' + num].value = Math.round( 10 * sliderPosition);

> eval("var a = document.getElementById('num" + num + "')");

same applies:
var a = document.getElementById( 'num' + num );

> a.firstChild.nodeValue = Math.round( 10 * sliderPosition);

neat, I like this idea.

> step = Math.round( 10 * sliderPosition ) / 10;
> eval("slider" + num + ".setPosition(step)");

good good. nothing wrong here.

> Another thing, the stepping feature of the slider seems to not be
> working properly.  If both sliders are set to '2', they are not aligned
> properly.  Is there any way around this?

the stepping code must be used in both the moveFunction and stopFunction,
since both of these events can move the slider. You only have it in the
moveFunction at the moment, so when you let go, it is no longer restricted,
and moves to wherever your mouse is at the moment that you let go, ignoring
the stepping rules.

function stopFunction(sliderPosition) {
    var num = this.id.substring(19);
    var a = document.getElementById('num' + num );
    a.firstChild.nodeValue = Math.round( 10 * sliderPosition);
    step = Math.round( 10 * sliderPosition ) / 10;
    window.status = step;
    eval("slider" + num + ".setPosition(step)");
}

function moveFunction(sliderPosition) {
    var num = this.id.substring(19);
    document.forms['seval_form'].elements['score' + num].value =
        Math.round( 10 * sliderPosition);
    var a = document.getElementById('num' + num );
    a.firstChild.nodeValue = Math.round( 10 * sliderPosition);
    step = Math.round( 10 * sliderPosition ) / 10;
    window.status = step;
    eval("slider" + num + ".setPosition(step)");
}

Since a lot of that is repeated, it could be reduced even further by moving
some of it into another function, or whatever.


Hope this helps

Mark 'Tarquin' Wilton-Jones - author of http://www.howtocreate.co.uk/