check the horizontal scroll bar reached at end of webview

Question

i am working with a webview that is inside 2d scroll view so whenever i tried to get computescrollrange() ,computescrolloffset() etc so these methods are not returning any value so i want to use the javascript to detect that horizontal scroll bar reached at the end of webview so please suggest me the way how to create the function that will return the Boolean value to tell whether it is at end or not using any way either in android or javascript/jquery

Did you write this question on a mobile phone? I little more formatting, and proper punctuation would be nice. — Šime Vidas, May 06 '13 at 11:20

Karim Lee · Accepted Answer · 2013-05-06T21:54:42.437

<!DOCTYPE html>
<html>

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Scroll Detect</title>
<script type="text/javascript">
var sym=0;
var sxm=0;
var cxs=0;
var cys=0;
window.onscroll=function (){
if ('scrollMaxX' in window){
sxm=window.scrollMaxX;
sym=window.scrollMaxY;
}
else{
sxm = document.documentElement.scrollWidth - document.documentElement.clientWidth;
sym = document.documentElement.scrollHeight - document.documentElement.clientHeight;
}
if ('pageXOffset' in window) {// all browsers, except IE before version 9
cxs=window.pageXOffset;
cys=window.pageYOffset;
}
else {  // Internet Explorer before version 9    
cxs=document.documentElement.scrollLeft;
cys=document.documentElement.scrollTop;
}

if(cys==sym&&sym>0){alert("The horizontal scroller in the bottom")}
if(cxs==sxm&&sxm>0){alert("The horizontal scroller in the right")}
}
</script>
</head>
<body>
<div style="height:4000px; background:#909090; width:900px"></div>
</body>
</html>

you can repleace alert by by your function or use this less annoying with Boolean

<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Scroll Detect</title>
<script type="text/javascript">
var sym=0;
var sxm=0;
var cxs=0;
var cys=0;
var xst=false;//is horizontal scroller on top
var xsb=false;//is horizontal scroller on bottom
var ysl=false;//is vertical scroller on left
var ysr=false;//is vertical scroller on right
window.onscroll=function (){
if ('scrollMaxX' in window){// all browsers, except IE lower than 9
sxm=window.scrollMaxX;
sym=window.scrollMaxY;
}
else{ // Internet Explorer lower than 9 
sxm = document.documentElement.scrollWidth - document.documentElement.clientWidth;
sym = document.documentElement.scrollHeight - document.documentElement.clientHeight;
}
if ('pageXOffset' in window) {// all browsers, except IE lower than 9
cxs=window.pageXOffset;
cys=window.pageYOffset;
}
else { // Internet Explorer lower than 9    
cxs=document.documentElement.scrollLeft;
cys=document.documentElement.scrollTop;
}

if(cys==sym&&sym>0){xsb=true;xst=false;}
if(cxs==sxm&&sxm>0){ysr=true;ysl=false;}
if(cys==0&&sym>0){xsb=false;xst=true;}
if(cxs==0&&sxm>0){ysr=false;ysl=true;}

}
</script>
</head>
<body>
<div style="height:4000px; background:#909090; width:900px"></div>
</body>
</html>

is it working for you ??can you just change this function like that it will return boolean value whether at the horizontal end or not — Ravi, May 06 '13 at 14:56
I reccemend the second code it give all the information of all scrolers — Karim Lee, May 06 '13 at 21:56
i am using this code with android and every time it is returning that it is at right when scrolling horizontally — Ravi, May 08 '13 at 09:12
remove if(cys==sym&&sym>0){xsb=true;xst=false;} if(cys==0&&sym>0){xsb=false;xst=true;} — Karim Lee, May 08 '13 at 18:02
i am using android actually webview is inside another view to want to take the scroll pos of that view — Ravi, May 09 '13 at 03:46

score 0 · Answer 2 · answered May 08 '13 at 18:46

0

<!DOCTYPE html>
<html>

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Scroll Detect</title>
<script type="text/javascript">
var cxs=0;
var cys=0;
window.onscroll=function (){
if ('scrollMaxX' in window){
sym=window.scrollMaxY;
}
else{
sym = document.documentElement.scrollHeight - document.documentElement.clientHeight;
}
if ('pageXOffset' in window) {// all browsers, except IE before version 9
cys=window.pageYOffset;
}
else {  // Internet Explorer before version 9    
cys=document.documentElement.scrollTop;
}

if(cys==sym&&sym>0){alert("The horizontal scroller in the bottom")}
}
</script>
</head>
<body>

answered May 08 '13 at 18:46

Karim Lee

41
1
4

Actually for me it is not working because of another view otherwise for normal case it works thanks – Ravi May 09 '13 at 03:54
ok im happy to hear that – Karim Lee May 09 '13 at 11:29
thanks for help but my problem is't ovr – Ravi May 09 '13 at 11:54
could you give me a real analysis of what is the problem and what are you trying to do – Karim Lee May 09 '13 at 14:10

check the horizontal scroll bar reached at end of webview

2 Answers2