Benvenuti su htDOCS, la vetrina web di Alessandro Buzzoni, per saperne di piu' e per i tuoi commenti segui il link





12 Ott 2008 » Email This Post

WP, cambiare CSS in base alla risoluzione dello schermo

Nell'ultimo progetto realizzato, ho avuto la necessità di creare due diversi CSS e di caricare il primo o il secondo in base alla risoluzione dello schermo, in particolare mi interessava l'altezza. Per fare in modo che Wordpress caricasse il giusto CSS ho inserito il seguente codice nel file header.php del tema utilizzato:

<script type="text/javascript">
  if (screen.height>= 1024) {
  document.write("<link rel='stylesheet' href='<?php bloginfo('stylesheet_url'); ?>' type='text/css' media='screen' />");
  }
  else {
  document.write("<link rel='stylesheet' href='<?php bloginfo('template_url'); ?>/style-small-screen.css' type='text/css' media='screen' />");
  }
</script>

eliminando chiaramente la stringa di default:

<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />

in questo modo, se il visitatore utilizza un monitor con risoluzione di almeno 1024 pixel di altezza, viene caricato il CSS di default, altrimenti viene caricato il CSS secondario. Ovviamente con qualche piccola modifica, il codice è utilizzabile in qualsiasi pagina web, e non solo in Wordpress.

• Autore: Aless{a}ndro
• Archiviato in: Web, curiosità e non solo, Wordpress
Tags: , , , , , ,

Lascia un commento

SEARCH ALL POSTS

PER APPROFONDIRE

BLOG CATEGORIES

LINK INTERESSANTI

TAG FREQUENTI

RSS News Feed

Top