0

I use CSS Multicolumn to show a html file, width of column set to width of window, so only one column shown at a time _windowWidth = $( window ).innerWidth(); . the height of column also set to hight of window _windowHeight = $( window ).innerHeight(); . and in the css the overflow of container is hidden overflow: hidden.

and i can change the visible column with $('#content').css({"-webkit-transform":"translate(" + (-1 * _column * (_windowWidth + _columnGap)) + "px,0px)"});

what i want is to get the current visible column text.

$('#content').children(":visible").text(); return all column text.

the nearest question and answer i found is :Get text in CSS3 column? , he suggest this function: 

var getAllTextInColumn = function(rect){
    /*
        rect should be the size and x,y of the column
        { top, left, width, height }
    */

    if(document.caretRangeFromPoint){
        var caretRangeStart = document.caretRangeFromPoint(rect.left, rect.top);
        var caretRangeEnd = document.caretRangeFromPoint(rect.left+rect.width-1, rect.top+rect.height-1);
    } else {
        return null;
    }

    if(caretRangeStart == null || caretRangeEnd == null) return null;

    var range = document.createRange();
    range.setStart(caretRangeStart.startContainer, caretRangeStart.startOffset);
    range.setEnd(caretRangeEnd.endContainer, caretRangeEnd.endOffset);

    return range.toString();
};

but i dont't know how to get rect of a column (eg. column 3)

any help would be appreciated.

tnx in advance.

UPDATE:

this function really works but i can't figure out it's parameter, if i pass left = 0 , top = 0 , width = _windowWidth , height = _windowHeight it gives me text of first column.

if i pass left = _column * (_windowWidth + _columnGap) , top = 0 , width = _windowWidth , height = _windowHeight and _column is 0 or 1 it gives text of first column and if _column > 2 the caretRangeStart will be null.

if i pass left = 0 , top = 0 , width = _column * (_windowWidth + _columnGap) + _windowWidth , height = _windowHeight the caretRangeEnd will become null, so i can't get it working with any combination, may be someone can help me with that.

Community
  • 1
  • 1
mehdok
  • 1,499
  • 4
  • 29
  • 54

1 Answers1

0

From your description you are not really hiding or showing your columns. Your are basically changing the x offset.

You should do the opposite way round: Get the x offset and divide it by - (_windowWidth + _columnGap)

To get the text try:

$('#content').children().eq(index).text();

Bruno Marotta
  • 443
  • 5
  • 12