2017-11-23 5 views
-1

현재 스크롤 관련 작업을하고 있습니다.JavaScript를 클릭 한 후 창 아래쪽에 버튼을 설정하는 방법은 무엇입니까?

웹 페이지가 있습니다. 웹 페이지에는 탐색 경로와 바닥 글이 있으며, 탐색 경로는 바닥 글의 맨 위에 위치하며 클릭 버튼 하나는 탐색 경로 상단에 있습니다. 최종 사용자가 페이지를 스크롤 할 때마다 이동 경로 상단에있는 클릭 버튼을 볼 수 있습니다. 내 현재 요구 사항은 최종 사용자가 단추를 클릭 할 때마다 단추와 이동 경로가 창의 아래쪽에 있어야하며 바닥 글은주의해야합니다. 또한 최종 사용자가 버튼을 클릭 한 후 스크롤하면 이제 페이지 하단까지 스크롤 할 수 있습니다.

scrollTo를 사용하여 구현하려고했지만 실패했습니다. 누구든지 이것을 구현하는 방법을 제안하십시오.

JS :

$(".button").click(function() { 
    var windowHeight = $(window).height(); 
    var headerHeight = $('header').height(); // header part 
    var bodyWrapperHeight = $('.body-wrapper').height(); // body part 
    var windowBodyHeight = Math.abs(windowHeight) - Math.abs(bodyWrapperHeight); 
    var scrollTotalWithHeader = Math.abs(windowBodyHeight) + Math.abs(headerHeight); 
    var scrollTotalWithoutHeader = Math.abs(windowBodyHeight) - Math.abs(headerHeight); 
    if(Math.abs(windowBodyHeight) > Math.abs(headerHeight)) { 
     $("body, html").animate({ 
      scrollTop: Math.abs(scrollTotalWithHeader) 
     }, { 
      duration: 600, 
      complete: function(){ 
       scrollLock = true; 
      } 
     }); 

    } else { 
     $("body, html").animate({ 
      scrollTop: Math.abs(scrollTotalWithoutHeader) 
     }, { 
      duration: 600, 
      complete: function(){ 
       scrollLock = true; 
      } 
     }); 
    } 
}); 
+1

미안하지만, 날 잃어 버렸어. 다음 중 하나가 있습니까 : 코드 예; 스크린 샷; 작업 데모 (jsfiddle, jsbin)? –

+0

@MattFletcher, 지연에 대해 사과드립니다. 내 js 코드를 추가했습니다. – jinfy

답변

0

난 정말 u는 u는 단순 또는 데모를 설명 할 수있는 경우

var btn1=document.getElementById("btn1"); 
 
\t var btn=document.getElementById("btn"); 
 

 
btn1.addEventListener("click", btnsettobtm); 
 
function btnsettobtm() 
 
{ 
 
\t btn.style.position="fixed"; 
 
\t btn.style.right="10px"; 
 
\t btn.style.bottom="10px"; 
 
}
<input type="button" name="btn1" id="btn1" value="button"> 
 

 

 
<input type="button" name="btn" id="btn" value="Btn Is Here!">

내가 유를 도울 수 원하는 것을 이해 해달라고 죄송합니다, 더 쉽고, 미안.

관련 문제