Nicer Titles (neo-dzygn-com)

Nicer Titles

As promised, here's the rewrite of Nice Titles. It's based on the latest version by Dunstan Orchard and Ethan Marcotte, found at 1976design. My version of Nice Titles uses object orientated JavaScript. This way the chance of interference with other scripts is very slim. Also, it gives you a little more possibilities, about which I will tell more later on.

22nd Feb 2004: Kevin modified NiceTitles to make it follow the mouse and work on images. Well done!

I really gotta boost the style for these updates.... anyway, another problem as been solved. Sigh.

January 7: fixed - I really hope so now... - the lingering invalid URI bug. Also added a feature which controls the maximum length of attribute values inside the pop-up.

This is getting annoying: one more bug has been discovered and solved. Read more. (January 6)

Another update (January 5): there has been a minor bug fix in the code, as explained in my comment

Update: I realized that this post could be offending in some way. This, of course, is not my intention. It's not my purpose to show how good I am. I wanted to make a piece of code which was compatible with other code, and which looked and worked well and easy. Something I would use. I can clearly sense the contradiction here, and I can only hope my intentions are understood. Also, Tim Scarfe has made some suggestions for improvements. The various files ~~will be updated shortly~~have been updated.

CSS

One of my goals was not to force people to change the current CSS file (in the 1976design version) used for Nice Titles. This partially succeeded. The older version of the script explicitly set a minimum width of the "pop-up". In my opinion JavaScript should be used as a behavioral layer, and thus CSS properties like these should not be set in a script. I have therefore removed this from my version. You'll now have to specify a minimum width in the CSS file. This minimum width is 300 pixels.

A bug already present in the older version was positioning of the pop-up in Netscape 6. You'll have to specify the width and height of div.title to auto for it to work.

Templates

Now, let me move on to the more interesting stuff. I've taken the creation of the content of the pop-up out of the script. This basicly means that all elements on the page can be turned into a Nice Title. Theoraticly, there are two ways by which this can be accomplished: a function which creates the output, or a template system. For the ease of creating new pop-ups, I've choosen for the template system, though I'm still not sure if this is the right decision. In any case, it can be changed without much effort.

The template is a string which contains the (X)HTML code you want to use inside the pop-up. When a pop-up is activated, this template is parsed using the element the pop-up is used for at that moment (ouch, this is real hard to explain, it seems). You can use the CSS3 method attr() to get the value of an attribute of this element. Using content() you can get the value (in text) of the element.

Some attributes don't exist on all elements, such as accesskey. To accomodate for this, I have included a conditional syntax. Everything you put between question-marks is conditional. This means that if attributes (selected by attr()) do not exist on an element, the conditional string is removed from the output. If you want to use a "true" question-mark, you'll have to use this: ?

I'll give you an example of a template:

<p class=\"titletext\">attr(nicetitle)? <span class=\"accesskey\">[attr(accesskey)]</span>?</p><p class=\"destination\">attr(href)</p>

This is the template used to display a pop-up on anchors. attr(nicetitle) selects the value of attribute nicetitle (we'll get to this later). The quotation-marks around

<span class=\"accesskey\">[attr(accesskey)]</span>

make sure the accesskey attribute exists on this element.

Creating a NiceTitle

Even though pop-ups for a, ins, del, abbr and acronym are automaticly created, I'll explain how to create your own NiceTitle.

First you start creating a new NiceTitle: var myNiceTitles = new NiceTitles(). NiceTitles() takes the following arguments (in this order):

sTemplate: Pretty obvious, the template. If it's not a string (or does not exist), the default template attr(nicetitle) is used.
nDelay: This is the delay before the pop-up shows up. It must be larger than 0, and it is specified in milliseconds. If you don't want a delay, use null as value. By default there is no delay.
nStringMaxLength: This is the maximum length of attribute values to be displayed in the pop-up. Everything larger then this number is cut of and "..." is added to the end of the value. The default is 80 characters.
nMarginX: This is the horizontal margin of the pop-up from its calculated position. For calculation purposes it is set here, it's added to the left position of the pop-up. The default is 0
nMarginY: Same as nMarginX, but vertical this time ;-)
sContainerID: This is the ID of the div which contains the content of the pop-up. If an element with this ID already exists, it is used as container. If not, a new container is created. The default is nicetitlecontainer.
sClassName: This is the class of the container. The default is nicetitle. Please note: you can't specify a new class on an existing container.

