script a seconda della risoluzione

[klavs]

Ciao a tutti, ho uno slider di news che è impostato per visualizzarne due per volta. Vorrei modificarlo in modo da fargliene visualizzare una per volta solo su dispositivi mobili. Il codice è questo

  var itemCnt_medium_two = 2; // this will be the number of columns per row
  var iWidth_medium_two = parseFloat(jQuery('.flexslider-medium-two').width() / itemCnt_medium_two);
  jQuery('.flexslider-medium-two').flexslider({
    animation: "slide",
    slideshow: true, //Boolean: Animate slider automatically
    startAt: 0,
    animationLoop: true,
    prevText: "<span>Previous</span>", //String: Set the text for the "previous" directionNav item
    nextText: "<span>Next</span>",
    itemWidth: iWidth_medium_two,
    minItems: 1,
    maxItems: itemCnt_medium_two,
    touch: true
  });

ho provato a modificarlo come segue, ma ne visualizzo sempre due

   if (screen.width >= 1024) {var itemCnt_medium_two = 2; // this will be the number of columns per row
  }

else {var itemCnt_medium_two = 1; // this will be the number of columns per row
    }
  var iWidth_medium_two = parseFloat(jQuery('.flexslider-medium-two').width() / itemCnt_medium_two);
  jQuery('.flexslider-medium-two').flexslider({
    animation: "slide",
    slideshow: true, //Boolean: Animate slider automatically
    startAt: 0,
    animationLoop: true,
    prevText: "<span>Previous</span>", //String: Set the text for the "previous" directionNav item
    nextText: "<span>Next</span>",
    itemWidth: iWidth_medium_two,
    minItems: 1,
    maxItems: itemCnt_medium_two,
    touch: true
  });

Non sono molto pratico di javascript, sapete dove stò sbagliando?

[vic53]

fai il debug e visualizza i valori, nel test convertili nello stesso tipo per es. if (parseInt(xxx)>=parseInt(yyy))...
e vedi se risolvi..
ciao

[vic53]

la variabile itemCnt_medium_two devi definirla in testa come globale con ... var itemCnt_medium_two=2... fuori dalle if...

poi quando gli cambi il valore devi solo usare itemCnt_medium_two = 1 e basta...
per esempio...

[klavs]

Grazie per le risposte,
ho provato a fare come dici però non è cambiato niente. Non so come si fa il debug, ho provato a installare firebug però non ho capito come si usa. Comunque ho risolto in questa maniera, sembra funzionare.

if (document.documentElement.clientWidth > 1024) {var itemCnt_medium_two = 2; // this will be the number of columns per row
     }
if (document.documentElement.clientWidth < 1024) {var itemCnt_medium_two = 1; // this will be the number of columns per row
     }
  var iWidth_medium_two = parseFloat(jQuery('.flexslider-medium-two').width() / itemCnt_medium_two);
  jQuery('.flexslider-medium-two').flexslider({
    animation: "slide",
    slideshow: true, //Boolean: Animate slider automatically
    startAt: 0,
    animationLoop: true,
    prevText: "<span>Previous</span>", //String: Set the text for the "previous" directionNav item
    nextText: "<span>Next</span>",
    itemWidth: iWidth_medium_two,
    minItems: 1,
    maxItems: itemCnt_medium_two,
    touch: true
  });