James Bachini

Resizing images and adjusting landing pages based on screen resolution

So many browsers so many different screen resolutions. Here’s a way to modify html code based on the screen resolution of the browser. In this example I have changed an image but there is no reason why you cant change text, font size or even use it to redirect users who have mobile sized screens.

<SCRIPT>
<!--
if ((screen.width>=1280) && (screen.height>=720))
{
document.write("<img src=\"images/pic.png\" />");
}
else
{
document.write("<img src=\"images/picsmall.png\" />");
}
//-->
</SCRIPT>

Remember to check your landing pages on all screen resolutions. Users with crappy displays still convert and if you’re landing page looks rubish on them you are losing ROI.

adjust screen resolution

Get The Blockchain Sector Newsletter, binge the YouTube channel and connect with me on Twitter

The Blockchain Sector newsletter goes out a few times a month when there is breaking news or interesting developments to discuss. All the content I produce is free, if you’d like to help please share this content on social media.

Thank you.

James Bachini

Disclaimer: Not a financial advisor, not financial advice. The content I create is to document my journey and for educational and entertainment purposes only. It is not under any circumstances investment advice. I am not an investment or trading professional and am learning myself while still making plenty of mistakes along the way. Any code published is experimental and not production ready to be used for financial transactions. Do your own research and do not play with funds you do not want to lose.

Posted

in

by

James

Tags:

, , , ,