Skip to content

Instantly share code, notes, and snippets.

@hs0ucy

hs0ucy/index.html

Created March 1, 2018 15:14
Show Gist options
  • Save hs0ucy/2cbd82fcfd78aa4e354683b0022db25a to your computer and use it in GitHub Desktop.
Save hs0ucy/2cbd82fcfd78aa4e354683b0022db25a to your computer and use it in GitHub Desktop.
Download ZIP
Tests d'accordeon // source https://jsbin.com/gagomiv
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Tests d'accordeon</title>
</head>
<body>
<h1 hidden="">Tests d'accordeon</h1>
<button id="btn1">Btn 1</button>
<button id="btn2">Btn 2</button>
<button id="btn3">Btn 3</button>
<div class="adsd b" id="d1">DIV 1</div>
<div class="a b" id="d2">DIV 2</div>
<div class="a b" id="d3">DIV 3</div>
<script id="jsbin-javascript">
"use strict";
function test(handles, drawers, setname) {
var drawerset = { "handles": Array.from(handles), "drawers": Array.from(drawers) };
if (drawerset.handles.length === drawerset.drawers.length) {
(function () {
var handlesArr = drawerset.handles;
var drawersArr = drawerset.drawers;
handlesArr.forEach(function (h, i) {
drawersArr[i].setAttribute('hidden', '');
drawersArr[i].classList.add("js-" + setname + "-drawer-isclose");
h.classList.add("js-" + setname + "-handle-pushed");
console.log(drawersArr[i].className.split(' '));
h.addEventListener('click', function (thatEvt) {
if (drawersArr[i].hasAttribute('hidden')) {
drawersArr[i].removeAttribute('hidden');
} else {
drawersArr[i].setAttribute('hidden', '');
}
drawersArr.filter(function (d) {
return d !== drawersArr[i];
}).forEach(function (d) {
d.setAttribute('hidden', '');
});
});
});
})();
}
}
test(document.querySelectorAll('button'), document.querySelectorAll('div'), 'homepage');
</script>
<script id="jsbin-source-javascript" type="text/javascript">function test(handles, drawers, setname) {
const drawerset = { "handles" : Array.from(handles), "drawers" : Array.from(drawers) };
if (drawerset.handles.length === drawerset.drawers.length) {
const handlesArr = drawerset.handles;
const drawersArr = drawerset.drawers;
handlesArr.forEach((h, i) => {
drawersArr[i].setAttribute('hidden', '');
drawersArr[i].classList.add(`js-${setname}-drawer-isclose`);
h.classList.add(`js-${setname}-handle-pushed`);
console.log(drawersArr[i].className.split(' '));
h.addEventListener('click', (thatEvt) => {
if (drawersArr[i].hasAttribute('hidden')) {
drawersArr[i].removeAttribute('hidden');
} else {
drawersArr[i].setAttribute('hidden', '');
}
drawersArr.filter(d => d !== drawersArr[i]).forEach(d => {
d.setAttribute('hidden', '');
});
});
});
}
}
test(document.querySelectorAll('button'), document.querySelectorAll('div'), 'homepage');</script></body>
</html>
Raw
jsbin.gagomiv.js
"use strict";
function test(handles, drawers, setname) {
var drawerset = { "handles": Array.from(handles), "drawers": Array.from(drawers) };
if (drawerset.handles.length === drawerset.drawers.length) {
(function () {
var handlesArr = drawerset.handles;
var drawersArr = drawerset.drawers;
handlesArr.forEach(function (h, i) {
drawersArr[i].setAttribute('hidden', '');
drawersArr[i].classList.add("js-" + setname + "-drawer-isclose");
h.classList.add("js-" + setname + "-handle-pushed");
console.log(drawersArr[i].className.split(' '));
h.addEventListener('click', function (thatEvt) {
if (drawersArr[i].hasAttribute('hidden')) {
drawersArr[i].removeAttribute('hidden');
} else {
drawersArr[i].setAttribute('hidden', '');
}
drawersArr.filter(function (d) {
return d !== drawersArr[i];
}).forEach(function (d) {
d.setAttribute('hidden', '');
});
});
});
})();
}
}
test(document.querySelectorAll('button'), document.querySelectorAll('div'), 'homepage');
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment