Serve Image variation only for print

[louisstephens]

I have been scratching my head on this one for a while, so I thought maybe someone could shed some light on this issue. I am using a grid layout (that I have created over the years) with a class for responsive images (very similar to bootstrap, but very stripped down). Using this, I created a gallery using a foreach loop, and included a "print button" to print each image. I got the classes and everything worked out, but I ran into a small problem with the print functionality. My images (which are around 2400px wide to fill the space) are just fine in the grid and on resize, but when I print, they "run off" the page. I understand that they are just too big to be printed in portrait mode, which led to me think that I could use $image->size(); to print a scaled down version of the image (which adds a bit more load time as now the site needs to load the image large scale and the scaled down version). However, I can't seem to wrap my head around serving just the scaled down version for print only (obviously display:none; doesn't do the trick). Has anyone tackled this before, or does anyone know of a more elegant solution to the conundrum that I have found myself in?

The Foreachloop:

$printclass = 1;
	foreach($page->galleries as $gallery) {
		$printclass++;
		$printimage = $gallery->gallery_image->width(600)->url;
		$out = "";
		$out .= "<div class=\"row\">";
		$out .= "<div class=\"grid-12\">";
		$out .= "<img src=\"{$gallery->gallery_image->url}\" class=\"reimage\"/>";
		$out .= "</div>";
		$out .= "</div>";
					
		$out .= "<div class=\"row\">";
		$out .= "<div class=\"grid-12\">";
		$out .= "<a href=\"#\" onClick=\"printCoupon('printable{$printclass}');\">Print</a>";
		$out .= "</div> ";
		$out .= "</div> ";

		$out .="<div id=\"printable{$printclass}\"><img src=\"{$printimage}\"/></div>";
		echo $out;
	}

 

 

[LostKobrakai]

You might want to take a look at this or other resources on the topic: https://www.smashingmagazine.com/2011/11/how-to-set-up-a-print-style-sheet/

[louisstephens]

Duh, once again overcomplicating things. Thanks @LostKobrakai, I missed the forest for the trees.