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

Posted by dylan kane
dylan kane
2,094 Points

slider not registering pictures in the code?

so I have all the code for my jquery slide and i put the picture names in to the code, but they does not show up on the page. the weird thing is, is that i have used the slider on another website but it worked perfectly! help!

6 Answers

Stephen Ramsey
Stephen Ramsey
2,051 Points
Stephen Ramsey
Stephen Ramsey
2,051 Points

Try giving us more details. Are you using a slider that you built yourself or something like WOWslider? Can you post a screen of the code and maybe your file hierarchy?

dylan kane
dylan kane
2,094 Points
dylan kane
dylan kane
2,094 Points

alright so it is vmu slider, the one that you were taught how to use in the videos. here is the code...

<body>

<?php include('includes.php'); ?>

<div class="wmuSlider">

        <div class="wmuSliderWrapper">

                        <article>
                            <img src="css/img/placeh1.jpg">
                        </article>
                        <article>
                            <img src="css/img/placeh2.jpg">
                        </article>
                        <article>
                            <img src="css/img/placeh3.jpg">
                        </article>
                        <article>
                            <img src="">
                        </article>

        </div>

</div>

<!-- <div class="bottomslide">  
    <p class="bottomslidetext">Destination IUP!</p>
</div> -->


<div class="container">



</div>

<script src="js/jquery.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/jquery.wmuSlider.min.js"></script>
<script>var options = {navigationControl: false, animation: "slide"};
$(".wmuSlider").wmuSlider(options);
</script>

</body>

</html>

and the heirarchy, as you can tell, is that the images go to an img folder in the css folder. i have tried putting the images in just the css folder but no luck

Kerel Lacy
Kerel Lacy
8,474 Points
Kerel Lacy
Kerel Lacy
8,474 Points

I would try creating an image folder and using this as the path

../images/placeh1.jpg

also inspect the element of your browser to see if you are getting errors

dylan kane
dylan kane
2,094 Points
dylan kane
dylan kane
2,094 Points

great i got it to work! thank you very much. now just one more question, how could i attempt to put a box shadow under the pictures?

Kerel Lacy
Kerel Lacy
8,474 Points
Kerel Lacy
Kerel Lacy
8,474 Points

img { box-shadow: 4px 4px 5px 8px; }

etc

or you could wrap the image within the div and apply the shadow to the div

dylan kane
dylan kane
2,094 Points
dylan kane
dylan kane
2,094 Points

thanks man, that was a big help!