3

这里有一些严重的问题，我正在开发一个 iOS 应用程序，它必须在 UIWebView 中使用 CSS 多列模块在多个列上显示一个 html 页面。

我将以下 CSS 规则添加到页面以完成多列

padding: 0px; height: 850.000000px; -webkit-column-gap: 0px; -webkit-column-width: 620.000000px;

然后我需要找到页面中某些文本在屏幕上的绝对位置。问题是从 jQuery 调用 offset() 方法的任何调用都可以正常工作，除了在 2 列上运行的文本上的调用。

例如，对于从第 3 列末尾开始并在第 4 列结束的句子，我得到一个偏移量，左侧值设置为第 3 列，但顶部位置设置为 0，就好像它在第 4 列中一样。

如何获得具有正确左侧和顶部值的 offset() 值。我的意思是，如果左边的值在第三列，我希望顶部的值也在第三列的底部。

同样，当句子同时在两列上运行时，我才遇到这个问题（从第 3 列的末尾开始，在第 4 列结束）

我真的不知道我是否在这里让自己清楚，但任何帮助都会非常棒。

提前谢谢

4

3 回答 3

2

我会尝试预处理文本以根据您的需要在每个句子或段落的每个第一个和每个最后一个字符周围添加一个特定的跨度。offset() 应该用于检索块的开始和结束位置。然后，您只需计算复杂的情况，例如在不同列中开始和结束的句子。

于 2013-01-05T08:25:09.663 回答
0

这就是我最终解决问题的方式。我还没有用很多内容验证它，但是对于几个测试用例，这对我有用。我实际上有一些跨越 3 个 CSS3 列的元素，因此当我的屏幕高度仅为 460 时，最终的 offset.top 为 -800。

$.fn.coffset = function() {

    var offset = $(this).offset();

    if (offset.top < 0) {
        var winHeight = window.innerHeight;
        var winWidth = window.innerWidth;

        var numOfPagesOff = Math.ceil((-offset.top) / winHeight);

        offset.top += (winHeight * numOfPagesOff);
        offset.left -= (winWidth * numOfPagesOff);
    }
    return offset;
};
于 2013-03-19T01:00:38.377 回答
0

这可以通过在元素的开头添加一个空 div，然后检索位置，然后删除空 div 来轻松完成。

$(element).prepend('<div id="getposition"></div>');
var left = $('#getposition',element).offset().left;
$('#getposition',element).remove();
于 2016-11-15T11:58:24.467 回答