How to toggle Print Preview for Browsers

Learn how to toggle the print preview modal for all browsers using JavaScript

Created on Jan 02, 2022

•

83 views

To toggle the print preview on all browsers you can make use of the "print()" method available to the "window" global object.

Toggle Print Preview using JavaScript

window.print()

You can bind this to a button onclick method and right away after the button is pressed, the print preview of each respective browser will be shown to the user.

Print Preview on Firefox

Print Preview on Chrome

JavaScript Snippets

new

If you like our tutorial, do make sure to support us by being our Patreon or buy us some coffee ☕️

Patreon

Previous Snippet

How to get mime type from storage class in Laravel

Next Snippet

How to easily switch PHP version and update configuration on macOS Monterey

Load comments for How to toggle Print Preview for Browsers

new

PostSrc Code Components

Collection of Tailwind CSS components for everyone to use. Browse all of the components that are right for your project.

View Components

Share this snippet

Sponsors 👑

+ Add Yours

Device Beast

Other Code Snippets

All Snippets

How to Export CSV Data in Laravel Using Tinkerwell

9 months ago

How to Pass Data From Livewire Component to Layout Page

10 months ago

How to get Select2 Values for Both Single and Multiselect

7 months ago

How to Customize Default Error Pages in Laravel 8

10 months ago

How to enable cache for s3 Filesystem Driver (Disk Caching)

4 months ago

How to Add Page Transition In Inertia JS

3 days ago