473,378 Members | 1,609 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,378 software developers and data experts.

Adjust style on ABBR or ACRONYM alternate text

I am using the ACRONYM tag to provide an explanation of codes within my
application. Example:

<p>The circuit <acronym title="Circuit P123T: Picton SS to Telebary
SS 345KV">P123T</acronym> is out
of service from 13:00 to 15:00 today</p>.

I would prefer a fancy balloon tip, but this allows me to store and retrieve
the text directly in a database table, and avoid having to add any
additional setup text to create any invisible balloon text. (Unless there is
another way).

I would like to change the style of the alternate text that appears, such as
increasing its font size and background color. Is there a way to do this as
CSS or in JavaScript ?

Thanks,
Jarson (jarson from sygration, that's a dot com company if you would like to
email me)
Jul 23 '05 #1
10 1685
Jarson wrote:
I am using the ACRONYM tag to provide an explanation of codes within my
application. Example:

<p>The circuit <acronym title="Circuit P123T: Picton SS to Telebary
SS 345KV">P123T</acronym> is out
of service from 13:00 to 15:00 today</p>.

I would prefer a fancy balloon tip, but this allows me to store and retrieve
the text directly in a database table, and avoid having to add any
additional setup text to create any invisible balloon text. (Unless there is
another way).

I would like to change the style of the alternate text that appears, such as
increasing its font size and background color. Is there a way to do this as
CSS or in JavaScript ?


I'm pretty sure that amongst the tooltips at the link below there is
one that is attached when the page loads and works on the title or alt
text of whatever elements you choose to attach it to.

Users without JavaScript see their browsers default 'tooltip', those
with JavaScript see the enhanced, styled version.

<URL:http://www.walterzorn.com/tooltip/tooltip_e.htm>
Post again if you can't find what you want.
--
Rob
Jul 23 '05 #2
Jarson wrote:
<acronym title="Circuit P123T: Picton SS to Telebary SS
345KV">P123T</acronym>


In what way is that an acronym? Use <dfn> or a semantically meaningless
element like <span> instead.

(Followups trimmed.)
Jul 23 '05 #3
It is a semantic argument debating which tag best fits this purpose. True,
is not an Acronym but it also isn't a definition or an abbreviation.
However, I would surely switch to another tag if it provided a better
solution. None of them seem to provide a way to modify the style of their
title attribute.

Jarson

"Leif K-Brooks" <eu*****@ecritters.biz> wrote in message
news:Eh*******************@monger.newsread.com...
Jarson wrote:
<acronym title="Circuit P123T: Picton SS to Telebary SS
345KV">P123T</acronym>


In what way is that an acronym? Use <dfn> or a semantically meaningless
element like <span> instead.

(Followups trimmed.)

Jul 23 '05 #4
Gazing into my crystal ball I observed "Jarson" <ja*****@nospam.com>
writing in news:cz********************@news20.bellglobal.com:
I am using the ACRONYM tag to provide an explanation of codes within my
application. Example:

<p>The circuit <acronym title="Circuit P123T: Picton SS to
Telebary
SS 345KV">P123T</acronym> is out
of service from 13:00 to 15:00 today</p>.

I would prefer a fancy balloon tip, but this allows me to store and
retrieve the text directly in a database table, and avoid having to add
any additional setup text to create any invisible balloon text. (Unless
there is another way).

I would like to change the style of the alternate text that appears,
such as increasing its font size and background color. Is there a way
to do this as CSS or in JavaScript ?


If it is important that users know what the description is, then I would
show both the part number AND the description. Since IE does not render
any hint on the ACRONYM or ABBR elements, unless they are specifically
styled, the user would not know to mouse over anyway.

