Javascript - help editing so button is not visible

Oct 10, 2020

Hi folks,

I'm working on a project where the client wants a printable certificate of completion. I know this has been discussed numerous times, but I can't quite find the solution to my exact issue in past discussions. I have found/edited some Javascript to execute when a user clicks a print button, however I need to hide the print button on the output (the print page itself). The code I'm working with removed the menu and other items (yay!) but does not allow me to remove the button itself from showing on the print product.

Here is the Javascript I'm working with:

Appreciate any help/thoughts you can provide!!

Thanks,
Dana

6 Replies

Sam Hill
Hero

over 3 years ago10/12/20 at 4:32 am (UTC)

Hi Dana, it's hard to know why the print button isn't hiding without seeing the print buttons definition in the HTML. What I can see is that the code above isn't quite right. There are one too many closing curly braces '}'. I've adjusted below.

If the below update doesn't fix things for you, can you provide some published output (stripped down version) demonstrating the problem.

var styles = '@media print {
body, * { visibility: hidden; }
html, body { overflow: hidden; transform: translateZ(0); }
#slide {
transform: scale(1.09) !important;
}
#wrapper {
transform: scale(1) !important;
}
#slide,
#wrapper {
width: 100% !important;
height: 100% !important;
overflow: visible !important;
}
#frame {
overflow: visible !important;
}
.slide-transition-container {
overflow: visible !important;
}
@page {size: A4 landscape;max-height:99%; max-width:99%}
.slide-container, .slide-container * {
visibility: visible !important;
margin-top: 0px !important;
margin-left: 0px !important;
}
#outline-panel {
display: none !important;
}
}'
var stylesheet = document.createElement('style');
stylesheet.type = 'text/css';
stylesheet.innerText = styles;
document.head.appendChild(stylesheet);
window.print();