highlight dynamically generated text using javascript

Path	csiph.com!newsfeed.hal-mli.net!feeder3.hal-mli.net!newsfeed.hal-mli.net!feeder1.hal-mli.net!npeer01.iad.highwinds-media.com!news.highwinds-media.com!feed-me.highwinds-media.com!postnews.google.com!glegroupsg2000goo.googlegroups.com!not-for-mail
From	hiteshtr <hiteshtr@gmail.com>
Newsgroups	comp.lang.javascript
Subject	highlight dynamically generated text using javascript
Date	Fri, 30 Mar 2012 22:56:19 -0700 (PDT)
Organization	http://groups.google.com
Lines	38
Message-ID	<6327659.9.1333173379365.JavaMail.geo-discussion-forums@pbbpr1> (permalink)
NNTP-Posting-Host	117.211.84.218
Mime-Version	1.0
Content-Type	text/plain; charset=ISO-8859-1
Content-Transfer-Encoding	quoted-printable
X-Trace	posting.google.com 1333173380 29829 127.0.0.1 (31 Mar 2012 05:56:20 GMT)
X-Complaints-To	groups-abuse@google.com
NNTP-Posting-Date	Sat, 31 Mar 2012 05:56:20 +0000 (UTC)
Complaints-To	groups-abuse@google.com
Injection-Info	glegroupsg2000goo.googlegroups.com; posting-host=117.211.84.218; posting-account=hONuwgoAAACbT20CCYHzgrZxbA97dv_K
User-Agent	G2/1.0
X-Received-Bytes	2678
Xref	csiph.com comp.lang.javascript:13163

Show key headers only | View raw

I am creating a page to show pdf and I used pdf.js project of Mozilla to render pdf.

pdf.js is making multiple dynamic divs of rendered text under canvas tag. I want to highlight some text of my pdf. Following is the code generated dynamically by pdf.js:

<div id="viewer">

<div id="pageContainer1" class="page" style="width: 741.8181818181818px; height: 959.9999999999999px; " data-loaded="true">
<canvas id="page1" width="741" height="959"></canvas>
<div class="textLayer">
<div data-canvas-width="300.69542660606743" data-font-name="Times" style="font-size:12.06334818181817px; left: 173.1905882352941px; top: 8.593899292929294px; -webkit-transform: scale(0.9002857084013994, 1); -webkit-transform-origin-x: 0%; -webkit-transform-origin-y: 0%; " dir="ltr" data-text-length="58">Boston&nbsp;University&nbsp;Computer&nbsp;Science&nbsp;Technical&nbsp;Report&nbsp;No.&nbsp;20</div>
</div>
</div>

<div id="pageContainer2" class="page" style="width: 741.8181818181818px; height: 959.9999999999999px; " data-loaded="true">
<canvas id="page1" width="741" height="959"></canvas>
<div class="textLayer">
<div data-canvas-width="300.69542660606743" data-font-name="Times" style="font-size:12.06334818181817px; left: 173.1905882352941px; top: 8.593899292929294px; -webkit-transform: scale(0.9002857084013994, 1); -webkit-transform-origin-x: 0%; -webkit-transform-origin-y: 0%; " dir="ltr" data-text-length="58">Boston&nbsp;University&nbsp;Computer&nbsp;Science&nbsp;Technical&nbsp;Report&nbsp;No.&nbsp;20</div>
</div>
</div>

</div>

i only want to highlight the text of pageContainer1's text layer

Back to comp.lang.javascript | Previous | Next — Next in thread | Find similar | Unroll thread

Thread

highlight dynamically generated text using javascript hiteshtr <hiteshtr@gmail.com> - 2012-03-30 22:56 -0700
  Re: highlight dynamically generated text using javascript David Mark <dmark.cinsoft@gmail.com> - 2012-03-31 00:24 -0700

csiph-web