6

UIWebview (Webkit コントロール) に複数列のレイアウトがありますが、要素の「視覚的な」場所へのアクセスに問題があります。

tapX を 4096 (4 x 1024、ここで 1024 は「カラム化されたページ」の高さ) だけシフトし、正しい「タップされた」要素を取得しますが、要素の端にいるのか中央にいるのかわかりません。 . 上と左の絶対位置が必要なので、(e.left、e.top、幅、高さ) の rect を使用して要素の上にレイヤー効果をアニメーション化できます - 正しい e.left と e.top を取得しますトリッキーであることが証明されています。

tapElement.offsetTop列のレイアウトを無視し、変換が機能していないように見えます。

var tapElement  = document.elementFromPoint(tapX, tapY);

if (!tapElement)
    return;   

var realLeft    = window.getComputedStyle(tapElement).getPropertyValue("offsetLeft");
var realTop     = window.getComputedStyle(tapElement).getPropertyValue("offsetTop");

解決:

// Figuring out the real top and left positions is difficult
// under the CSS3 multi column layout... But this works :) 

/*
// jQuery method
var realLeft    = $(tapElement).offset().left;
var realTop     = $(tapElement).offset().top;
*/

// DOM method
var box = tapElement.getBoundingClientRect();
var doc = tapElement.ownerDocument;
var docElem = doc.documentElement;
var body = doc.body;
var win = window;
var clientTop = docElem.clientTop || body.clientTop || 0;
var clientLeft = docElem.clientLeft || body.clientLeft || 0;
var scrollTop = win.pageYOffset || docElem.scrollTop || body.scrollTop;
var scrollLeft = win.pageXOffset || docElem.scrollLeft || body.scrollLeft;
var realTop = box.top + scrollTop - clientTop;
var realLeft = box.left + scrollLeft - clientLeft;   
4

1 に答える 1

1

JQuery メソッド「オフセット」を試すことができます。ここにそのドキュメントがあります。 http://api.jquery.com/offset/

JQuery を直接使用できない場合は、コードを調べると問題が解決することがあります。(そのためのデバッグバージョンを入手してください。)

于 2011-11-07T17:54:09.270 に答える