Более лаконичный код простой функции, как?
Всем привет! Как более красиво и лаконично переписать такую функцию?
const toggleBtn = document.getElementById('toggle')
const sidebar = document.getElementById('sidebar')
const content = document.getElementById('content')
toggleBtn.addEventListener('click', sidecollapse, false)
function sidecollapse() {
if (sidebar.classList.contains('col-3')) {
sidebar.classList.remove('col-3')
sidebar.classList.add('col-1')
} else {
sidebar.classList.remove('col-1')
sidebar.classList.add('col-3')
}
if (content.classList.contains('col-9')) {
content.classList.remove('col-9')
content.classList.add('col-11')
} else {
content.classList.remove('col-11')
content.classList.add('col-9')
}
}
Заранее благодарен! |
Volonter,
а полноценный макет никак? а описание, что делает функция нафига? |
Volonter,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.col-1 {
background-color: #FFFF00;
}
.col-3 {
background-color: #FF0000;
}
.col-9{
background-color: #8B4513;
}
.col-11{
background-color: #0000FF;
}
</style>
</script>
</head>
<body>
<div id="sidebar" class="col-3">sidebar</div>
<div id="content" class="col-9">content</div>
<input id="toggle" name="" type="button" value="toggle">
<script>
const toggleBtn = document.getElementById('toggle')
const sidebar = document.getElementById('sidebar')
const content = document.getElementById('content')
toggleBtn.addEventListener('click', sidecollapse, false)
function sidecollapse() {
sidebar.classList.toggle('col-3');
sidebar.classList.toggle('col-1');
content.classList.toggle('col-11');
content.classList.toggle('col-9');
}
</script>
</body>
</html>
|
рони,
не совсем то, мне надо чтобы если колонка имеет класс col-3 то менялось на col-1 и\или наоборот, при этом у контента соответственно col-9 на col-11 и\или наоборот. Это надо чтобы сворачивать бутстраповскую сетку |
Цитата:
|
| Часовой пояс GMT +3, время: 01:06. |