Здравствуйте!
Стала задач разработать меню сайта в виде т.н. "пчелиных сот" - 8-ми шестиугольников, соприкасающихся друг с другом. В самих шестиугольниках проблемы нет, однако для этого меню нужны также ховер-эффекты. С этим и сложности:
* если делать разметку шестиугольных областей через map+area, то ховеры сделать не получится;
* если каждый li делать с шестиугольным бэкграундом, и даже если, снова таки, для ли сделать map+area для зоны клика, то область активации ховера всё равно будет квадратной;
* про возможности css3 нарисовать такую фигуру молчу, потому как там та же проблема с прямоугольностью областей.
Итого, нашел
JS-библиотеку рафаэль, которая генерирует svg-шку с заданными областями и дает возможность назначать им ховеры, но не могу разобраться с простановкой ссылок. Как вариант вижу наложение прозрачного изображения с map-area на данную svg-шку, но это уже будут даже не костыли, а протезы.
Есть подозрение, что я упускаю что-то очевидное. Поэтому мой вопрос звучит так: как сделать меню из соприкасающихся шестиугольников с ховерами и ссылками. Желательно также эти шестиугольники взять в бордер.
Спасибо.
