Ok, let's say I have a 50px div that is used to display text gathered from a db, a file, or whatever. However, if the text happens to be too big to fit in the div, I want it truncated, and I want to fit as much text as possible inside the div, but also append a (...) in the end (the div's overflow is already set to hidden).
Example words and expected results:
OOOOOOOOOOOOOOOOOOOOOO
iiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii
Expected results would be:
OOOOOOO(...)
iiiiiiiiiiiiiiiiiiiiiiiiiiii(...)
(As you can see, 28 i's take about the same amount of space as 7 O's, and changing the font is not an option.).
I don't think I'm the first person to face this issue so I was wondering if there was a known way to do this sort of thing I'm not aware of.
4 1577
You can set font-family:monospace in css and size the element in ems instead of px.
I could do that, the problem is I can't do that (client specs :P .).
I think the way to go is offsetWidth.
I could set the overflow back to visible, and if the div's offsetwidth is larger than what it is supposed to be, I could eliminate letters from the text within it until the offset goes back to it's default size... seems a bit ugly tho :P
No ideas? suggestions? witty remarks about the fact that I souldn't be doing this at all?
:(
-
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
-
-
<html>
-
<head>
-
<title>Overflow text</title>
-
</head>
-
-
<style>
-
-
#holder {height:103px; width:325px; display:block; overflow:hidden; border:1px solid #000;}
-
-
</style>
-
-
<body>
-
-
<div id="holder">
-
<span>
-
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque mauris sem, tempus sed, ultricies nec, sagittis nec, nisi. Nullam nulla dui, tempus vitae, commodo sit amet, molestie consectetuer, quam. Donec sed est. Morbi lacinia iaculis urna. Nullam molestie feugiat leo. Donec pharetra, nisi ac fringilla pretium, enim tellus tempor libero, in consequat est leo at lectus. Nullam quis nibh at ipsum nonummy sodales. Nullam nibh. Vivamus nulla. Nunc pretium lectus a est. Morbi ut quam. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nulla in risus eget purus elementum convallis. Duis quam libero, blandit vulputate, sodales non, gravida id, nibh.
-
</span>
-
</div>
-
-
<script>
-
-
window.onload = organizeText("holder")
-
-
function organizeText(elm) {
-
textHolder = document.getElementById(elm);
-
text = textHolder.getElementsByTagName("span")[0];
-
-
while (text.offsetWidth > textHolder.offsetWidth) {
-
conteudo = text.innerHTML
-
conteudoTemp = conteudo.substring(0,conteudo.length-1);
-
text.innerHTML = conteudoTemp
-
}
-
-
while(text.offsetHeight > textHolder.offsetHeight) {
-
conteudo = text.innerHTML
-
conteudoTemp = conteudo.substring(0,conteudo.length-1);
-
text.innerHTML = conteudoTemp
-
}
-
-
text.innerHTML = text.innerHTML.substring(text.innerHTML.length-3, text.innerHTML,length) + "..."
-
}
-
-
</script>
-
-
</body
-
</html>
-
-
There´s small example.
You can improve it to satisfy your needs.
Sign in to post your reply or Sign up for a free account.
Similar topics |
by: Jeremy |
last post by:
I have an include file which has some text such as:
The quick brown fox jumped over the lazy dog
I want to have a certain amount of that text to display on one page
wherein the user can click...
|
by: qazmlp |
last post by:
Can anybody comment(& suggest improvements) on the following
implementation that is for
truncating the character buffer contents to the desired length?
Truncating char array
void...
|
by: VISHNU VARDHAN REDDY UNDYALA |
last post by:
Hello,
Can someone over here help me in truncating a float variable.
I mean if PI=3.14159 ...How can I get to read the first two or first
three decimal values with out rounding them. Any...
|
by: VM |
last post by:
How can I truncate a string? For example, if I have a string containing
"Hello All" but the space reserved for this string is of 4 chars, how can I
truncate it to "Hell"? Would I need to create my...
|
by: DotNetJunkies User |
last post by:
I am calling a VB6 dll from a vb.net windows application that returns an array of strings. My issue is it seems to truncate after a NULL character. For Example VB 6 is returning a string with the...
| |
by: AMP |
last post by:
Hello
I get 2 errors in the following code that I cant Debug without some
help.
They are both in the TryParse function. Seems simple enough.The Errors
are Below.
private void...
|
by: nothix9 |
last post by:
Hello guys, Ive been working this for 2 days, I am required to position a string using drawstring but the problem is its dynamic and changes depending on the database or source. A quick fix I thought...
|
by: Francois |
last post by:
Hello,
How can I size my text to fit in a datagrid column ? I do not want the
datagrid go multiline.
I am using WEB Forms, not windows form, so CreateGraphics ans MesasureString
do not work....
|
by: geolemon |
last post by:
I'm having a seriously Twilight Zone moment:
In the code below, I'm building a SQL command into a string variable, declared at the top of my code.
Then, I connect to the database and try to...
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
|
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
| |
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers,...
|
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
|
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome a new...
|
by: adsilva |
last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
|
by: muto222 |
last post by:
How can i add a mobile payment intergratation into php mysql website.
| |
by: bsmnconsultancy |
last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence...
| |