Здравствуйте. Помогите, пожалуйста, разобраться с тем, что не так в подобной записи доступа к style объекта через childNodes в функции onButt(elem). Читая подобный код других людей, я не вижу в нём различий, но у людей он работает, а у меня нет. Что я пропускаю? Заранее благодарю.
Прошу прощения. Отредактировал. Закинул код целиком.
<html>
<head>
<style type="text/css">
.leftCorn {-webkit-clip-path: polygon(0px 50%, 100% 0px, 100% 100%); width: 50px; height: 50px; background: green; position: absolute; left: 0px; margin: 0px;}
.rightCorn {-webkit-clip-path: polygon(0px 0px, 100% 50%, 0px 100%); width: 50px; height: 50px; background: green; position: absolute; left: 50px; margin: 0px;}
</style>
<script type="text/javascript">
function onButt(elem) {
elem.childNodes[0].style.left = -50 + 'px';
elem.childNodes[1].style.left = 100 + 'px';
elem.childNodes[2].style.left = 0 + 'px';
elem.childNodes[2].style.width = 100 + 'px';
}
</script>
</head>
<body>
<div id = "btn" onmouseover = "onButt('btn');" style = "width: 100px; height: 50px; padding: 0px; position: fixed; left: 400px;">
<div id = "c1" class = "leftCorn"></div>
<div id = "c2" class = "rightCorn"></div>
<div style = "height: 50px; background: grey; position: absolute; left: 50px;"></div>
</div>
</body>
</html>