Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Перебор соседних элементов по "кругу" (https://javascript.ru/forum/jquery/58075-perebor-sosednikh-ehlementov-po-krugu.html)

falkone 03.09.2015 12:28

Перебор соседних элементов по "кругу"
 
Страничка заполняется квадратами, размер которых задается с помощью prompt. Ширина и высота окна формируется в соответствии от размера самого окна.

Хочу сделать что бы при клике на один из квадратов, все квадраты вокруг него изменяли цвет и так по степени нарастания области (как волна после того как кинул предмет в воду).

Но не хватает опыта, помогите придумать саму логику. Думал по индексам писать формулу, но тогда формула нужна для каждого квадрата.

рони 03.09.2015 12:37

Цитата:

Сообщение от falkone
Думал по индексам писать формулу, но тогда формула нужна для каждого квадрата.

формула будет одна, на входе индекс клетки на выходе массив индексов клеток вокруг.
Цитата:

Сообщение от falkone
Страничка заполняется квадратами, размер которых задается с помощью prompt. Ширина и высота окна формируется в соответствии от размера самого окна.

как вы угадаите, чтоб клетки заполнили весь обьем, а не больше или меньше.

falkone 03.09.2015 12:44

Вот так я заполняю страничку квадратами.
function myFunction() {
    var square = prompt("Please enter square size in px");
    var squareSize = parseInt(square);
    if (square != null) {
    	var wrapper = $('.wrapper').width();
    	var wrapperHeight = $('.wrapper').height();
    	var a = (wrapper / squareSize |0) * (wrapperHeight / squareSize |0);	
        var items = wrapper / squareSize |0;
        for (var i = 0; i < a; i++) {
          $('.wrapper').append('<div class="child">' + i +'<div>');
          $('.child').css({
             width: squareSize,
             height: squareSize
         });
      };
}
}


Как тогда быть, если я выберу угловой квадрат, тогда ведь массив инддексов должен совсем иначе считаться чем при выборе квадрата где то в центре странички.

falkone 03.09.2015 12:50

Вот код в действии http://jsfiddle.net/falkone/73gLc3ap/1/

рони 03.09.2015 12:55

Цитата:

Сообщение от falkone
Как тогда быть, если я выберу угловой квадрат, тогда ведь массив инддексов должен совсем иначе считаться чем при выборе квадрата где то в центре странички.

нет просто функция выдаст массив с меньшим числом клеток

falkone 03.09.2015 12:58

Тогда как более правильно обойти выбранный и получить массив элементов вокруг него? Может изначально посчитать его порядковый номер именно в плане координат Х и У(строка и столбик) и потом уже из этого думаю будет не так сложно искать соседние?

рони 03.09.2015 13:00

falkone,
пример работы такой функции.

рони 03.09.2015 13:03

Цитата:

Сообщение от falkone
Может изначально посчитать его порядковый номер именно в плане координат Х и У(строка и столбик)

да вы на верном пути, потом взять (согласно шагу, для примера 1 )ряд сверху, ряд в котором клетка, и ряд снизу проверить на существование рядов -- а потом и клеток в рядах

рони 03.09.2015 13:10

Цитата:

Сообщение от Rise
falkone, может быть триггировать клик на соседних клетках

их надо сначала вычислить :write: потом можно волну гнать

falkone 03.09.2015 13:13

Цитата:

Сообщение от Rise (Сообщение 387044)
falkone, может быть триггировать клик на соседних клетках, те в свою очередь на своих соседях и тд... причем игнорировать клетки с которых триггер пришел...

Можно более подробно как работает этот метод и как его использовать?:write:


Часовой пояс GMT +3, время: 10:28.