Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Daniel Cunningham
21,109 PointsWorkspace not updating preview window.
Despite updating app.js with the following code:
var $overlay = $('<div id="overlay"></div>');
// add an overlay
$("body").append($overlay);
// an image
// a caption
// Capture the click event on a link to an image.
$("#imageGallery a").click(function(event) {
event.preventDefault();
var href = $(this).attr("href");
$overlay.show();
});
The workspace preview is not updating to add the overlay. In fact, it is still showing the console Click event from Part 1 of the tutorial. Is there any way I can force this to read my updated code? Thanks for your help!
Daniel Cunningham
21,109 PointsSo, I dont think that will be necessary at this point. I didnt realize we could share or fork workspaces. After I hit "fork workspace" and previewed it, I got the black screen that was expected. What a strange error, but that appears to have fixed it! Thanks for your help!
Zac Mackey
11,392 PointsFantastic! Glad that fixed it, even if we have no idea why haha.
And yes, forking workspaces is awesome and I just discovered it myself the other day. Can't believe I've been on this site for this long and never knew about that feature either.
2 Answers
Zac Mackey
11,392 PointsI know what's going on here.
I use Sublime Text 2 personally, but I went ahead and opened up the workspace for this video and worked backwards using your code.
If you go to the index.html file you'll notice the
<ul>
as such, when it should be:
<ul id='imageGallery'>
Hence, when your code is running it doesn't find the UL.
Just add that ID attribute to the UL and you'll be good to go.
Daniel Cunningham
21,109 PointsHey Zac, Thanks for taking a look. Unfortunately, adding ul didn't resolve the issue. The key point I'm noticing is that the code that ran in the previous video is still being called and refreshed as I go to the preview. In the first video, we created a Jquery function that called a console.log function every time one of the links is clicked.
$ ("#imageGallery a").click(function(event) {
event.preventDefault();
var href = $(this).attr("href");
console.log(href);
Despite having saved the index.html, style.css, and app.js files, I continue to find the above code in my preview and none of the other code. No declared variable, no $("body").append($overlay) method... nothing.
I'll try running the code through sublime and seeing if it works at this point. I was hoping it was some sort of glitch, but it is still persisting.
Thanks for your help!
Justin Simon
Front End Web Development Techdegree Student 33 PointsI am experiencing the same issue, this is my first course and I can't practice
Zac Mackey
11,392 PointsZac Mackey
11,392 PointsHmm...Can you post the link to your workspace and I'll fork it?
If you've saved all the files and then clicked preview, but the code isn't updating, that sounds like a workspaces glitch.
Here's my Workspaces link for this section:
https://w.trhou.se/ro75zynyvz
If you fork it and save, then you can preview my code in your browser. I went ahead and added the overlay hide function as well, but otherwise it's only updated to this section.
Might help track down the issue?