Move the function of white button to yellow button

I have two X buttons on the bottom of the page at

The one is the white button in the footer and the other is the yellow button in flexZ1.

when you click the white button, KR , title, MY, and footer will be disappear.

It means the white button works fine,
However the yellow button does not work at the moment.

I like to remove the white button and make the yellow button works instead of the white button.

I like to make it like the follow in detail

Did you mean like this?

I just moved the button to the footer, changed the anchor to a span and added the hide-all data attribute.

I also changed the css to target the span as well and not just the a.

.flex5 > * {
  flex: 1 0 5%;
  height: 30px;

Applying your code, I made the page at

However, it seems NOT to work although the result of the CODEPEN work fine.

when I click the yellow button, they does NOT disappear.

What is wrong in applying your code?

Move your script to the end of the html as the html does not exist if you run it in the middle.

It should be here:

  <script src="ht.js"></script>

Thank you very much


This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.