Problem med Jquery / Cluetips
Hej,jeg har et debat forum hvor jeg bruger Cluetips til at vise billeder i original størrelse i pop-up vinduer.
Det virker 99% men hvis et billede har været vist før og en tråd ekspanderes og dermed får sit indhold vist, så forsvinder billedet fra cluetips'en, men overskriften vises!
indholdet i en tråd vises / indsættes via et ajax kald der også opdatere cluetips for at få billeder i tråden vist i cluetips (funktionen upDateCluetips()kaldes når tråden er indsat i sin DIV)
Prøv at se mere her: http://goodbeer.dk/forumtest.php
Koden kan også ses her:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<?php
include("../includes/tinymce3.inc");
?>
<link rel="shortcut icon" href="favicon.ico">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title><?php echo "$title";?></title>
<link rel="stylesheet" href="jquery/css/custom-theme/jquery-ui-1.9.1.custom.css" />
<link rel="stylesheet" type="text/css" href="c1.css">
<link rel="stylesheet" href="jquery/cluetip/jquery.cluetip.css" type="text/css" />
<?php
include("../includes/java.inc"); ?>
<script src="jquery/js/jquery-1.8.2.js"></script>
<script src="jquery/js/jquery-ui-1.9.1.custom.js"></script>
<script src="jquery/cluetip/jquery.cluetip.js" type="text/javascript"></script>
<script>
$(function() {
$( "#dialog" ).dialog();
});
function upDateCluetips()
{
$('a.title').cluetip({ajaxCache: false, splitTitle: '|'});
$('a.flag').cluetip({ajaxCache: false, splitTitle: '|'});
$('a.label').cluetip({ajaxCache: false, splitTitle: '|' });
$('a.label1').cluetip({ajaxCache: false, splitTitle: '|', width: 200});
$('a.label2').cluetip({ajaxCache: false, splitTitle: '|', width: 300});
$('a.label3').cluetip({ajaxCache: false, splitTitle: '|', width: 400});
$('a.label4').cluetip({ajaxCache: false, splitTitle: '|', width: 500});
$('img.flag').cluetip({ajaxCache: false, splitTitle: '|', width: 180 });
}
jQuery(document).ready(function($){
upDateCluetips();
$("#findit").autocomplete({
minLength: 2,
source: function( request, response){
$.ajax({
type: 'GET',
url: 'aj/search.php',
data: {
'term':request.term
},
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data){
response(data);
},
error: function(message){
response([]);
}
});
},
select: function( event, ui ) {
}
});
});
I HTML indsættes: <a href="#" class="label4" title="02/05-2013 webmaster|Titel: <strong>Debat Logo</strong>|<img src='images/forum/debat1.jpg'"><img src="images/forum/thumb/debat1.jpg" border="0"></a>
Men når billedet har været vist i en cluetips så ændre cluetips HTML koden til:
<a href="#" class="label4" title="02/05-2013 webmaster"><img src="images/forum/thumb/debat1.jpg" border="0"></a>
og derfor "forsvinder der tekst og billede fra cluetips'en.
Jeg håber der er nogen der vil / kan give et godt råd.
Evt. også at bruge et andet jquery plugin til formålet.