Donate. I desperately need donations to survive due to my health

Get paid by answering surveys Click here

Click here to donate

Remote/Work from Home jobs

Make a highlighter tool over an object in html

on

I want to highlight some of text using mouse on a text file which i am showing on an html page.

I want to know how can I do that? I have already tried using <canvas> tags but that is allowing me to draw behind the objects on main page. Here is my code.

<body>
    <input type="submit" id="Button1" onclick="question_1()" name="" value="Set 
Value"" style="position:absolute;left:1338px;top:65px;width:96px;height:25px;z-index:0;">
    <input type="submit" id="Button2" onclick="reset()" name="" value="Reset" style="position:absolute;left:1399px;top:25px;width:96px;height:25px;z-index:1;">
    <input type="text" id="Editbox1" style="position:absolute;left:1277px;top:106px;width:208px;height:36px;z-index:2;" name="Editbox1" value="" spellcheck="false">
    <input type="text" id="Editbox2" style="position:absolute;left:1277px;top:192px;width:208px;height:36px;z-index:3;" name="Editbox2" value="" spellcheck="false">
    <input type="text" id="Editbox3" style="position:absolute;left:1256px;top:320px;width:66px;height:39px;z-index:4;" name="Editbox3" value="" spellcheck="false">
    <input type="text" id="Editbox4" style="position:absolute;left:1342px;top:320px;width:66px;height:39px;z-index:5;" name="Editbox3" value="" spellcheck="false">
    <input type="text" id="Editbox5" style="position:absolute;left:1429px;top:320px;width:69px;height:39px;z-index:6;" name="Editbox3" value="" spellcheck="false">
    <input type="submit" id="Button3" onclick="min_025();" name="" disabled value="0.25" style="position:absolute;left:1283px;top:402px;width:70px;height:42px;z-index:7;">
    <input type="submit" id="Button5" onclick="min_1();" name="" disabled value="1" style="position:absolute;left:1391px;top:460px;width:70px;height:42px;z-index:8;">
    <input type="submit" id="Button6" onclick="min_075();" name="" disabled value="0.75" style="position:absolute;left:1283px;top:460px;width:70px;height:42px;z-index:9;">
    <input type="submit" id="Button7" onclick="min_05();" name="" disabled value="0.5" style="position:absolute;left:1391px;top:402px;width:70px;height:42px;z-index:10;">
    <label for="RadioButton1" id="Label2" style="position:absolute;left:1260px;top:268px;width:74px;height:16px;line-height:16px;z-index:11;">Question 1</label>
    <label for="RadioButton2" id="Label1" style="position:absolute;left:1346px;top:268px;width:71px;height:16px;line-height:16px;z-index:12;">Question 2</label>
    <label for="RadioButton3" id="Label3" style="position:absolute;left:1429px;top:268px;width:92px;height:16px;line-height:16px;z-index:13;">Question 3</label>
    <div id="wb_RadioButton1" style="position:absolute;left:1284px;top:292px;width:20px;height:20px;z-index:14;">
    <input type="radio" id="RadioButton1" name="Name" value="on" checked style="position:absolute;left:0;top:0;"><label for="RadioButton1"></label></div>
    <div id="wb_RadioButton2" style="position:absolute;left:1370px;top:292px;width:20px;height:20px;z-index:15;">
    <input type="radio" id="RadioButton2" name="Name" value="on" style="position:absolute;left:0;top:0;"><label for="RadioButton2"></label></div>
    <div id="wb_RadioButton3" style="position:absolute;left:1458px;top:292px;width:20px;height:20px;z-index:16;">
    <input type="radio" id="RadioButton3" name="Name" value="on" style="position:absolute;left:0;top:0;"><label for="RadioButton3"></label></div>
    <label for="Editbox2" id="Label4" style="position:absolute;left:1277px;top:160px;width:149px;height:23px;line-height:23px;z-index:17;">Obtained Marks</label>
    <div id="Html1" style="position:relative;left:41px;top:43px;width:135px;height:68px;z-index:18">
        <embed src="jawad.txt#view=FitH" width="1200px" height="650px" style="text-align:center;text-size:20px;"/></div>        <!--I want to draw above this file which I'm importing-->
    <div id="wb_RadioButton4" style="position:absolute;left:1370px;top:248px;width:20px;height:20px;z-index:19;">
    <input type="radio" id="RadioButton4" name="Name" value="on" style="position:absolute;left:0;top:0;"><label for="RadioButton4"></label></div>
    <label for="RadioButton4" id="Label5" style="position:absolute;left:1343px;top:247px;width:34px;height:16px;line-height:16px;z-index:20;">All</label>
</body>

I'm importing file on 4th last line,I want to draw over that file. How can I do that?

Comments

Post a Comment