Вход

Просмотр полной версии : о этот canvas х_х


Romeo
24.07.2012, 01:54
Всем привет!
Давно читаю этот форум, но вот столкнулся с проблемой и решил зарегистрироваться в надежде на помощь профессионалов.
Проблема такова... Есть много дивов и есть много канвасов. Дивы идут друг за другом не пересекаясь, а канвасы имеет ширину и высоту по всему экрану (выстовляется потом функцией во время отрисовки). Всё это находится в одном общем диве... Дак вот, можно ли как то сделать чтоб картинки канвасов которые находятся на слой выше (чтоб их было видно) всё таки отображались, но тем неменее события на дивах которые под ними тоже срабатывали?
Если грубо написать код, то:
<div style="position:relative;" id="mycont">
<div onclick="javascript: fun1();" style="position:absolyte; z-index:1;" id="div1">text</div>
<div onclick="javascript: fun2();" style="position:absolute; z-index:1;" id="div2">text</div>
<div onclick="javascript: fun3();" style="position:absolute; z-index:1;" id="div2">text</div>
<canvas style="position:absolute; z-index:2;" id="can1"></canvas>
<canvas style="position:absolute; z-index:2;" id="can2"></canvas>
<canvas style="position:absolute; z-index:2;" id="can3"></canvas>
</div>
(на картинке снизу, 1,2,3,4 это дивы на каоторых блоки, а стрелочки реализованы через канвас. вот и нужно чтоб события больших дивов срабатывали, и чтоб стрелочки через канвас тоже были видны)

Dmitriyff
24.07.2012, 12:36
так сделать будет нельзя вот ссыль события (http://javascript.ru/tutorial/events/intro)

можно сделать если канвасы будут лежать в этих же дивах, по которым нужно отловить нажатие. порядок срабатываиня события (http://javascript.ru/tutorial/events/intro#poryadok-srabatyvaniya-sobytiy)

vadim5june
24.07.2012, 13:08
Дак вот, можно ли как то сделать чтоб картинки канвасов которые находятся на слой выше (чтоб их было видно) всё таки отображались, но тем неменее события на дивах которые под ними тоже срабатывали?

события на нижележащих дивах не сработают но можно по координатом курсора вычислить например что курсор находится над какой то кнопкой и пользователь кликнул при этом-некоторое псевдо событие

Romeo
24.07.2012, 14:14
так сделать будет нельзя вот ссыль события (http://javascript.ru/tutorial/events/intro)

можно сделать если канвасы будут лежать в этих же дивах, по которым нужно отловить нажатие. порядок срабатываиня события (http://javascript.ru/tutorial/events/intro#poryadok-srabatyvaniya-sobytiy)
к сожалению они ни как не связаны.

события на нижележащих дивах не сработают но можно по координатом курсора вычислить например что курсор находится над какой то кнопкой и пользователь кликнул при этом-некоторое псевдо событие
можно конечно... но весь проект написан на полном асинхроне, и отследить сколько именно у меня дивов при каждом движении мыши, это просто повесить БД)

Вот наткнулся на такую штуку как [LAYERS]. Она может мне помочь? К примере при наведении на объект ведь можно передавать таргет родителю? А здесь будет передаваться таргет слою ниже... Или эта инфа уже устарела?

vadim5june
24.07.2012, 14:30
К примере при наведении на объект ведь можно передавать таргет родителю?
у Вас дивы не являются родителями канвасов и соответственно события не будут всплывать.Вы писали что все они лежат в одном диве-вот в этом диве все события будут работать-но что с того-к дивам то они не всплывут
А здесь будет передаваться таргет слою ниже... Или эта инфа уже устарела?нет слой ниже это не родитель и туда ничего не будет передаваться-родитель это по цепочке element.parentNode
хотя со слоями не работал
можно конечно... но весь проект написан на полном асинхроне, и отследить сколько именно у меня дивов при каждом движении мыши, это просто повесить БД)
может что то интересное-ссылку дайте-посмотрим

Romeo
24.07.2012, 16:19
у Вас дивы не являются родителями канвасов и соответственно события не будут всплывать.Вы писали что все они лежат в одном диве-вот в этом диве все события будут работать-но что с того-к дивам то они не всплывут

нет слой ниже это не родитель и туда ничего не будет передаваться-родитель это по цепочке element.parentNode
хотя со слоями не работал

может что то интересное-ссылку дайте-посмотрим

1) это я знаю)
2) тоже знаю, но наткнулся на такую строчку просто:
Для доступа к слою, находящемуся внутри другого слоя, используется такой способ:
document.layers["outerlayer"].layers["innerlayer"]
3) Конечно, как доделаю, обязательно поделюсь) Может баги найдёте)

А вообще, вроде как решил проблему... Дивы у меня по 300px, идут друг за другом в право... по координатам мыши определяю под каким дивом мышка, и вызываю обработку действия... с онкликом и маусовером прокатывает, но вот с маусаутом нет) но тоже решил проблему, вот таким способом:
if (typeof y == "undefined" || y==obj_0) {y=obj_0;} else {document.getElementById(y.id).onmouseout=nodisp(y .id); y=obj_0; }
Теперь другая проблема... те элементы которые находятся на дивах... они не работают... это всякие там кнопочки всплывающие... но вроде тоже понял как проблему решить.... разобью этот див на два, нижний и верхний... с разным z-index'ом) В общем, всё через (__).(__), но работать должно)
Не знаю, пригодиться ли нет кому эта ахинея, но если кто знает как решить задачу иначе, буду рад выслушать)))

vadim5june
24.07.2012, 18:47
2) тоже знаю, но наткнулся на такую строчку просто:
Для доступа к слою, находящемуся внутри другого слоя, используется такой способ:
document.layers["outerlayer"].layers["innerlayer"]

доступ то у нас ко всему имеется задача другая чтобы события сквозь слой прошли-а это не получится поэтому Вы начали вычислять координаты и запускать сами обработчики

Не знаю, пригодиться ли нет кому эта ахинея, но если кто знает как решить задачу иначе, буду рад выслушать)))
я думал у Вас куча спрайтов(в канвасах)-игра какая нибудь

Romeo
24.07.2012, 22:18
я думал у Вас куча спрайтов(в канвасах)-игра какая нибудь
нет, у меня в канвасах исключительно стрелочки только рисуются ;)