{"id":63,"date":"2011-02-22T17:36:00","date_gmt":"2011-02-22T17:36:00","guid":{"rendered":"http:\/\/artigos.marcomapa.com\/?p=63"},"modified":"2013-06-06T13:52:26","modified_gmt":"2013-06-06T13:52:26","slug":"ajustar-site-de-acordo-com-a-resolucao-da-tela","status":"publish","type":"post","link":"https:\/\/marcomapa.com\/artigos\/ajustar-site-de-acordo-com-a-resolucao-da-tela\/","title":{"rendered":"Ajustar Site de acordo com a resolu\u00e7\u00e3o da tela"},"content":{"rendered":"<p>T\u00e1 a\u00ed uma d\u00favida que pega qualquer desenvolvedor que est\u00e1 come\u00e7ando. Como fazer com que um site fique bonitinho em qualquer monitor que acess\u00e1-lo?<\/p>\n<p>Existem diversas maneiras para isso, vou mostrar aqui a mais d\u00f3cil pra quem t\u00e1 come\u00e7ando agora a sofrer com web desenvolvimento.<\/p>\n<p>Basta adicionar o script abaixo em uma p\u00e1gina salva com o nome de \"index.html\". (sem as aspas pelor amor de Deus). Assim o c\u00f3digo se encarregar\u00e1 a descobrir qual a resolu\u00e7\u00e3o que cada visitante usa. E depois ele encaminha para a p\u00e1gina correta. Claro, voc\u00ea precisa criar uma p\u00e1gina com o layout para cada monitor.<\/p>\n<p><script language=\"JavaScript\"><\/p>\n<p>\/*<\/p>\n<p>Redireciona de acordo com a resolu\u00e7\u00e3o<\/p>\n<p>*\/<\/p>\n<p>\/\/para resolu\u00e7\u00e3o 800x600<\/p>\n<p>if (screen.width==800<\/p>\n<p>screen.height==600) <\/p>\n<p>window.location.replace(\"800600\/index.php\")<\/p>\n<p>\/\/para resolu\u00e7\u00e3o 640x480<\/p>\n<p>else if (screen.width==640<\/p>\n<p>screen.height==480) <\/p>\n<p>window.location.replace(\"640480\/index.php\")<\/p>\n<p>\/\/para resolu\u00e7\u00e3o 1024x768<\/p>\n<p>else if (screen.width==1024<\/p>\n<p>screen.height==768) <\/p>\n<p>window.location.replace(\"1240768\/index.php\")<\/p>\n<p>\/\/para outras resolu\u00e7\u00f5es<\/p>\n<p>else <\/p>\n<p>window.location.replace(\"1240768\/index.php \") <\/p>\n<p><\/script><\/p>\n<div class=\"separator\" style=\"clear: both; text-align: center;\"><\/div>\n<div class=\"separator\" style=\"clear: both; text-align: center;\"><\/div>\n<p><\/p>\n<div class=\"separator\" style=\"clear: both; text-align: center;\"><\/div>\n<div class=\"separator\" style=\"clear: both; text-align: center;\"><a href=\"http:\/\/3.bp.blogspot.com\/-A1UPT7sf2Ls\/TWP3VW9Iq9I\/AAAAAAAAALE\/dmLG1au0GOQ\/s1600\/Capturar.PNG\" imageanchor=\"1\" style=\"margin-left: 1em; margin-right: 1em;\"><img decoding=\"async\" border=\"0\" j6=\"true\" src=\"http:\/\/3.bp.blogspot.com\/-A1UPT7sf2Ls\/TWP3VW9Iq9I\/AAAAAAAAALE\/dmLG1au0GOQ\/s1600\/Capturar.PNG\" \/><\/a><\/div>\n<p>&nbsp;<script language=\"JavaScript\"><\/p>\n<p>\/*<\/p>\n<p>Redireciona de acordo com a resolu\u00e7\u00e3o<\/p>\n<p>*\/<\/p>\n<p>\/\/para resolu\u00e7\u00e3o 800x600<\/p>\n<p>if (screen.width==800<\/p>\n<p>screen.height==600) <\/p>\n<p>window.location.replace(\"800600\/index.php\")<\/p>\n<p>\/\/para resolu\u00e7\u00e3o 640x480<\/p>\n<p>else if (screen.width==640<\/p>\n<p>screen.height==480) <\/p>\n<p>window.location.replace(\"640480\/index.php\")<\/p>\n<p>\/\/para resolu\u00e7\u00e3o 1024x768<\/p>\n<p>else if (screen.width==1024<\/p>\n<p>screen.height==768) <\/p>\n<p>window.location.replace(\"1240768\/index.php\")<\/p>\n<p>\/\/para outras resolu\u00e7\u00f5es<\/p>\n<p>else <\/p>\n<p>window.location.replace(\"1240768\/index.php \") <\/p>\n<p><\/script> &nbsp;&nbsp;&nbsp; <br \/>O c\u00f3digo \u00e9 curto, mas funcional!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>T\u00e1 a\u00ed uma d\u00favida que pega qualquer desenvolvedor que est\u00e1 come\u00e7ando. Como fazer com que um site fique bonitinho em<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[17],"tags":[],"class_list":["post-63","post","type-post","status-publish","format-standard","hentry","category-design"],"_links":{"self":[{"href":"https:\/\/marcomapa.com\/artigos\/wp-json\/wp\/v2\/posts\/63","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/marcomapa.com\/artigos\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/marcomapa.com\/artigos\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/marcomapa.com\/artigos\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/marcomapa.com\/artigos\/wp-json\/wp\/v2\/comments?post=63"}],"version-history":[{"count":2,"href":"https:\/\/marcomapa.com\/artigos\/wp-json\/wp\/v2\/posts\/63\/revisions"}],"predecessor-version":[{"id":497,"href":"https:\/\/marcomapa.com\/artigos\/wp-json\/wp\/v2\/posts\/63\/revisions\/497"}],"wp:attachment":[{"href":"https:\/\/marcomapa.com\/artigos\/wp-json\/wp\/v2\/media?parent=63"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/marcomapa.com\/artigos\/wp-json\/wp\/v2\/categories?post=63"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/marcomapa.com\/artigos\/wp-json\/wp\/v2\/tags?post=63"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}