Question

我想计算另一个div元素中div元素的滚动距离。我正在使用offsetTop，但它总是在我的代码中返回0。我无法弄清楚我在哪里弄错了。

 public class Login extends FragmentActivity {

         private static final int RC_SIGN_IN = 2222;
         protected void onCreate(Bundle savedInstanceState) {
              super.onCreate(savedInstanceState);
              GoogleSignInOptions gso = new GoogleSignInOptions.Builder(GoogleSignInOptions.DEFAULT_SIGN_IN)
                                       .requestEmail()
                                       .build();
              mGoogleApiClient = new GoogleApiClient.Builder(getApplicationContext())
                                 .enableAutoManage(this /* FragmentActivity */, this /* OnConnectionFailedListener */)
                                 .addApi(Auth.GOOGLE_SIGN_IN_API, gso)
                                 .build();           
              google_Button = (SignInButton) findViewById(R.id.sign_in_button);
              google_Button.setOnClickListener(this);
    }


        public void onClick(View v) {
                 switch (v.getId()) {
                     case R.id.sign_in_button:
                     Log.d("Result: ","click google");
                     signIn();
                     break;

        }
    }


         private void signIn() {
            Intent signInIntent = Auth.GoogleSignInApi.getSignInIntent(mGoogleApiClient);
            startActivityForResult(signInIntent, RC_SIGN_IN);
    }
        public void onActivityResult(int requestCode, int resultCode, Intent data) {
            super.onActivityResult(requestCode, resultCode, data);
            if(requestCode == RC_SIGN_IN) {
            Log.d("Result: ","google sign in");
            GoogleSignInResult result = Auth.GoogleSignInApi.getSignInResultFromIntent(data);
            handleSignInResult(result);
        }

    }


        private void handleSignInResult(GoogleSignInResult result) {

        if (result.isSuccess()) {
            GoogleSignInAccount acct = result.getSignInAccount();
              Log.d("Google token: ",result.getSignInAccount().getEmail());
        } else {            
            Log.d("Google","fail");
        }
    }

function getScrollVal() {
	console.log(window.pageYOffset);
	var wrap = document.getElementById("wrapper");
	console.log(wrap.id);
	console.log(wrap.offsetParent.id);
	var parent = wrap.offsetParent;
    console.log("scrollTop: " + wrap.scrollTop + " scrollLeft: " + wrap.scrollLeft);
	console.log("offsetTop: " + wrap.offsetTop + " offsetLeft: " + wrap.offsetLeft);
  /*
  var xx = wrap.offsetLeft;
	var yy = wrap.offsetTop;
	while(wrap = wrap.offsetParent){
		xx += wrap.offsetLeft;
		yy += wrap.offsetTop;
	}
  */
 }

body, html {
	margin: 0;
	padding: 0;
}

#contain {
	position: relative;
	width:100%;
	height: 100vh;
	background: yellow;
	overflow: auto;
}
#wrapper {
	width: 85%;
	margin: 0 auto;
	background: red;
}
.full {
	height: 100vh;
	width: 85%;
	margin: 0 auto;
}
#one { background:#222;}
#two{ background:#00c590;}
#three{ background:#3429c5;}
#four{background:#bbb;}
#b {
	position: fixed;
	z-index: 1000;
	top: 30px;
	left: 30px;
}

我在评论中尝试了js代码。那个人没有提供丰硕的成果。提前谢谢。

Answer 1

由于元素#contain是溢出元素，您可以尝试像这样获取scrollTop：

console.log("scroll top:", document.getElementById('contain').scrollTop);

来自MDN：

元素的scrollTop是元素顶部与其最顶层可见内容之间距离的度量。 Element.scrollTop

获取元素的offsetTop相对于另一个元素

1 个答案: