Skip to main content
removeu 17 caracteres do conteúdo
Fonte Link
Miguel
  • 29,5mil
  • 5
  • 43
  • 80

jQuery, resize dobra chamadadeixar de executar funções consoante tamanho da janela, também no resize

Estou a trabalhar num site que chama ficheiros JS externos consoante o tamanho da janela. O problema é que quando gostava que algumas funções de deixassem de correr em desktop quando ($(window).width() < 800). O problema é que quando faço resize a chamada das funções é repetida. Eu tenho o seguinte código e vice-versa:

jQuery, resize dobra chamada de funções

Estou a trabalhar num site que chama ficheiros JS externos consoante o tamanho da janela ($(window).width()). O problema é que quando faço resize a chamada das funções é repetida. Eu tenho o seguinte código:

jQuery, deixar de executar funções consoante tamanho da janela, também no resize

Estou a trabalhar num site que chama ficheiros JS externos. O problema é que quando gostava que algumas funções de deixassem de correr em desktop quando $(window).width() < 800 e vice-versa:

adicionou 130 caracteres ao conteúdo
Fonte Link
Miguel
  • 29,5mil
  • 5
  • 43
  • 80
...

<link rel="stylesheet" media='screen and (min-width: 801px)' href ="css/styles.css">
<link rel="stylesheet" media='screen and (max-width: 800px)' href ="css/stylesMob.css"> 


<script type="text/javascript">
       javascript" src="js/desktopLayout.js"></script>
   <script type="text/javascript" src="js/mobileLayout.js"></script>   var type = 'text/javascript';
        

desktopLayout.js:

var srcresolucao = ($(window).width() > 800) ? "js/desktopLayout.js"'desktop' : "js/mobileLayout.js";
        $('head').append('<script type ="' +type+ '" src="' +src+ '">');
'mobile';
    $(window).resize(function(){
        $('script[src $= "Layout.js"]').remove();
        var type = 'text/javascript';
        var srcresolucao = ($(window).width() > 800) ? "js/desktopLayout.js"'desktop' : "js/mobileLayout.js";'mobile';
        $('head')console.appendlog('<script type ="' +type+ '" src="' +src+ '">'resolucao);
    })
 ;
</script>

desktopLayout.js:

...
//funções todas aqui
...
 