Afer you've created a new NiceTitle, you must add elements to it. This is done using the method addElements(): myNiceTitles.addElements()

addElements() takes two arguments:

collNodes: This is a collection of elements (nodeList) for which NiceTitles will be enabled. It's a result of a document.getElementsByTagName() call.
sAttribute: This is the name of the attribute which is required to exist on the element. Only for elements which have this attribute NiceTitles is enabled. It will be "renamed" to nicetitle, to prevent browsers from, for example, showing their default tooltip for a title attribute.

For an example of how to create your own NiceTitle, take a look at the NiceTitles.autoCreation method in the source.

To conclude with

I've tested my version of NiceTitles in IE5.01, IE5.5, IE6, Mozilla 0.9.4 (on which Netscape 6 is based), Mozilla Firebird 0.7 (Mozilla 1.5) and Opera 7.23, all on Windows XP Pro. I also tested this in an XML document (in Mozilla Firebird).

I had to change a little bit in the addEvent function by Scott Andrew to make it work in Opera 7. This might affect the behaviour of other scripts which depend on addEvent, but I was not sure if I could move the addEvent function out of the global scope (because scripts might depend on it).

Of course I'd like to hear your suggestions on this script. You can see a demo of it, based on 1976design's weblog entry for the previous version. Of course you can download it as well (including updated CSS file). NiceTitles is released under a MIT license.

Kudos to all who worked on NiceTitles before me: Stuart Langridge, Paul McLanahan, Peter Janes, Brad Choate, Dunstan Orchard and Ethan Marcotte.

Comments

Stuart Langridge wrote:

Without wishing to sound rather petty about all this, doesn’t the template syntax look rather silly if Javascript is turned off? And having to manually create nicetitles removes the script’s unobtrusive nature, although it still works automatically for the important stuff.
All that aside, this is tight work. I’m glad the script is being so well used!

January 4, 2004 @ 7:46 am. Type: Comment. Permalink.
Mark wrote:

“Without wishing to sound rather petty about all this, doesn’t the template syntax look rather silly if Javascript is turned off?”
What do you mean?

“And having to manually create nicetitles removes the script’s unobtrusive nature, although it still works automatically for the important stuff.”
In what way is this different from the previous version?

“All that aside, this is tight work.”
Thank you :)

January 4, 2004 @ 2:17 pm. Type: Comment. Permalink.
Chris Owens wrote:

Can you tell me why Mozilla 1.5 has problems displaying a “nicetitle” with the following code?

Altec Lansing 2100 Enhanced

I’ve tried cleaning the URL (http://www.hivelogic.com/urlcleaner.php) but I still get a “not well formed” error in Moz 1.5.

January 5, 2004 @ 5:29 am. Type: Comment. Permalink.
Chris Owens wrote:

oh, that didn’t work as expected…

Altec Lansing 2100 Enhanced

Try the above but remove the spaces (obviously).

January 5, 2004 @ 5:33 am. Type: Comment. Permalink.
Chris Owens wrote:

Mark, sorry about the above the blog seems to be “swallowing” the spaces that I’m using so that the code doesn’t get parsed.

Problem: Mozilla 1.5 displays an error instead of “nicetitle”.

The link is: http://www.altecmm.com/product_details.asp?p2100&s2
The title text is: Altec Lansing 2100 Enhanced 2.1 Speaker System
The link text is: Altec Lansing 2100 Enhanced

I hope that works, please feel free to delete my above posts.

January 5, 2004 @ 5:37 am. Type: Comment. Permalink.
Chris Owens wrote:

Note
The blog has removed the letters I and D (UPPERCASE) that should appear after the p and s (lowercase) in the URL.

January 5, 2004 @ 5:39 am. Type: Comment. Permalink.
Mark wrote:

Hi Chris,

thanks for your comment. This was actually a bug in the code. The URI you are trying to use is invalid, in the way that & is not encoded as &. A far as I know there is no way to detect if the script is being run in XML mode, and therefore it runs the output through an XML parser before it can be added to the document (in Mozilla, that is). I’ve fixed the bug by checking for parser errors and, if there are any, use innerHTML to insert the output. A true XML document must have valid URI’s, therefore there won’t be parser errors, and the XML way of adding the output will be used.

I’ve updated the files now.

P.S. You should have encoded the tags inside the <code> tag (<)

January 5, 2004 @ 4:40 pm. Type: Comment. Permalink.
Chris Owens wrote:

Thanks Mark, however before the “patch” I tried running it through HiveLogic’s URL cleaner and also encoding it myself using ”&” in the URL… but it still broke.

I’ll download the updated version and see how I get on.

Thanks for the fast response.

January 6, 2004 @ 3:11 am. Type: Comment. Permalink.
Chris Owens wrote:

Mark, another problem. It is now working (sort of), but after hovering over the URL previously discussed and then moving to another element with the title attribute I’m getting the previous URL appearing above the title of the new tooltip.

See: http://twenty4.org/images/nicetitles.jpg

Thanks.

January 6, 2004 @ 3:30 am. Type: Comment. Permalink.
Couchblog wrote:

Nicer Titles
Marc Wubben presents an updated version of the “nice titles” script, supplying nicer hover effects for webpages.

January 6, 2004 @ 9:25 am. Type: Trackback. Permalink.
Mark wrote:

Chris, thanks for the bughunting. And for the headache ;-)

