Template:Menu side: Difference between revisions

From WikiMSK

mNo edit summary
No edit summary
Line 5: Line 5:


<div class="menu-side-header2">Click Me</div>
<div class="menu-side-header2">Click Me</div>
<h2>Click Me</h2>


<html>
<html>
<style>
<style>
.menu-side-header2 {
h2 {
   padding: 40px;
   padding: 40px;
   background: red;
   background: red;
Line 42: Line 46:
</style>
</style>
<script>
<script>
var menu = document.querySelectorAll(".menu-side-header2");
const div = document.querySelector('h2');
 
function toggleStyle(el, prop, style1, style2) {
function toggleStyle(el, prop, style1, style2) {
   el.style[prop] = el.style[prop] === style1 ? style2 : style1;
   el.style[prop] = el.style[prop] === style1 ? style2 : style1;
}
}


menu.addEventListener('click', e => {
div.addEventListener('click', e => {
   toggleStyle(menu, 'background', 'red', 'blue');
   toggleStyle(div, 'background', 'red', 'blue');
});
});



Revision as of 00:04, 20 March 2022

Click Me