How to check the speakers?

Question

How to check the speakers?

Hello, dear community!
Asking for your help in the following question:

There is a html page with the text:

<article> 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc magna libero, venenatis quis aliquet et, 
 in rutrum augue. Donec vel tempor dolor. Donec volutpat fringilla porta. Suspendisse non nulla tortor. 
 Quisque commodo ornare mi, sit amet aliquet justo bibendum non. Integer bibendum convallis sapien, sit 
 amet tincidunt orci placerat in. Integer vitae consequat augue. 

 //etc.
</article>

and style to it:

article { 
 -webkit-column-count:20; 
 -moz-column-count:20; 
 column-count:20; 
}

Clicking on any column how to get her number, and if possible, its scrollLeft?

verla_Schaden asked October 3rd 19 at 02:19

Related questions

More answers about "How to check the speakers?"

3 answers

jordy.Ratke answered on October 3rd 19 at 02:23

At the stage of keep the order number:

<article data-i="1"> ... </article> 
<article data-i="2"> ... </article> 
<article data-i="3"> ... </article> 
...
<article data-i="N"> ... </article>

Then read from this attribute data. It's simple.

But how would not.
Html page exactly the same as described above. To change it is impossible. - verla_Schaden commented on October 3rd 19 at 02:26

UPD: If you use jquery, only two lines:

$obj.data('i',i); // - set the data-i
$obj.data('i'); // - read data-i

- verla_Schaden commented on October 3rd 19 at 02:29

Why not? A few posts earlier you asked how you form such a structure, and it is formed in the JavaScript om, judging by your chosen response. - jordy.Ratke commented on October 3rd 19 at 02:32

I'm sorry, but I'm not talking about the solutions in earlier posts. Here is another challenge. There are in simple text enclosed in

 <article> TEXT </article>

- jordy.Ratke commented on October 3rd 19 at 02:35

jordy.Ratke answered on October 3rd 19 at 02:25

In General, the right answer is here

Right in the first line we solve your problem.

See the answer here habrahabr.ru/qa/50270/#comment_235690 - verla_Schaden commented on October 3rd 19 at 02:28

Francesca.Turner answered on · Accepted Answer · 2019-10-03T02:21:19.458Z

The fact that column-count column cuts on your block automatically based on the value in the CSS, the columns are not DOM elements, because everything is performed at the level CSS3. I can offer this algorithm:
1. Hang the handler a clique on the block, say: $('article').on('click',someFunction);
In the callback function:
2. Find click position relative to the block article. Ie you know the coordinates of a click on the horizontal (X-axis) inside the unit.
3. Take the number of columns based on the column-count property
4. Divide the entire width of the block to the number of columns
5. According to the coordinates of the click, the method of simple mathematical calculations, we get the number of the column where you clicked.