开发者

Multiple jquery slider instances

I've开发者_运维百科 got 3 jquery sliders on one page showing shoe sizes for different groups (mens/women/children). Each group has an array of values for UK/US/Euro. When I run it though only the first instance updates the sizes for US/EURO aren't pulled back. What am I missing?

http://www.petersenuploads.co.uk/footslider.html

Thanks


The problem is there are - (minus) signs instead of equal signs used when defining the arrays:

sizesWomens[0] - new Array(3,4.5,35.5);

should be

sizesWomens[0] = new Array(3,4.5,35.5);

But I think it would be better to use a different method than what you have, especially for the children's sizes since they go back to 2... give me a min to work on a fix for that ;)


Update: Try this code (setting up the arrays could be done much cleaner) - Here's a demo!

$(document).ready(function () {
    var updateSizes = function (s) {
        return "UK size:" + s[0] + ", US size: " + s[1] + ", Euro size: " + s[2];
    },
    menSizes = Array(14),
    womenSizes = Array(10),
    childrenSizes = Array(18);

    menSizes[0] = [5, 6, 38];
    menSizes[1] = [5.5, 6.5, 38.5];
    menSizes[2] = [6, 7, 39];
    menSizes[3] = [6.5, 7.5, 40];
    menSizes[4] = [7, 8, 40.5];
    menSizes[5] = [8, 9, 42];
    menSizes[6] = [8.5, 9.5, 42.5];
    menSizes[7] = [9, 10, 43];
    menSizes[8] = [9.5, 10.5, 44];
    menSizes[9] = [10, 11, 44.5];
    menSizes[10] = [10.5, 11.5, 45];
    menSizes[11] = [11, 12, 46];
    menSizes[12] = [11.5, 12.5, 46.5];
    menSizes[13] = [12, 13, 47];

    womenSizes[0] = [3, 4.5, 35.5];
    womenSizes[1] = [3.5, 5, 36];
    womenSizes[2] = [4, 5.5, 37];
    womenSizes[3] = [5, 6.5, 38];
    womenSizes[4] = [5.5, 7, 38.5];
    womenSizes[5] = [6, 7.5, 39];
    womenSizes[6] = [6.5, 8, 39.5];
    womenSizes[7] = [7, 8.5, 40];
    womenSizes[8] = [7.5, 9, 41];
    womenSizes[9] = [8, 9.5, 42];

    childrenSizes[0] = [0, 0, 15];
    childrenSizes[1] = [0.5, 1, 16];
    childrenSizes[2] = [1.5, 2, 17.5];
    childrenSizes[3] = [2.5, 3, 19];
    childrenSizes[4] = [3.5, 4, 20];
    childrenSizes[5] = [4.5, 5, 21];
    childrenSizes[6] = [5.5, 6, 22.5];
    childrenSizes[7] = [6.5, 7, 23.5];
    childrenSizes[8] = [7.5, 8, 25];
    childrenSizes[9] = [8, 9, 27];
    childrenSizes[10] = [9, 10, 28];
    childrenSizes[11] = [10, 11, 29];
    childrenSizes[12] = [11, 12, 30];
    childrenSizes[13] = [12, 13, 31];
    childrenSizes[14] = [13.5, 1, 32.5];
    childrenSizes[15] = [2, 2, 34];
    childrenSizes[16] = [2.5, 3, 35];
    childrenSizes[17] = [3.5, 4, 36];

    $("#slider-men").slider({
        range: "max",
        min: 0,
        max: 13,
        step: 1,
        slide: function (e, ui) {
            $("#amount-men").val(updateSizes(menSizes[ui.value]));
        }
    });
    $("#amount-men").val(updateSizes(menSizes[0]));
    $("#slider-women").slider({
        range: "max",
        min: 0,
        max: 9,
        step: 1,
        slide: function (e, ui) {
            $("#amount-women").val(updateSizes(womenSizes[ui.value]));
        }
    });
    $("#amount-women").val(updateSizes(womenSizes[0]));
    $("#slider-children").slider({
        range: "max",
        min: 0,
        max: 17,
        step: 1,
        slide: function (e, ui) {
            $("#amount-children").val(updateSizes(childrenSizes[ui.value]));
        }
    });
    $("#amount-children").val(updateSizes(childrenSizes[0]));
});
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