Mostrare o meno banner pubblicitari a seconda la risoluzione del device
Buona sera a tutti. Premetto che non ho mai studiare il linguaggio Java e che voglio utilizzarlo solo esclusivamente per un'operazione credo semplice, e nulla più.
Sto realizzando un sito responsive e voglio che, a seconda la risoluzione del dispositivo sul quale viene visualizzata la pagina web, compaia un banner di una certa grandezza piuttosto che di un'altra, onde evitare scroll orizzontali.
Inizialmente avevo risolto semplicemente con CSS e media query, utilizzando display:none. Efficace per quel che riguarda la visibilità dell'oggetto, ma non per il caricamento della pagina, in quanto il banner non è visualizzato dal browser ma è comunque caricato.
Mi sono imbattuto allora in questa guida del sito html.it (http://www.html.it/pag/33422/caricam...dei-contenuti/) e ho realizzato questo codice che, come mi aspettavo data la mia inesperienza Java, non funziona. Sapreste dirmi cosa sbaglio?
Nella parte HTML ho implementato così gli script in body (per velocizzare):
Codice:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="js/ads.js"></script>
e così i div contenitori (non li metto tutti):
Codice:
<div id="video-banner">
</div>
<div id="button-banner1">
</div>
Nel file ads.js ho scritto questo codice:
Codice:
var upAdsBase = function() {
$("#video-banner").load("../ads/video-banner.html");
$("#button-banner2").load("../ads/button-banner2.html");
$("#button-banner3").load("../ads/button-banner3.html");
$("#button-banner4").load("../ads/button-banner4.html");
};
var upAds319 = function() {
$("#button-banner1").load("../ads/button-banner1.html");
$("#button-banner2").load("../ads/button-banner2.html");
$("#button-banner3").load("../ads/button-banner3.html");
$("#button-banner4").load("../ads/button-banner4.html");
};
var upAds360 = function() {
$("#video-banner").load("../ads/video-banner.html");
$(".large-box-banner").load("../ads/large-box-banner.html");
};
if (document.documentElement.clientWidth <= 319) {
upAds319();
}
if (document.documentElement.clientWidth >= 320 <= 359) {
upAdsBase();
}
if (document.documentElement.clientWidth >= 360) {
upAds360();
}
