[jQuery] Fisheye Scrolling Div - Breaks Cursor Location
Si have made a scrolling div for the jquery fisheye. It works great,
except it loses the cursor location as you scroll horizontally to the
right. I read that the cursor location is calculated from the left
most image in the list.
More reading shows me that JQuery has a great set of tools...
dimension.js.
I lloked into it further and tried to implement the scolling offset to
be added back into the cursor location when using a scrolling element
such as I did with a DIV.
Code is shown below:
Here is the HTML File:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Mac Dock</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/fisheye.js"></script>
<script type="text/javascript" src="js/iutil.js"></script>
<script type="text/javascript" src="js/jquery.dimensions.js"></script>
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
$(function() {
$('input.run').bind('click', function(event) {
var code = $(this).parent().find('code.mix').text();
var result = eval(code);
if (result.jquery)
$(this).parent().find('code.result').html('jQuery object');
else if (result.top) {
var newResult = '{ ';
for (var prop in result)
newResult += prop + ': ' + result[prop] + ', ';
result = newResult.substr(0, newResult.length - 2) + ' }';
$(this).parent().find('code.result').html(result);
}
else
$(this).parent().find('code.result').html(result);
});
});
</script>
</head>
<body>
<div class="fishplaceouter" id="fishplaceouter">
<div class="fishplaceinner" id="fishplaceinner">
<div class="dock" id="dock">
<div class="dock-container" id="dock-container">
<a class="dock-item" href="#"><img src="images/home.png" alt="home" /