Уважаемые гуру форума, нуждаюсь в Вашей помощи так так с скриптами я не алё, а вот проблемка возникла.
в общем создал я список с таблицей:
<div class="class1"><img class="class1"src="1.png" title="ZZZ"/>Текст1</div><br>
<div class="class2"><img class="class2"src="2.png" title="ZZZ"/>Текст2</div><br>
<div class="class3"><img class="class3"src="3.png" title="ZZZ"/>Текст3</div><br>
<table width="200" border="0">
<tr>
<td class="k1" tabindex="0"><img class="class1" src="1.png" title="ZZZ"/></td>
<td class="k2"><img class="class2"src="2.png" title="ZZZ"/></td>
<td class="k1" tabindex="0"><img class="class1"src="1.png" title="ZZZ"/></td>
</tr>
<tr>
<td class="k2"><img class="class2"src="2.png" title="ZZZ"/></td>
<td class="k1" tabindex="0"><img class="class1"src="1.png" title="ZZZ"/></td>
<td class="k2"><img class="class2"src="2.png" title="ZZZ"/></td>
</tr>
<tr>
<td class="k3"><img class="class3"src="3.png" title="ZZZ"/></td>
<td class="k3"><img class="class3"src="3.png" title="ZZZ"/></td>
<td class="k1" tabindex="0"><img class="class1"src="1.png" title="ZZZ"/></td>
</tr>
</table>
мне нужно чтобы при наведении, на DIVы все элементы с одинаковым с DIVом классом меняли свой стиль, а при клике на него меняли стиль и запоминали изменение.
CSS
.k1 {
border: 2px dotted #000;
border-radius: 16px 16px 16px;
background:red;
opacity: 0.6;
}
.k2 {
border: 2px dotted #000;
border-radius: 16px 16px 16px;
background:green;
opacity: 0.6;
}
.k3 {
border: 2px dotted #000;
border-radius: 16px 16px 16px;
background:orange;
opacity: 0.6;
}
.k1:focus:not(:active){
border: 2px solid #000;
opacity : 1;
}
td:hover
{
opacity: 1;
}
нашел что то похожее, но разобраться так и не смог.
$("div[class ^= 'class']").not("").click(function() {
$("img[class ^= 'class']").hide() ;
$("img."+$(this).attr("class")).show() ;
}) ;
По сути мне всего то нужно при наведении и клике поменять opacity: на 1 и border.
Поможите чем могите.
Пока что
получается только так
... строки .parent() можно убрать
