Сообщение от BorodinKO
|
<div id="bm">Текст1</div>
<div id="bm">Текст2</div>
<div id="bm">Текст3</div>
Как без изменения Html кода изменить class того элемента на который наведен курсор?
мой код:
document.getElementById('bm').onmouseover=function (){
this.className = "action";
}
в результате работает только первый элемент Текст1
|
конечно только он будет работать. ID предполагает
уникальный идентификатор, а не общий. общий - это класс, атрибут, имя тега наконец.
смотрите, вот
<style>
div { border-left: 5px white solid; }
.bm {
border-color: red;
}
.action {
border-color: yellow;
}
</style>
<div class="bm">Текст1</div>
<div class="bm">Текст2</div>
<div class="bm">Текст3</div>
<script>
var arr = document.getElementsByTagName('div');
function a(){ this.className = ( this.className === "action" )? "bm" : "action"; }
for(var i = 0, b = arr.length ; i<b;i++){
arr[i].onmouseover = a;
// можно убрать mouseout тогда он будет багнутый.
arr[i].onmouseout = a;
}
</script>
я думаю,для этого это затевалось
хочу вас расстроить,сделать это можно было через CSS
<style>
div { border-left: 5px white solid; }
.bm {
border-color: red;
}
.bm:hover {
border-color: yellow;
}
</style>
<div class="bm">Текст1</div>
<div class="bm">Текст2</div>
<div class="bm">Текст3</div>