将鼠标悬停在图像上时删除图像标题

Question

I am using lytebox for my image gallery. It works great except when a user hovers on images, there will be texts with html tags shown on the browser.

ex:

<h1>This is the first image </h1>
<p>The image desc<p>

I need the title attribute for my image gallery but don't want it to show when the user hovesr the image. Is that possible? Thanks for the help.

Answer 1

var imgTitle;

$("img").hover(function(){
    imgTitle = $(this).attr("title");
    $(this).removeAttr("title");
}, function(){
   $(this).attr("title", imgTitle);
});

Answer 2

I think you'd have to do something like:

$('#slideshow img').hover(function() {
    $(this).data('title', $(this).attr('title'));
    $(this).attr('title', '');
}, function() {
    $(this).attr('title', $(this).data('title'));
});​

Demo: http://jsfiddle.net/lucuma/cX5MD/

You won't see the title on the img's but if you inspect them you'll see they are still there.

You could also use jQuery removeAttr and attr instead of setting it to empty string.

Answer 3

这样很简单

$('img').removeAttr('title');