2016-04-13 24 views
0

Kullanıcıların jQuery .scroll/.scrollTop işlevini kullanarak belirli bir piksel miktarını kaydırdıktan sonra bir bülten aboneliği açılır penceresini yüklemek için JQuery komut dosyası kullanıyorum. Şu andaTüm sayfa yüklenene kadar JQuery yürütmesini bekleyin. Yürütme

hepsi

jQuery(document).ready(function($) 

sorun içinde kapsüllü oluyor zamanki önbelleğe alma ve görüntüleri konudur ve abonelik kutusu her yerde açılır. Sayfa tamamen yüklenene kadar jQuery'yi .load işlevini kullanarak geciktirmeyi okuyordum. Ancak işlevsellik sonları tamamen

jQuery(window).load(function($){ 
    //your code here 
}); 

ile

jQuery(document).ready 

değiştirdiğinizde. şu anda olduğu gibi burada


function enfold_child_custom_scripts(){ 

    // Register and Enqueue a Script 
    // get_stylesheet_directory_uri will look up child theme location 
    wp_register_script('custom-js', get_stylesheet_directory_uri() . '/custom.js', array('jquery')); 
    wp_enqueue_script('custom-js'); 

} 

add_action('wp_enqueue_scripts', 'enfold_child_custom_scripts'); 

benim JS/jQuery kodu şöyledir:

böyle kuyruğa senaryoyu ben WordPress kullanıyorum unutmayın ve sahip olmak istiyorum.

jQuery(document).ready(function($) { 

    jQuery("#nl-pop").hide(); //hide nl block initially 
    var disableFade = "false"; 

    var startShowTop = jQuery("#newsletter-cta").offset().top - 3500; 
    var startHide = jQuery("#newsletter-cta").offset().top - jQuery(window).height(); //Hide when the viewport is reached 

    jQuery('#no-thanks').click(function(event) { 
     event.preventDefault(); 
     jQuery('#nl-pop').fadeOut('slow'); 
     disableFade = "true"; 
    }); 
jQuery(window).scroll(function() { 
     if(jQuery(window).scrollTop() < (startShowTop)) //when scrollposition is smaller than the first point 
     { 
      jQuery("#nl-pop").fadeOut(200); // Hide when in the upper part of the page 
     } 
     else //when reached the lower part of the page 
     { 
      if(jQuery(window).scrollTop() > startShowTop && $(window).scrollTop() < startHide && disableFade==="false") { //When reached the show position but not as far down as the hide position 
       jQuery("#nl-pop").fadeIn(200); //show 
      } 

      else if(jQuery(window).scrollTop() > (startHide)) { //scrolled down to the bottom newsletter box 
       jQuery("#nl-pop").fadeOut(200); //hide 
      } 
     } 

    }); 
}); 
+0

Zaten '$' 'hazır' ifadesine geçtiniz. 'Hazır' bloğu içinde 'jQuery' yerine' $ 'kullanmak güvenlidir. – 4castle

+0

** Not: ** 'infold_child_custom_scripts()' işleviniz için artık ** wp_register_script() ** kullanmanıza gerek yoktur, çünkü şimdi ** wp_enqueue_script() ** içinde birleştirilmiştir. Her iki satırı da yalnızca bir tane ile değiştirebilirsiniz: 'wp_enqueue_script ('custom-js', get_stylesheet_directory_uri(). '/custom.js', dizi ('jquery'));' [** Kodeks referansı - wp_enqueue_script() **] (https://developer.wordpress.org/reference/functions/wp_enqueue_script/). – LoicTheAztec

+0

Bunun için teşekkürler! –

cevap

0
.scroll() içinde olmak startShowTop ve startHide hesaplanmasını hareket

. Bu sayede değerleri boştaki elemanlardan zarar görmeyecek. Bunun yerine, sayfanın mevcut durumuna (muhtemelen tüm sayfanın yüklenmesinden sonra olacak) bağımlı olacaktır.

İlgili konular