***
abbr, acronym {border-bottom:1px dashed #c0c0c0;} simulates Opera and
Firefoxes rendering of those elements for IE.
--
Adrienne Boswell
http://www.cavalcade-of-coding.info
Please respond to the group so others can share
Jul 23 '05 #5
Jarson wrote:
It is a semantic argument debating which tag best fits this purpose. True,
is not an Acronym
...so then there is no semantic argument. It is not an acronym.
but it also isn't a definition or an abbreviation.
However, I would surely switch to another tag if it provided a better
solution. None of them seem to provide a way to modify the style of their
title attribute.


Why not use a simple <span> as Leif suggested?

Please don't top-post.

--
-bts
-This space intentionally left blank.
Jul 23 '05 #6
Adrienne wrote:
abbr, acronym {border-bottom:1px dashed #c0c0c0;} simulates Opera and
Firefoxes rendering of those elements for IE.


Except that IE has (IIRC) absolutely no support for ABBR. It even
removes it from the DOM.
Jul 23 '05 #7
It is a semantic argument in the context that it is missing the point of the
question. My question is whether or not it is possible to alter the style
of the title attribute (and how). Sorry if I wasn't clear on that, and I
have just never seen a way of doing it. Any tag that displays alternate
text would do find -- I think changing the alternate text's style would be
useful for many applications.

Thanks, Jarson

"Beauregard T. Shagnasty" <a.*********@example.invalid> wrote in message
news:FV******************@twister.nyroc.rr.com...
Jarson wrote:
It is a semantic argument debating which tag best fits this purpose.
True, is not an Acronym


..so then there is no semantic argument. It is not an acronym.
but it also isn't a definition or an abbreviation. However, I would
surely switch to another tag if it provided a better solution. None of
them seem to provide a way to modify the style of their title attribute.


Why not use a simple <span> as Leif suggested?

Please don't top-post.

--
-bts
-This space intentionally left blank.

Jul 23 '05 #8
Jarson wrote:

Please don't top-post.
http://oakroadsystems.com/genl/unice.htm#upside
It is a semantic argument in the context that it is missing the
point of the question. My question is whether or not it is
possible to alter the style of the title attribute (and how). Sorry
if I wasn't clear on that, and I have just never seen a way of
doing it. Any tag that displays alternate text would do find -- I
think changing the alternate text's style would be useful for many
applications.


The display of the standard title attribute can't be changed, as far
as I know. Some folks have written JavaScript "popups" that resemble
the tooltips that the title attribute uses, and they are customizable,
of course. Since I don't care for them, I have no references.

Your use of the words "alternate text" above ... I hope you don't mean
the alt attribute, which should not be mucked with.

--
-bts
-This space intentionally left blank.
Jul 23 '05 #9
Gazing into my crystal ball I observed Leif K-Brooks
<eu*****@ecritters.biz> writing in news:LcNge.4966$Cz3.612761
@monger.newsread.com:
Adrienne wrote:
abbr, acronym {border-bottom:1px dashed #c0c0c0;} simulates Opera and
Firefoxes rendering of those elements for IE.


Except that IE has (IIRC) absolutely no support for ABBR. It even
removes it from the DOM.


You're right. Another reason to hate that browser.

--
Adrienne Boswell
http://www.cavalcade-of-coding.info
Please respond to the group so others can share
Jul 23 '05 #10
Jarson wrote:
It is a semantic argument in the context that it is missing the point of the question. My question is whether or not it is possible to alter the style of the title attribute (and how). Sorry if I wasn't clear on that, and I have just never seen a way of doing it. Any tag that displays alternate text would do find -- I think changing the alternate text's style would be useful for many applications.

Thanks, Jarson

"Beauregard T. Shagnasty" <a.*********@example.invalid> wrote in message news:FV******************@twister.nyroc.rr.com...
Jarson wrote:
It is a semantic argument debating which tag best fits this purpose. True, is not an Acronym


..so then there is no semantic argument. It is not an acronym.
but it also isn't a definition or an abbreviation. However, I would surely switch to another tag if it provided a better solution. None of them seem to provide a way to modify the style of their title
attribute.
Why not use a simple <span> as Leif suggested?

Please don't top-post.

--
-bts
-This space intentionally left blank.


This subject has been seriously flogged/blogged for some time; notably:

http://larsholst.info/blog/2003/09/2...s-initialisms/

To answer your OQ: in addition to limited duration onscreen and some
weird truncation in (some) uas, HTMLElement.title isn't HTML and so
can't be styled w/CSS. You can toy with it as a string in IE:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style type="text/css">

acronym {
font-weight: bold;
cursor: help;
}

</style>
<script type="text/javascript">

window.onload = function()
{
var i = 0, el, t, s = '',
els = document.getElementsByTagName('*');
while (el = els.item(i++))
if ((t = el.title) && (t = t.split(':')))
el.title = [
'\n ' ,
t[0] ,
': \n' ,
t[1].replace(/ /g, function(){return '\n'+(s+=' ')}) ,
'\n'
].join('');
}

</script>
</head>
<body>
<p>The circuit
<acronym title="Circuit P123T: Picton SS to Telebary SS 345KV">
P123T</acronym> is out of service from 13:00 to 15:00 today.
</p>
<p>The banana
<acronym title="Big Yellow Banana: Smooth, tasty, and good for you...">
Big Yellow Banana</acronym> is being cleaned from 4:44 to 4:46 as well.
</p>
</body>
</html>

Useless in mozilla, though. Might be modifiable some other way but
haven't seen it. Looked into 'pure CSS' tooltips?

http://www.communitymx.com/content/a...ge=1&cid=4E2C0

Jul 23 '05 #11

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

7
by: mr_burns | last post by:
hi, in html, how do i create a pop up description box for text. i want, in the same way that when you write the image alt tag and the user rolls the cursor over the image a pop up box appears,...
27
by: Curtis Morrison | last post by:
Please help! I've been trying to figure this out for days now, with no luck. the following web page loads fine in MSIE, but NN 7 breaks it. I would really appreciate any suggestions that anyone...
1
by: Jukka K. Korpela | last post by:
(Discussion started in c.i.w.a.h. under Subject "image alt style pop up for text", now changed to discussing the use of a title="..." attribute to create a popup info text, and how to make it...
5
by: ng4rrjanbiah | last post by:
<ABBR title="foo">f</ABBR> Just consider the situation like the above. If we use such markup, search engines (tried only Google) don't access the "foo". Is there anyway to make it accessible for...
10
by: Jarson | last post by:
I am using the ACRONYM tag to provide an explanation of codes within my application. Example: <p>The circuit <acronym title="Circuit P123T: Picton SS to Telebary SS 345KV">P123T</acronym> is...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
by: ryjfgjl | last post by:
In our work, we often need to import Excel data into databases (such as MySQL, SQL Server, Oracle) for data analysis and processing. Usually, we use database tools like Navicat or the Excel import...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.