function runSiteDesktopslide4Slider() {

if (resolucao != 'desktop') varreturn;

$("#photosSlide4 resolucao> =div:eq(0) $img:gt(window0)").widthfadeOut(0);
$("#photosSlide4 > 800 ? 'desktop' div:eq(1) 'mobile';img:gt(0)").fadeOut(0);
 $("#photosSlide4 > div:eq(2) $img:gt(window0)").resizefadeOut(0);

setInterval(function(){
 {  
    $('#photosSlide4 resolucao> =div:eq(0) $img:eq(window0)').widthfadeOut(800).next().fadeIn(300).end().appendTo('#photosSlide4 > 800 ? 'desktop' div: 'mobile';eq(0)');
    $('#photosSlide4 > div:eq(1) consoleimg:eq(0)').logfadeOut(resolucao800);
  .next().fadeIn(300).end().appendTo('#photosSlide4 > }div:eq(1)');
 
    if $(resolucao'#photosSlide4 !=> 'desktop'div:eq(2) {
       return; // usar sempre no seu códigoimg:eq(0)').fadeOut(800).next().fadeIn(300).end().appendTo('#photosSlide4 esta> verificaçãodiv:eq(2)');
    },  3000);
else
}

function runSiteDesktop() { 

   phrasesMarginsRandomSLide1();
   pizzasSlider3Animations();
   navSlider3HoverPhrase();
   arrowsLeftRightSlide();
   sizingAndRisizing();
   navBarAnimation();
   contactFancyBox();
   logoAnimation();
   navBarSlider();
   scrollEvents();
   slide4Slider();
}

}

$(document).ready(function() {
    runSiteDesktop();
});
...

<link rel="stylesheet" media='screen and (min-width: 801px)' href ="css/styles.css">
<link rel="stylesheet" media='screen and (max-width: 800px)' href ="css/stylesMob.css">

<script type="text/javascript">
        
        var type = 'text/javascript';
        var src = ($(window).width() > 800) ? "js/desktopLayout.js" : "js/mobileLayout.js";
        $('head').append('<script type ="' +type+ '" src="' +src+ '">');

    $(window).resize(function(){
        $('script[src $= "Layout.js"]').remove();
        var type = 'text/javascript';
        var src = ($(window).width() > 800) ? "js/desktopLayout.js" : "js/mobileLayout.js";
        $('head').append('<script type ="' +type+ '" src="' +src+ '">');
    })
 
</script>

desktopLayout.js:

...
//funções todas aqui
...
 
function runSiteDesktop() {

    var resolucao = $(window).width() > 800 ? 'desktop' : 'mobile';
    $(window).resize(function(){
       resolucao = $(window).width() > 800 ? 'desktop' : 'mobile';
       console.log(resolucao);
    });
 
    if (resolucao != 'desktop') {
       return; // usar sempre no seu código esta verificação
    }  
else {
   phrasesMarginsRandomSLide1();
   pizzasSlider3Animations();
   navSlider3HoverPhrase();
   arrowsLeftRightSlide();
   sizingAndRisizing();
   navBarAnimation();
   contactFancyBox();
   logoAnimation();
   navBarSlider();
   scrollEvents();
   slide4Slider();
}

}

$(document).ready(function() {
    runSiteDesktop();
});
...

<link rel="stylesheet" media='screen and (min-width: 801px)' href ="css/styles.css">
<link rel="stylesheet" media='screen and (max-width: 800px)' href ="css/stylesMob.css"> 


<script type="text/javascript" src="js/desktopLayout.js"></script>
<script type="text/javascript" src="js/mobileLayout.js"></script>    
      

desktopLayout.js:

var resolucao = $(window).width() > 800 ? 'desktop' : 'mobile';
$(window).resize(function(){
    resolucao = $(window).width() > 800 ? 'desktop' : 'mobile';
    console.log(resolucao);
});

...
//funções todas aqui
...
function slide4Slider() {

if (resolucao != 'desktop') return;

$("#photosSlide4 > div:eq(0) img:gt(0)").fadeOut(0);
$("#photosSlide4 > div:eq(1) img:gt(0)").fadeOut(0);
$("#photosSlide4 > div:eq(2) img:gt(0)").fadeOut(0);

setInterval(function() {  
    $('#photosSlide4 > div:eq(0) img:eq(0)').fadeOut(800).next().fadeIn(300).end().appendTo('#photosSlide4 > div:eq(0)');
    $('#photosSlide4 > div:eq(1) img:eq(0)').fadeOut(800).next().fadeIn(300).end().appendTo('#photosSlide4 > div:eq(1)');
    $('#photosSlide4 > div:eq(2) img:eq(0)').fadeOut(800).next().fadeIn(300).end().appendTo('#photosSlide4 > div:eq(2)');
},  3000);

}

function runSiteDesktop() { 

   phrasesMarginsRandomSLide1();
   pizzasSlider3Animations();
   navSlider3HoverPhrase();
   arrowsLeftRightSlide();
   sizingAndRisizing();
   navBarAnimation();
   contactFancyBox();
   logoAnimation();
   navBarSlider();
   scrollEvents();
   slide4Slider();

}

$(document).ready(function() {
    runSiteDesktop();
});
adicionou 363 caracteres ao conteúdo
Fonte Link
Miguel
  • 29,5mil
  • 5
  • 43
  • 80

Link dos ficheiros JS/CSS externos: HTML tag HEAD:

...

<link rel="stylesheet" media='screen and (min-width: 801px)' href ="css/styles.css">
<link rel="stylesheet" media='screen and (max-width: 800px)' href ="css/stylesMob.css">

<script type="text/javascript">
        
        var type = 'text/javascript';
        var src = ($(window).width() > 800) ? "js/desktopLayout.js" : "js/mobileLayout.js";
        $('head').append('<script type ="' +type+ '" src="' +src+ '">');

    $(window).resize(function(){
        $('script[src $= "Layout.js"]').remove();
        var type = 'text/javascript';
        var src = ($(window).width() > 800) ? "js/desktopLayout.js" : "js/mobileLayout.js";
        $('head').append('<script type ="' +type+ '" src="' +src+ '">');
    })

</script>
...
//funções todas aqui
...

function runSiteDesktop() {

    phrasesMarginsRandomSLide1var resolucao = $(window).width() > 800 ? 'desktop' : 'mobile';
    $(window).resize(function(){
       resolucao = $(window).width() > 800 ? 'desktop' : 'mobile';
       console.log(resolucao);
    pizzasSlider3Animations});

    if (resolucao != 'desktop') {
       return; // usar sempre no seu código esta verificação
    }  
else {
   phrasesMarginsRandomSLide1();
   pizzasSlider3Animations();
   navSlider3HoverPhrase();
    arrowsLeftRightSlide();
    sizingAndRisizing();
    navBarAnimation();
    contactFancyBox();
    logoAnimation();
    navBarSlider();
    scrollEvents();
    slide4Slider();
}

}

$(document).ready(function() {
    runSiteDesktop();
});

Link dos ficheiros JS externos: HTML tag HEAD:

...
<script type="text/javascript">
        
        var type = 'text/javascript';
        var src = ($(window).width() > 800) ? "js/desktopLayout.js" : "js/mobileLayout.js";
        $('head').append('<script type ="' +type+ '" src="' +src+ '">');

    $(window).resize(function(){
        $('script[src $= "Layout.js"]').remove();
        var type = 'text/javascript';
        var src = ($(window).width() > 800) ? "js/desktopLayout.js" : "js/mobileLayout.js";
        $('head').append('<script type ="' +type+ '" src="' +src+ '">');
    })

</script>
...
//funções todas aqui
...

function runSiteDesktop() {

    phrasesMarginsRandomSLide1();
    pizzasSlider3Animations();
    navSlider3HoverPhrase();
    arrowsLeftRightSlide();
    sizingAndRisizing();
    navBarAnimation();
    contactFancyBox();
    logoAnimation();
    navBarSlider();
    scrollEvents();
    slide4Slider();

}

$(document).ready(function() {
    runSiteDesktop();
});

Link dos ficheiros JS/CSS externos: HTML tag HEAD:

...

<link rel="stylesheet" media='screen and (min-width: 801px)' href ="css/styles.css">
<link rel="stylesheet" media='screen and (max-width: 800px)' href ="css/stylesMob.css">

<script type="text/javascript">
        
        var type = 'text/javascript';
        var src = ($(window).width() > 800) ? "js/desktopLayout.js" : "js/mobileLayout.js";
        $('head').append('<script type ="' +type+ '" src="' +src+ '">');

    $(window).resize(function(){
        $('script[src $= "Layout.js"]').remove();
        var type = 'text/javascript';
        var src = ($(window).width() > 800) ? "js/desktopLayout.js" : "js/mobileLayout.js";
        $('head').append('<script type ="' +type+ '" src="' +src+ '">');
    })

</script>
...
//funções todas aqui
...

function runSiteDesktop() {

    var resolucao = $(window).width() > 800 ? 'desktop' : 'mobile';
    $(window).resize(function(){
       resolucao = $(window).width() > 800 ? 'desktop' : 'mobile';
       console.log(resolucao);
    });

    if (resolucao != 'desktop') {
       return; // usar sempre no seu código esta verificação
    }  
else {
   phrasesMarginsRandomSLide1();
   pizzasSlider3Animations();
   navSlider3HoverPhrase();
   arrowsLeftRightSlide();
   sizingAndRisizing();
   navBarAnimation();
   contactFancyBox();
   logoAnimation();
   navBarSlider();
   scrollEvents();
   slide4Slider();
}

}

$(document).ready(function() {
    runSiteDesktop();
});
Fonte Link
Miguel
  • 29,5mil
  • 5
  • 43
  • 80
Carregando