Не работает функция в Opera

286

24 апреля 2017, 04:07

Подскажите, почему не работает эта функция в Opera и как исправить. Хочу, при изменении ширины экрана показывать разные блоки, работает везде, кроме оперы.

function windowSize(){ 
 
$('.div1').stop().show(0); 
$('.div2').stop().hide(0); 
$('.div3').stop().hide(0); 
 
if ($(window).width() >= '1000'){ 
$('.div2').stop().show(0); 
$('.div1').stop().hide(0); 
$('.div3').stop().hide(0); 
} 
 
if ($(window).width() >= '1200'){ 
$('.div3').stop().show(0); 
$('.div1').stop().hide(0); 
$('.div2').stop().hide(0); 
} 
} 
$(window).on('load resize',windowSize);

div.box { 
width: 300px; 
height: 200px; 
display: none; 
}

<div class="box div1">1</div> 
 
<div class="box div2">2</div> 
 
<div class="box div3">3</div>

Answer 1

function windowSize() { 
  var div1 = $('.div1').stop() 
    , div2 = $('.div2').stop() 
    , div3 = $('.div3').stop() 
    , width = $(window).width(); 
  if (width >= 1200) { 
    div3.show(0); 
    div1.hide(0); 
    div2.hide(0); 
  } 
  else if (width >= 1000) { 
    div2.show(0); 
    div1.hide(0); 
    div3.hide(0); 
  } 
  else { 
    div1.show(0); 
    div2.hide(0); 
    div3.hide(0); 
  } 
} 
   
$(function() { 
  $(window).resize(function() { 
    windowSize(); 
  }).resize(); 
});

div.box { 
  border: 1px solid; 
  display: none; 
  height: 200px; 
  width: 300px; 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div class="box div1">1</div> 
<div class="box div2">2</div> 
<div class="box div3">3</div>