Форум программистов, компьютерный форум, киберфорум
JavaScript для начинающих
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.75/4: Рейтинг темы: голосов - 4, средняя оценка - 4.75
0 / 0 / 0
Регистрация: 13.04.2018
Сообщений: 4
1

Создать круг разделенный на 6 блоков, в центре логотип, при наведении на один из блоков он увеличивается

13.04.2018, 12:45. Просмотров 810. Ответов 2
Метки нет (Все метки)


Доброго времени суток. Не знаю, как даже искать похожее. В общем нужно создать круг разделен на 6 блоков, в центре логотип, при наведение на один из блоков он увеличивается и весь бекграунд меняется. Фрагменты круга кликабельные. Помогите, как хоть в поиск вбивать)
Спасибо!
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
13.04.2018, 12:45
Ответы с готовыми решениями:

Как сделать несколько блоков, исчезающих одновременно, при наведении хотя бы на один их них
Как сделать несколько блоков, исчезающих одновременно, при наведении хотя бы на один их них? ...

Одновременное появление блоков при наведении
Приветствую! Необходимо сделать так, чтобы при наведении на один элемент появлялся другой и так,...

Плавный показ нескольких блоков при наведении
Есть список ul. В нем несколько li В каждом li есть блоки c id="top", "meddle" и "bottom" Мне...

Подчеркивание определенных блоков при наведении мыши
Добрый день, есть вот такая конструкция http://jsfiddle.net/m8j0y87q/ <div class="left"> ...

2
the hardway first
Эксперт JS
2028 / 1512 / 769
Регистрация: 05.06.2015
Сообщений: 3,172
14.04.2018, 21:21 2
Вам svg, canvas или стилизованные картинки или вы сами не знаете что?
0
dev - investigator
Эксперт JSЭксперт HTML/CSS
2127 / 1473 / 648
Регистрация: 16.04.2016
Сообщений: 3,688
14.04.2018, 21:29 3
P9dOv01, видимо вы про это - песочница
HTML5
1
2
3
4
5
6
7
8
9
10
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewbox="-13 -13 130 130" preserveAspectRatio="none">
        <a href="#"><path class="filter" d="M51.661 51.688L15.309 15.336C25.347 5.297 37.464.278 51.661.278v51.41z"></path></a>
        <a href="#"><path class="filter" d="M51.661 51.688H.25c0-14.197 5.02-26.314 15.058-36.353l36.353 36.353z"></path></a>
        <a href="#"><path class="filter" d="M51.661 51.688L15.309 88.041C5.27 78.003.25 65.885.25 51.688h51.411z"></path></a>
        <a href="#"><path class="filter" d="M51.661 51.688v51.41c-14.197 0-26.314-5.019-36.353-15.058l36.353-36.352z"></path></a>
        <a href="#"><path class="filter" d="M51.661 51.688l36.353 36.353c-10.038 10.039-22.156 15.058-36.353 15.058V51.688z"></path></a>
        <a href="#"><path class="filter" d="M51.661 51.688h51.41c0 14.196-5.019 26.314-15.058 36.353L51.661 51.688z"></path></a>
        <a href="#"><path class="filter" d="M51.661 51.688l36.353-36.353c10.039 10.039 15.058 22.156 15.058 36.353H51.661z"></path></a>
        <a href="#"><path class="filter" d="M51.661 51.688V.278c14.196 0 26.314 5.02 36.353 15.058L51.661 51.688z"></path></a>
        <a href="#"><circle class="filter" cx="52" cy="52" r="20"></circle></a></svg>
CSS
1
2
.filter{fill:gray;stroke:#fff;stroke-width:2;stroke-miterlimit:10;cursor:pointer;transition:all 0.3s}
.filter:hover{fill:#dcba89;transform:translate(52px,52px) scale(1.1) translate(-52px,-52px)}
P.S. В поиск можно вбить, например, круговая диаграмма svg.
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
14.04.2018, 21:29

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

подскажите пожалуйста как называется элемент отображениея блоков при наведении
нашел psd макет, и там есть вот такой элемент, что показан на картинке, и так как я только начал...

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

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

Один из блоков проваливается
Здравствуйте. Есть 2 блока, один из которых находится ниже, не под первым, а относительно ниже...

Объединение 2-х системных блоков в один.
Добрый вечер. Имеются 2 системных блока. Можно ли из них собрать 1 компьютер, т.е подключить...

Объединить несколько блоков в один
Здравствуйте, уважаемые форумчане! Недавно стал изучать PHP. Нашел код в сети. Он работает для...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
3
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2021, vBulletin Solutions, Inc.