How do I hide the tooltip ‘title’ when using a lightbox plugin

If you want to stick with this plugin, your have to change its code a little.

Modifying jquery.lightbox-0.5.js, change

// in line 77:
objClicked.getAttribute('title')
// replace by:
objClicked.getAttribute('data-lightboxtitle')

and

// in line 81:
jQueryMatchedObj[i].getAttribute('title')
// replace by:
jQueryMatchedObj[i].getAttribute('data-lightboxtitle')

Then in your HTML, just replace the title attributes in your a with the data-lightboxtitle, like so (your code may differ a little, depending on how you use the plugin):

<a href="https://stackoverflow.com/questions/14361971/..." data-lightboxtitle="Here is your title" rel="lightbox"><img src="https://stackoverflow.com/questions/14361971/..." alt="https://stackoverflow.com/questions/14361971/..." /></a>

Background: By convention, browsers show a tooltip of your title attribute on mouseover if you have set one. Your plugin normally needs that to display the text in your lightbox, so you have no other chance than changing the plugin’s behaviour.

General advice: You have a lot of downvotes on your question. Next time, try to be a bit more specific in your explanation and provide some code or your own attempts to deal with the problem 😉

Leave a Comment