I'm not quite sure what is wrong. I've tried a few things but I just can't get it working. When you hover over the link it should have a little image but it won't work. It seems to be outputting the HTML correctly
<html>
<head>
<title>JamieHankins.co.uk</title>
<link rel="stylesheet" href="http://jamiehankins.co.uk/css.css">
<style type="text/css">
table.tables td {
border-width: 4px;
padding: 8px;
border-style: solid;
border-color: #999999;
}
.ddimgtooltip{
box-shadow: 3px 3px 5px #818181; /*shadow for CSS3 capable browsers.*/
-webkit-box-shadow: 3px 3px 5px #818181;
-moz-box-shadow: 3px 3px 5px #818181;
display:none;
position:absolute;
border:1px solid black;
background:white;
color: black;
z-index:2000;
padding: 4px;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
var ddimgtooltip={
tiparray:function(){
var tooltips=[]
<?php
$count = 0;
if ($handle = opendir('.')) {
while (false !== ($entry = readdir($handle))) {
if ($entry != "." && $entry != "..") {
$count++;
echo"
";
echo "tooltips[$count]=['$entry']";
}
}
}
?>
return tooltips
}(),
tooltipoffsets: [20, -30],
tipprefix: 'imgtip',
createtip:function($, tipid, tipinfo){
if ($('#'+tipid).length==0){
return $('<div id="' + tipid + '" class="ddimgtooltip" />').html(
'<div style="text-align:center"><img src="' + tipinfo[0] + '" /></div>'
+ ((tipinfo[1])? '<div style="text-align:left; margin-top:5px">'+tipinfo[1]+'</div>' : '')
)
.css(tipinfo[2] || {})
.appendTo(document.body)
}
return null
},
positiontooltip:function($, $tooltip, e){
var x=e.pageX+this.tooltipoffsets[0], y=e.pageY+this.tooltipoffsets[1]
var tipw=$tooltip.outerWidth(), tiph=$tooltip.outerHeight(),
x=(x+tipw>$(document).scrollLeft()+$(window).width())? x-tipw-(ddimgtooltip.tooltipoffsets[0]*2) : x
y=(y+tiph>$(document).scrollTop()+$(window).height())? $(document).scrollTop()+$(window).height()-tiph-10 : y
$tooltip.css({left:x, top:y})
},
showbox:function($, $tooltip, e){
$tooltip.show()
this.positiontooltip($, $tooltip, e)
},
hidebox:function($, $tooltip){
$tooltip.hide()
},
init:function(targetselector){
jQuery(document).ready(function($){
var tiparray=ddimgtooltip.tiparray
var $targets=$(targetselector)
if ($targets.length==0)
return
var tipids=[]
$targets.each(function(){
var $target=$(this)
$target.attr('rel').match(/\[(\d+)\]/)
var tipsuffix=parseInt(RegExp.$1)
var tipid=this._tipid=ddimgtooltip.tipprefix+tipsuffix
var $tooltip=ddimgtooltip.createtip($, tipid, tiparray[tipsuffix])
$target.mouseenter(function(e){
var $tooltip=$("#"+this._tipid)
ddimgtooltip.showbox($, $tooltip, e)
})
$target.mouseleave(function(e){
var $tooltip=$("#"+this._tipid)
ddimgtooltip.hidebox($, $tooltip)
})
$target.mousemove(function(e){
var $tooltip=$("#"+this._tipid)
ddimgtooltip.positiontooltip($, $tooltip, e)
})
if ($tooltip){
$tooltip.mouseenter(function(){
ddimgtooltip.hidebox($, $(this))
})
}
})
})
}
}
ddimgtooltip.init("*[rel^=imgtip]")
</script>
</head>
<body>
<div class="box">
<span class="title">Screenshot Bin</span>
<table class="tables">
<tr>
<?php
$COUNT = 0;
if ($handle = opendir('.')) {
while (false !== ($entry = readdir($handle))) {
if ($entry != "." && $entry != ".." && $COUNT % 3 == 0) {
echo "</tr><tr><td><a href='$entry' rel='imgtip[$COUNT]'>$entry</a></td>";
$COUNT++;
}
else {echo "<td><a href='$entry' rel='imgtip[$COUNT]'>$entry</a></td>";
$COUNT++;
}
}
closedir($handle);
}
?>
</tr>
</table>
</div>
<div class="proboxs">
<a class="social" href="http://jamiehankins.co.uk/">Back</a>
</div>
</body>
</html>
</body>
</html>
