Hi,
I am using PrettyPhoto to view photogallery lightbox with standard
HTML structure (from PrettyPhoto documentation) :
<a href='<%# FullUri %>' title='<%# TitleText %>' rel="prettyPhoto
[prods]">
<asp:Image ID="image" runat="server" CssClass="floatLeft product"
ImageUrl='<%# ThumbUri %>' AlternateText='<%# ImageName %>' /> </a>
It is very important to show title, but I am using jQuery tooltip
function as well.
It looks like this:
$(document).ready(function () {
$("body").append("<div id='ToolTipDiv'></div>");
$("a[title]").each(function () {
$(this).prettyPhoto({ theme: 'light_rounded' });
$(this).hover(
function (e) {
$().mousemove(function (e) {
var tipY = e.pageY + 16;
var tipX = e.pageX + 16;
$("#ToolTipDiv").css({ 'top': tipY,
'left': tipX });
});
$("#ToolTipDiv")
.html($(this).attr('title'))
.stop(true, true)
.fadeIn("fast");
$(this).removeAttr('title');
},
function () {
$("#ToolTipDiv")
.stop(true, true).fadeOut(0);
$(this).attr('title', $("#ToolTipDiv").html
());
}
);
}
);
});
The problem is that this function, removes the title attribute from
the hyperlink so PrettyPhoto cannot read from it.
Is there some simple way to use Tooltip with PrettyPhoto ?
