I got piece of code html and js,css too.I need to use this parameter accordionElem in my function so that on click it will work like accordion with animation,but if l add parameter my code stops.I need urgent help.Thank you.
html code
<h1>Accordian</h1>
<a href="#" class="accordian">How do I learn about activities and events in the CS department?</a>
<p>...</p>
<a href="#" class="accordian">How do I become a section leader?</a>
<p>Please see the CS198 Website for more information about the section leading program.</p>
<a href="#" class="accordian">How many CS classes should I take this quarter?</a>
<p>Most students find that 2-3 classes is a manageable workload, but different students find different workloads comfortable. Most students find they are able to handle more CS classes per quarter as they advance in the major. For more details see the courseload recommendations webpage.</p>
<a href="#" class="accordian">How can I get a summer job or internship? How do I get a
full-time job?</a>
<p>...</p>
<a href="#" class="accordian">How do I file to graduate? Can I participate in the graduation ceremony even if I am not receiving a diploma?</a><p>...</p>
<a href="#" class="accordian">How does the Honor Code apply to CS?</a>
<p>...</p>
js code I want to use this accordianEllem in some way so that my code can work.
let createAccordian = function(accordianElem) {
let sadrzaj = accordianElem.nextElementSibling;
console.log(sadrzaj);
sadrzaj.style.transition = "max-height 0.5s ease-out";
if(sadrzaj.style.display === "block") {
/* sadrzaj.style.maxHeight = "0px";*/
window.setTimeout(function () {
sadrzaj.style.maxHeight = '0px';
}, 50);
window.setTimeout(function () {
sadrzaj.style.display= 'none';
}, 550);
}
else {
sadrzaj.style.display = "block";
sadrzaj.style.maxHeight = sadrzaj.scrollHeight + "px";
}
let getHeight = function () {
sadrzaj.style.display = 'block';
let height = sadrzaj.scrollHeight + 'px';
sadrzaj.style.display = '';
return height;
};
let height = getHeight();
sadrzaj.style.display='block';
sadrzaj.style.height = 'auto';
sadrzaj.style.height = height;
window.setTimeout(function () {
sadrzaj.style.height = '';
}, 350);
};
const akordi = document.querySelectorAll('.accordian');
const par = document.querySelectorAll('p');
let aks = document.getElementsByClassName('accordian');
console.log(aks);
for( let i of par){ i.style.display = 'none';i.style.maxHeight = "0px"; }
for( let i of akordi){
i.addEventListener('click',createAccordian(akordi)); }
Aucun commentaire:
Enregistrer un commentaire