I’ve managed to track these two bugs down. Appearantly, the first bug you mentioned, considering invalid URI’s, has never been truely fixed. When a string is parsed into XML, all & are turned into &. Afterwards, when you try to import the XML into the document, the & throws an error, because it’s no longer & A simple string replace fixed this problem.

The other bug you described was one I never encountered before. I was using a while loop and firstChild / nextSibling to remove the childNodes of the container element. However, once a node is removed, the nextSibling reference is gone as well. This bug has also been fixed.

Let’s hope no other bugs will be found, it surely annoys everyone.

January 6, 2004 @ 5:32 pm. Type: Comment. Permalink.
Anonymous wrote:

I downloaded the scrip just a few minutes ago. Hovering over an image that links to a Google query http://images.google.nl/imgres?imgurl=www.vmth.ucdavis.edu/cardio/cases/images/tricuspid%2520atresia%2520kitten%2520roemer%2520%2B%2520asd.jpg&imgrefurl=http://www.vmth.ucdavis.edu/cardio/cases/photographs/tricuspid_atresiat.htm&h=383&w=504&prev=/images%3Fq%3Dasd%26svnum%3D10%26hl%3Dnl%26lr%3D%26ie%3DUTF-8%26oe%3DUTF-8%26sa%3DG gives the following error:
XML Parsing Error: not well-formed Location: http://www.gospelfreak.nl/links.php Line Number 1, Column 339:
De afbeelding
http://images.google.nl/imgres?imgurl=www.vmth.ucdavis.edu/cardio/cases/images/tricuspid%2520atresia%2520kitten%2520roemer%2520%2B%2520asd.jpg&imgrefurl=http://www.vmth.ucdavis.edu/cardio/cases/photographs/tricuspid_atresiat.htm&h=383&w=504&prev=/images%3Fq%3Dasd%26svnum%3D10%26hl%3Dnl%26lr%3D%26ie%3DUTF-8%26oe%3DUTF-8%26sa%3DG

I cleaned the URL using HiveLogic’s tool.

January 6, 2004 @ 9:15 pm. Type: Comment. Permalink.
Mark van Kampen wrote:

Sorry, I forgot to enter my name in the post above.

January 6, 2004 @ 9:16 pm. Type: Comment. Permalink.
Mark wrote:

Hmm.. not all & were replaced by &. I’ve fixed it now.

Your extremely long URI also made the popup extremely wide. I’ve added a maximum length for attribute values now, to control this. It is currently set to 80 characters. I’ll update the documentation later today.

January 7, 2004 @ 11:43 am. Type: Comment. Permalink.
Joshua Hore wrote:

I’m having problems with the date on <ins> tags: The date datetime="2004-01-12T06:13:00-0500" (made up for testing) is displayed by Firebird (0.7) as nicetitle="Mon Jan 12 2004 06:13:00 GMT+1300 (New Zealand Daylight Time)". Its obviously getting the time zone from my settings, but its not converting the time, just tacking my timezone on the end (the converted date would be 2004-01-13T00:13:00+1300). Is there any way to change this?

PS: IE6 does something similar: Mon Jan 12 06:13:00 UTC+1300 2004

January 15, 2004 @ 1:55 am. Type: Comment. Permalink.
Joshua Hore wrote:

Sorry, all those <code> tags make it look weird.

January 15, 2004 @ 2:23 am. Type: Comment. Permalink.
Mark wrote:

Interesting. I’ve copied the datetime convertion functions from the previous version. I’ll have a look at it later today.

January 15, 2004 @ 6:34 pm. Type: Comment. Permalink.
Mark wrote:

Hi Joshua,

I’ve created a new post on this subject, you can read it here: http://neo.dzygn.com/archives/individual/41

January 15, 2004 @ 7:39 pm. Type: Comment. Permalink.
Kevin Hale wrote:

This version of nice titles doesn’t work in Safari 1.2. I know Dunstan’s original code did. Anyone have an explanation?

February 4, 2004 @ 5:55 am. Type: Comment. Permalink.
Mark wrote:

Hi Kevin,

Can you tell me if there are any JavaScript errors in Safari 1.2? Unfortunately I don’t own a Mac, thus I can’t test the script.

February 4, 2004 @ 10:15 am. Type: Comment. Permalink.
Kenneth wrote:

Hi Mark,

I was wondering if your version of nicetitles could be used on an image map’s AREA tag, and if so, hows a good way to do that? Modify the JS to load area tags or use onmouse events on the area tag to create them? I don’t think anyone else has done this, so some sample code would be sweet too! Thanks!

February 5, 2004 @ 7:43 pm. Type: Comment. Permalink.
Mark wrote:

Hello Kenneth,

this is nothing hard. The following code must be loaded in the page somewhere before the body and after NiceTitles is loaded:

Edit: WordPress became aggressive towards the code, it can now be found here.

I’d love to see this in action, please post a link!

Disclaimer: quite unnecessary, but here anyway, I haven’t tested this code. It’s copy-paste with some small changes from the original NiceTitles code. It’ll work just fine.

February 6, 2004 @ 7:09 pm. Type: Comment. Permalink.
Josh wrote:

Re: Safari 1.2 problems

There are no javascript errors; in fact, the titles will even render on occasion, but they are in no way consistent or reliable.

For example, on the site I am currently developing, on the main page the titles will suddenly pop up for a certain link (and only one or two), then I scroll the page a little and they no longer work.

The same behaviour is occuring in Internet Explorer for mac, as well as Firefox, but Camino renders everything correctly.

Take a look if you get the chance.

Thanks.

February 19, 2004 @ 10:31 am. Type: Comment. Permalink.
Mark wrote:

Hi Josh,

Truely I have no idea what may cause this odd behaviour. The thing which confuses me is that it also occurs in IE and Firefox, but not in Camino.

As far as I was able to find out Camino is using a Gecko 1.2 branch. Firefox is using 1.6. Because the script works on Windows platforms on various Gecko engines (even the one used in NS6.2) and because there are problems in multiple browsers I believe this is an OS quirk.

Since you say they sometimes work, once or twice, I believe this has to do with the mouseover event not properly fired. But, again, I’m clueless why this is happening.

Which Mac OS version are you using? 10.3?

February 19, 2004 @ 5:57 pm. Type: Comment. Permalink.
Josh wrote:

Yes, 10.3. Has anybody else noticed this with another browser/mac os combination? I have noticed that the original nice titles version at kryogenix.org and bradchoate.com seem to work okay.

February 20, 2004 @ 9:04 am. Type: Comment. Permalink.
Josh wrote:

One other thing: I have noticed that using a fluid layout introduces a fair amoujt of added bugs in Mac OS… internet explorer completely mangles my current project, for instance (linked from my name), as does safari in certain instances. Hopefully as I begin squashing these bugs (I am probably going to switch to an absolute centered layout soon), the bug with nice titles will go away. Meanwhile if you come t osome brilliant solution, Mark, I will be eternally impressed.

Great solution, by the way; it looks fantastic on Windows browsers.

February 20, 2004 @ 9:09 am. Type: Comment. Permalink.
Kevin wrote:

I removed the -moz tags in the css file and now it works as should in Firefox. Unfortunately, it still doesn’t even show at all in Safari. Josh, I use a absolute positioned layout and I still get the same nicetitle bugs.

February 22, 2004 @ 4:22 pm. Type: Comment. Permalink.
Mark wrote:

Kevin, you are talking about Firefox on the Mac? If memory serves those -moz properties where for the opacity, right?

February 22, 2004 @ 4:26 pm. Type: Comment. Permalink.
Kevin wrote:

