2016-11-07 39 views
0

因此,在這個小說中,當圖像全部在窗口中時,圖像顯示出來。我需要在75%或窗口中間出現圖像。我能做些什麼?更換窗口 - 檢查位置 - 從底部到中間

$(window).on("load",function() { 
     function fade(pageLoad) { 
     var min = 0; 
     var max = 1; 
     var threshold = 0.01; 

     $(".fade").each(function() { 
      /* Check the location of each desired element */ 
      var objectBottom = $(this).offset().top + $(this).outerHeight(); 
      var windowBottom = $(window).scrollTop() + $(window).innerHeight(); 

      /* If the element is completely within bounds of the window, fade it in */ 
      if (objectBottom < windowBottom) { //object comes into view (scrolling down) 
      if ($(this).css("opacity")<=min+threshold || pageLoad) {$(this).fadeTo(300,max);} 
      } else { //object goes out of view (scrolling up) 
      if ($(this).css("opacity")>=max-threshold || pageLoad) {$(this).fadeTo(300,min);} 
      } 
     }); 
     } fade(true); //fade elements on page-load 
     $(window).scroll(function(){fade(false);}); //fade elements on scroll 
    }); 

回答

0

嗨發現此解決方案:

$(window).on("load",function() { 
     $(window).scroll(function() { 
     var winheight = $(window).innerHeight(); 
     $(".fade").each(function() { 
      /* Check the location of each desired element */ 
      var objectBottom = $(this).offset().top + $(this).outerHeight(); 
      var windowBottom = $(window).scrollTop() + $(window).innerHeight(); 

      /* If the element is completely within bounds of the window, fade it in */ 
      if (windowBottom > (objectBottom - (winheight*0.65))) { //object comes into view (scrolling down) 
      if ($(this).css("opacity")==0) {$(this).fadeTo(500,1);} 
      } else { //object goes out of view (scrolling up) 
      if ($(this).css("opacity")==1) {$(this).fadeTo(500,0);} 
      } 
     }); 
     }); $(window).scroll(); //invoke scroll-handler on page-load 
    });