Положимые элементы, имеющие ширину: 0; высота: 0;

Я пытаюсь создать элемент, который позволяет пользователю выбирать область и, в свою очередь, выбирает переключатель (скрытый). Проблема состоит в том, что районы, которые выбираемая необходимость быть треугольниками, в результате я использовал следующий код, чтобы создать указывающий вниз треугольник,Положимые элементы, имеющие ширину: 0; высота: 0;

width: 0; 
height: 0; 
border-left: 26px solid transparent; 
border-right: 26px solid transparent; 
position:absolute; 
top:-1px; 
right:1px; 
border-top: 26px solid green;

Моей проблема теперь, что он не будет делать какой-либо из парении поведение или: проверенное поведение, я полагаю, что это потому, что элемент теоретически не имеет измерений? Есть ли для этого работа? В принципе, я хочу, чтобы когда треугольник зависал, он становится серым, когда его щелкают, он становится желтым и проверяется радиолюбитель. Вот моя скрипка, у меня есть центр (круг работает).

http://jsfiddle.net/bfehyv2a/1/

источник

2015-06-05 Udders

Похоже, что что-то JS должно обрабатывать, а не использовать флажок/радио «взломать». Кроме того, я не уверен, что ваша структура HTML допускает такой эффект. –

Ваши границы, которые создают фигуры треугольника, находятся на элементах 'div', но вы пытаетесь навести на них' 'метки' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' '' внутри '' '' '' '' '' '' '' '' '' '' '' '' '' метры ' И ваши 'div' все еще _are_ прямоугольники - прозрачные граничные части все еще являются частью их общей формы. Поэтому я сомневаюсь, что вы это сделаете. Возможно, я предлагаю использовать для этого пути клипа SVG. – CBroe

попробовать http://jsfiddle.net/bfehyv2a/4/

Вы увидите: парить до сих пор работает как указатель считается над элементом, когда он находится на границе элементов.

.green .long:hover { 
    border-top-color: #888; 
}

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

Что касается: проверенного статуса, это относится только к самой радиокнопке, и поскольку треугольники не входят в это, вы не сможете использовать это, чтобы установить цвет. Вам нужно будет использовать JavaScript для установки классов состояний, и это то, что вы действительно должны делать, так как это лучшее разделение проблем.

источник

2015-06-05 14:44:58

Положимые элементы, имеющие ширину: 0; высота: 0;

ответ

Смежные вопросы