I am following a tutorial from nettuts, specifically here:
http://blog.themeforest.net/tutorials/jquery-for-absolute-beginners-day-11/
I am 3/4's of the way through the video and when I try to test the page, it is not working.
Here is the aspx page:
<!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></title>
<link href="css/default.css" rel="stylesheet" type="text/css" />
<script language="javascript" src="js/jquery-1.3.2.min.js"></script>
<script src="js/myscript.js" type="text/javascript"></script>
</head>
<body>
<a href="images/one.jpg"><img src="images/oneTN.jpg" alt="some image"/></a>
<a href="images/two.jpg"><img src="images/twoTN.jpg" alt="some image"/></a>
<a href="images/three.jpg"><img src="images/threeTN.jpg" alt="some image"/></a>
</body>
<html>
Here is myscript.js:
$(function() {
$('a').hover(function(e) {
var href = $(this).attr('href');
$('<img id="largeImage" src="' + href + '" alt="big image" />')
.css('top', e.pageY)
.css('left', e.pageX)
.appendTo('body');
}, function() {
$('#largeImage').remove();
});
});
The part of the tutorial I am at is not complete, but at this point, when you hover over the image, it should display the large image which it is not doing. Am I missing something like a ; or )?
I just realized that I had a console.log in the script, but I am unsure why it would still not run. Is this by design with firebug?