find y coordinate for cursor position in div in UIWebView
ios, javascript, objective-c, uiwebview
Solution
You can get the selected range from the selection and use its `getClientRects()` method.
Live demo: http://jsfiddle.net/timdown/xMEjD/
Code:
function getCaretClientPosition() {
var x = 0, y = 0;
var sel = window.getSelection();
if (sel.rangeCount) {
var range = sel.getRangeAt(0);
if (range.getClientRects) {
var rects = range.getClientRects();
if (rects.length > 0) {
x = rects[0].left;
y = rects[0].top;
}
}
}
return { x: x, y: y };
}
Problem
I have a UIWebView with some basic html that acts as a simple editor. ``` // in initWithFrame: of UIView subclass. _editorHTML = [@"<!doctype html>" "<html>" "<head>" "<meta name=\"viewport\" content=\"width=device-width,initial-scale=1\">" "<style type=\"text/css\">" "#content { font-family:Arial, Helvetica, sans-serif; font-size:1em; } " "</style>" "<script type=\"text/javascript\">" "function load()" "{" " window.location.href = 'ready://' + document.body.offsetHeight;" "}" "</script>" "</head>" "<body id=\"bodyDiv\" onload=\"load()\">" "<div id=\"content\" contenteditable=\"true\">%@</div>" "</body>" "</html>" retain]; _webView = [[UIWebView alloc] initWithFrame:CGRectMake(0, 0, frame.size.width, frame.size.height)]; _webView.delegate = self; _webView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth; _webView.scrollView.bounces = NO; [_webView loadHTMLString:[NSString stringWithFormat:_editorHTML, @""] baseURL:[NSURL fileURLWithPath:directory]]; - (BOOL) webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType { NSURL *url = [request URL]; if (navigationType == UIWebViewNavigationTypeOther) { if ([[url scheme] isEqualToString:@"ready"]) { int height = (int)_webView.frame.size.height; [webView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"document.getElementById('content').style.minHeight = '%dpx'", height - WEBVIEW_DIVHEIGHT_OFFSET]]; return NO; } } return YES; } ``` So, how can I determine the cursor position in my div so I can update my scrollView to make sure that the content is visible above the UIKeyboard thus not having to make the user manually scroll to keep the text in view?