Right. Firefox for the mac on Panther. The moz properties were for the opacity and the rounded corners. I don’t know why that affects it, but it does. If anyone is interested, you can check out a slight mod of nicer titles implementation at my site to see titles that follow the cursor and also use the alt tags in images to create titles.

Thanks Mark for making that easy.

Update by Mark: here’s the link: http://weblog.unfoldedorigami.com/

February 22, 2004 @ 7:54 pm. Type: Comment. Permalink.
Mark wrote:

Kevin, my compliments on your modifications. You’ve reused the code well :)

To prevent confusing you can add a few comments stating what you have changed. Also, the mouse following could be improved by reusing the position code from the show function, however this solution is smart too :)

Right now I’m way too busy to implement a mousefollowing function and the images by default. I’ll post a link to your page though.

And hey, making it easy was my intention :)

February 22, 2004 @ 8:02 pm. Type: Comment. Permalink.
Adrian Madrid wrote:

I’m new to this JS titles code but I was wondering if there was a dynamic version of the script that takes all the links in a page and using attributes creates the nice titles you have going on here. My question comes from trying to implement something like this on a CMS that links are more dynamic and out of my direct control.

Thanks in advance,

Adrian Madrid

April 13, 2004 @ 11:45 pm. Type: Comment. Permalink.
Mark Wubben wrote:

Hi Adrian,

NiceTitles works on existing links in the HTML. You don’t need to have control over the links, they only need to have a title attribute specified.

April 14, 2004 @ 10:24 am. Type: Comment. Permalink.
DB wrote:

Not to sound foolish or anything but… where, exactly, does one download the script to make this work? A nice little “Download the file here” link would be nice.

June 1, 2004 @ 7:18 pm. Type: Comment. Permalink.
DB wrote:

http://neo.dzygn.com/_style/screen.css

Doh! Never mind… ;)

June 1, 2004 @ 7:21 pm. Type: Comment. Permalink.
Mark Wubben wrote:

DB, thanks for letting me know. You can download the script again.

June 2, 2004 @ 10:20 am. Type: Comment. Permalink.
Jeremy’s Little Corner Of The Web… » Nicer Titles wrote:

[…] ally display the new tooltip text, which is very cool. The latest version is available at neo.dzygn.com, while Dunstan& […]

June 22, 2004 @ 1:31 am. Type: Pingback. Permalink.
Chris Falco wrote:

I’m still trying to get the nice titles to show up on my image maps, I got the code from WordPress, but I must be putting it in the wrong spot or not modifing it correctly.

Anyone able to tell me step by step how to add that piece of code?

Thanks!

August 6, 2004 @ 9:33 pm. Type: Comment. Permalink.
Mark wrote:

Chris, it would help if I could see the code you’re using.

August 8, 2004 @ 12:33 pm. Type: Comment. Permalink.
Peter J. wrote:

Here’s how far behind I am: I just got around to replacing my own version of NiceTitles with yours. Is very nice… I should’ve switched a long time ago!

August 14, 2004 @ 11:26 pm. Type: Comment. Permalink.
Nik’s blog » Blog Archive » Nicer Titles wrote:

[…] Nicer Titles Sunday, August 29th, 2004 at 11:30 pm by niklas aving seen Nicer Titles demonstrated at Binary Bonsai, I decided to incorporate it into my page. Don’ […]

August 29, 2004 @ 10:30 pm. Type: Pingback. Permalink.
Nik wrote:

Great work! :) Two questions: have you made it work with Safari? (the verison I downloaded didn’t) And, how do I add support for alt-tags? I’d far prefer to use img’s alt tags on images than title

August 29, 2004 @ 11:10 pm. Type: Comment. Permalink.
Mark wrote:

Hi Nik,

the event function I use doesn’t work in Safari, I’ve tried to debug this with Dunstan Orchard but to no avail. I should try again sometime :)

Regarding the alt attribute on images, it should actually be used to provide alternative content if the image cannot be loaded. The title attribute should be used to describe the image. However, IE’ll show the alt attribute anyway.

But hey, All this semantic stuff doesn’t mean you can’t do this with NiceTitles. If you look at the source you’ll find the autoCreation method. Here the nice titles are created. Try reading the tutorial on this page and add the nice titles to your image tags, it isn’t hard.

