Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations gkittelson on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Simulate Excel cell with comments 3

Status
Not open for further replies.
jlsmithhartfiel

jlsmithhartfiel

Programmer
Jan 7, 2002
336
US
Hi! I'm trying to simulate an excel cell with the comments indicator in the upper-right-hand corner. So, either a textbox or textarea. I'm thinking I may need to overlay the triangle image somehow. Any ideas?

Thanks in advance!
Jessica
 
Sort by date Sort by votes
try this:

<textarea style=&quot;background:url(../images/image.gif) no-repeat top right;&quot;></textarea>

the scrollbar is still visible though...

======================================

if (!succeed) try++
-jeff
 
Upvote 0 Downvote
Try this example. Where rt_trans.gif is an image 10x10 pixels. The upper-right triagle is red. the lower-left triangle is transparent (e.g when you use backgroundcolors in the form elements).

As you can see in the alt text you can make new lines with &amp;#13; and tabs with &amp;#09;


Feel free to copy the image :)

Here is the code:

<HTML>
<HEAD>
<TITLE></TITLE>
<style>
.setimg1 {
position: relative;
left: -12px;
top: -6px;
cursor: wait;
}
</style>

</HEAD>
<BODY>

<br><br><br>
<form name=&quot;f1&quot;>
<input name=&quot;ex0&quot;><input name=&quot;ex1&quot;><img alt=&quot;The text of the comment indicator&quot; name=&quot;img1&quot; class=&quot;setimg1&quot; src=&quot;rt_trans.gif&quot; width=10 height=10><br>
<input style=&quot;background-color: yellow;&quot; name=&quot;ex2&quot;><img alt=&quot;Text&amp;#09;with&amp;#09;tabs&amp;#13;Like&amp;#09;a&amp;#09;table&quot; name=&quot;img1&quot; class=&quot;setimg1&quot; src=&quot;rt_trans.gif&quot; width=10 height=10><input name=&quot;ex3&quot;><br>
<input type=&quot;textarea&quot; value=&quot;textarea text&quot;><img alt=&quot;And here is another text &amp;#13;He this text is a new line !!&amp;#013;&amp;#013;And here a new line after an empty line :)&quot; name=&quot;img1&quot; class=&quot;setimg1&quot; src=&quot;rt_trans.gif&quot; width=10 height=10>

</form>

</BODY>
</HTML>

Hope this helps,
Erik <!-- My sport: Boomerang throwing !!
This year I will participate at the World Championships in Germany. (!! Many Happy Returns !! -->
 
Upvote 0 Downvote
Hi,

Thank to cian I made a second file. I took some javascript code from his site and improved it so the popup's show up near the mousepointer:


I add an image (sq_trans.gif) to align the input elements on the first row.

Just right click - view source to get the code.
(It's better to put the styles in a style sheet and and the javascript in a js-file)

Hope this helps,
Erik <!-- My sport: Boomerang throwing !!
This year I will participate at the World Championships in Germany. (!! Many Happy Returns !! -->
 
Upvote 0 Downvote
Good job Erik. Great improvements. :) :)




É

endamcg-logo1b.gif

 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

scorney
  • Locked
  • Question
background image with overlay which Hover when over a specific Area/Form
Replies
1
Views
689
3esolar
3
jizzer
  • Locked
  • Question
HTML/CSS Image map with multiple tool-tips
Replies
3
Views
1K
spamjim
spamjim
ashokkumary
  • Locked
  • Question
missing leading zero when we download in excel from html table data.
Replies
1
Views
162
spamjim
spamjim
PSchubert
  • Locked
  • Question
Data in db table cell not displayed in asp table cell -- a CSS issue?
Replies
2
Views
143
vacunita
vacunita
CoolBreeze007
  • Locked
  • Question
Unable to make HTML element adjust with the resizing of the browser
Replies
0
Views
130
CoolBreeze007
CoolBreeze007

Part and Inventory Search

Sponsor

Back
Top