Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Show print-friendly HTML details elements' content with only a few lines of JavaScript #124

Open
rpearce opened this issue Jul 13, 2023 · 0 comments
Assignees
Labels

Comments

@rpearce
Copy link
Owner

rpearce commented Jul 13, 2023

const mql = window.matchMedia('print')

mql.addEventListener('change', (event) => {
  const detailEls = document.querySelectorAll('details')

  detailEls.forEach(detailEl => {
    if (event.matches) {
      detailEl.open = true
    } else if (detailEl.open) {
      detailEl.open = false
    }
  })
})
@rpearce rpearce self-assigned this Jul 13, 2023
@rpearce rpearce changed the title Print-friendly details element content with JavaScript Enable print-friendly details HTML element content with JavaScript Jul 14, 2023
@rpearce rpearce changed the title Enable print-friendly details HTML element content with JavaScript Enable print-friendly details HTML element content with only a few lines of JavaScript Jul 14, 2023
@rpearce rpearce changed the title Enable print-friendly details HTML element content with only a few lines of JavaScript Show print-friendly details HTML elements' content with only a few lines of JavaScript Jul 14, 2023
@rpearce rpearce changed the title Show print-friendly details HTML elements' content with only a few lines of JavaScript Show print-friendly HTML details elements' content with only a few lines of JavaScript Jul 14, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant