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:
$(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();
});
});<!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="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.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>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 ; 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?
console.log() wil only work with a debugging environment that supports it, such as Firebug, if you try running the page in IE you will get an error.
Where was the console.log in your script? If it was correctly formated then any code will still work correctly if Firebug is installed.