August 30, 2004 @ 3:15 pm. Type: Comment. Permalink.
Kevin Hale wrote:

September 21, 2004 @ 3:48 am. Type: Comment. Permalink.
Kevin Hale wrote:

Ugh, it just ate my post. Anyway, I’ve finally gotten back to this after getting live searching to work with movabltype and so I’ll email you mark with my specific changes to the code that allows for mouse tracking and img/alt nicetitles. I maintain a creative writing site so it would be more appropriate here. I’ve improved my last version so that it still allows for the delay and doesn’t do a weird flickering that happens in os x firefox.

People can see my adaptation of the code here:
http://depository.unfoldedorigami.com/nicetitle.js

Also, I don’t think the problems with Safari lie in the event function. At least not solely. If you use a method for creating the equivalent of image maps using css only, the links will display nicetitles in safari.

Here’s an example:
http://unfoldedorigami.com

Anyway, I’m hoping to figure it out soon. I’m determined.

September 21, 2004 @ 3:54 am. Type: Comment. Permalink.
Kevin Hale wrote:

Okay, nicetitles will also show in safari if you use it on input and textareas. Here’s an example of that:

http://depository.unfoldedorigami.com/blintz/

Looks like, everything but the link itself seems to work. If you set the width and height of link tag (like 200px by 200px) everything but the actual text of the tag will display the nicetitle. Hrmmm…

September 21, 2004 @ 4:26 am. Type: Comment. Permalink.
Mark Wubben wrote:

Hey Kevin,

nice mods, seems to integrate well with the original code!

I’m still planning to write a new version someday, it won’t be someday soon though :)

Thanks for contributing,

- Mark

September 21, 2004 @ 2:19 pm. Type: Comment. Permalink.
chenu wrote:

I just added this to my journal at chenu-j.net and the boxes appear. The problem is that there is nothing in the boxes. No text. I didn’t modify the css so it should work.

I’ve seen it working in many websites and have tried copying the exact code. Yet it won’t work for me.

I’m using wordpress if that changes anything.

September 28, 2004 @ 12:11 am. Type: Comment. Permalink.
Mark Wubben wrote:

Works fine here, chenu. Which browser did you use?

September 28, 2004 @ 9:57 am. Type: Comment. Permalink.
Matt’s Blog » Blog Archive » Nicer Titles wrote:

[…] Added this css/js combination to get some really slick mouseovers on links… Nicer Titles (neo-dzygn-com) This entry was posted on Sa […]

October 10, 2004 @ 2:28 am. Type: Pingback. Permalink.
Michael Heilemann wrote:

I also have the problem with the nice titles working on for instance images, but not actual links. I’m using Safari… Mail me if you don’t have Safari and want some help with figuring this out, and I’ll be your test subject :)

November 13, 2004 @ 11:48 pm. Type: Comment. Permalink.
torresburriel.com » Elementos title con un poco de estilo (II) wrote:

[…] urar los elementos title son: Nice titles Nice Titles revised Nicer Titles Comentarios &raqu […]

January 24, 2005 @ 4:44 pm. Type: Pingback. Permalink.
Tom wrote:

I am implementing nicetitles into my website mainly to display descriptive pop-ups for an image-map. What I would like to do is seperate my pop up into 2 parts:
```
---------------    --------------------

|    Title    |    |  area alt value  |

---------------    --------------------

| Description |    | area title value |

---------------    --------------------
	
```
Is it possible to do something like:
```
NiceTitles.autoCreated.area.addElements(document.getElementsByTagName("area"), ("alt", "title"));
	
```
and then create a for loop to make nicetitle an array if an array is sent to sAttribute ?

I’ve never really coded JavaScript so I would greatly appreciate any input. (If you click my name, it will take you to the page of what I have so far. The image map is slightly off because I resized the image and not all “area” tags have been coded with an “alt” and “title” but both monitors should work.)

February 2, 2005 @ 4:49 am. Type: Comment. Permalink.
Mark Wubben wrote:

Tom, I’m not really sure what you want. You can access the attributes using the attr(...) syntax already.

February 2, 2005 @ 2:04 pm. Type: Comment. Permalink.
Tom wrote:

Thanks Mark! I didn’t realize that and that does take care of what I was trying to do.

February 2, 2005 @ 7:33 pm. Type: Comment. Permalink.
Tom wrote:

