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

JavaScript

Gabriel Ward
Gabriel Ward
20,222 Points
Posted by Gabriel Ward
Gabriel Ward
20,222 Points

app.js not working

I'm trying to prevent the default behaviour of the browser, but my app.js doesn't seem to be working, I can't see where I'm going wrong. Any help is much appreciated. Here's my code

<body>
<div class="grid-container imageGallery">
        <div class="grid-3">
            <a href="img/item-01.png">
                <div class='image'>
                    <img class="feat-img" src="img/item-01.png" alt='Image by Bob'/>
                    <div class='text'></div>
                </div>
            </a>
            <p class='caption'>Caption</p>
        </div>
        <div class="grid-3">
            <a href="img/item-01.png"><div class='image'>
                <img class="feat-img" src="img/item-02.png" />
                    <div class='text'></div>
            </div></a>
            <p class='caption'>Caption</p>
        </div>
        <div class="grid-3">
            <a href="img/item-01.png"><div class='image'>
                <img class="feat-img" src="img/item-03.png" />
                    <div class='text'></div>
            </div></a>
            <p class='caption'>Caption</p>
        </div>
        <div class="grid-3">
            <a href="img/item-01.png"><div class='image'>
                <img class="feat-img" src="img/item-04.png" />
                    <div class='text'></div>
            </div></a>
            <p class='caption'>Caption</p>
        </div>
    </div>
<script src="http://code.jquery.com/jquery-1.11.0.min.js" type="text/javascript" charset="utf-8"></script>
        <script src='app.js'></script>
</body>

$(document).ready(function(){
$('.imageGallery a').click(function(event){
        event.preventDefault();
        var href = $(this).attr('href');
        console.log(href);
});
});

1 Answer

Allison Davis
Allison Davis
12,698 Points
Allison Davis
Allison Davis
12,698 Points

Hi Gabriel, I think the problem will be fixed if you jump back a directory in the script tag in which you link the app.js file to your html file. Because you are linking to something that's not in the same folder (I'm guessing), you need to first reference the folder that app.js is stored in. For example: 

html
<script src="js/app.js"></script>

Hope that helps!

Gabriel Ward
Gabriel Ward
20,222 Points
Gabriel Ward
Gabriel Ward
20,222 Points

Hi Allison,

That wasn't the problem I've solved it now. THanks for your suggestion though. It was something about an unterminated label or something.