I don’t mean to be a pain, but I have 1 more question. Is there a way to supress 2 HTML tag attributes? My problem is with IE, when I pass “alt” to sAttribute, I understand how it gets renamed to nicetitle and therefore IE does not display the alt tool-tip. But my HTML tag has an alt and title, so IE displays the title tool-tip on top of the nicetitle tool-tip (which I have set up to use the alt and title values). Thanks in advance once again!

February 4, 2005 @ 12:21 am. Type: Comment. Permalink.

Mark Wubben wrote:

Try this:

var listArea = document.getElementsByTagName("area");

for(var i = 0, limit = listArea.length; i < limit; i++){

listArea[i].setAttribute("nicetitle2", listArea.removeAttribute("alt"));

};
	NiceTitles.autoCreated.area.addElements(document.getElementsByTagName("area", "title");

In your template you now have to use nicetitle2 instead of alt.

February 4, 2005 @ 10:28 am. Type: Comment. Permalink.

David Osolkowski wrote:

There’s a slight problem with the current version of the script in the zip file, in that you can’t use an attribute more than once in a template string. The code
```
for(sAttribute in oFound){

	sResult = sResult.replace("attr("+sAttribute+")", oFound[sAttribute]);

}
```
should be changed to
```
for(sAttribute in oFound){

	while (sResult.indexOf("attr("+sAttribute+")") != -1) {

		sResult = sResult.replace("attr("+sAttribute+")", oFound[sAttribute]);

	}

}
```
to fix this. I did this so that I could wrap the URL for a link NiceTitle in an A tag, which looks a little more interesting.

February 27, 2005 @ 5:04 am. Type: Comment. Permalink.

David Osolkowski wrote:

Shoot, I think there’s the same problem for content() references. Change

if(sResult.match(/content()/)){

	sResult = sResult.replace(/content()/g, getContentOfNode(oNode));

}

while(sResult.match(/content()/)){

	sResult = sResult.replace(/content()/g, getContentOfNode(oNode));

}

February 27, 2005 @ 5:09 am. Type: Comment. Permalink.

Mark Wubben wrote:

Interesting. Thanks for posting that :)

February 27, 2005 @ 1:18 pm. Type: Comment. Permalink.

Due to some recent spam, and because this site is no longer active I've decided to disable comments side-wide. You can always mail me if you have questions. Thanks!

Navigate

Colophon

Hey! I'd like you to know that this site will be gone soon. Problems with this site (which never was intented as a final release, but has been active for some months already now) will not be solved, sorry for any inconvenience.

Nicer Titles (neo-dzygn-com)

Archive

Nicer Titles

CSS

Templates

Creating a NiceTitle

To conclude with

Comments

Stuart Langridge wrote:

Mark wrote:

Chris Owens wrote:

Chris Owens wrote:

Chris Owens wrote:

Chris Owens wrote:

Mark wrote:

Chris Owens wrote:

Chris Owens wrote:

Couchblog wrote:

Mark wrote:

Anonymous wrote:

Mark van Kampen wrote:

Mark wrote:

Joshua Hore wrote:

Joshua Hore wrote:

Mark wrote:

Mark wrote:

Kevin Hale wrote:

Mark wrote:

Kenneth wrote:

Mark wrote:

Josh wrote:

Mark wrote:

Josh wrote:

Josh wrote:

Kevin wrote:

Mark wrote:

Kevin wrote:

Mark wrote:

Adrian Madrid wrote:

Mark Wubben wrote:

DB wrote:

DB wrote:

Mark Wubben wrote:

Jeremy’s Little Corner Of The Web… » Nicer Titles wrote:

Chris Falco wrote:

Mark wrote:

Peter J. wrote:

Nik’s blog » Blog Archive » Nicer Titles wrote:

Nik wrote:

Mark wrote:

Kevin Hale wrote:

Kevin Hale wrote:

Kevin Hale wrote:

Mark Wubben wrote:

chenu wrote:

Mark Wubben wrote:

Matt’s Blog » Blog Archive » Nicer Titles wrote:

Michael Heilemann wrote:

torresburriel.com » Elementos title con un poco de estilo (II) wrote:

Tom wrote:

Mark Wubben wrote:

Tom wrote:

Tom wrote:

Mark Wubben wrote:

David Osolkowski wrote:

David Osolkowski wrote:

Mark Wubben wrote:

Leave a Comment

Navigate

Colophon

Summary

Context

Misc.