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

Matt Trask
Matt Trask
10,027 Points

wmuSlider

Im in the jQuery track where we add the wmuSlider plugin to the HTML to start the animation on the page. I go to github and get the fils, and save them to my projects folder, but when I set them in the script tags, they dont activate. I dont get the same results Andrew does in the video. Does anyone else have this happen? Any fixes?

15 Answers

Change

.wmuSlider .wmuSliderWrapper { display: none; }

to

.wmuSlider .wmuSliderWrapper { display: block; }

It works for me.

This was very helpful. I finished the code challenge and was not seeing the slider. I even went line by line to check if the code I had was what was in the project examples.

This small change made a huge difference. Thanks!

Hi Matt, I'm Steve I did that one a few days ago. I get the images in a vimeo video clip, is that what you get? I don't know why this is, maybe bc of an update to the plugin maybe>>>

I'm on the customizing google maps 3/3. I've been stuck on it for days. If you get by that and let me know I'd be much obliged. If I can help you further I'll be happy to do so.

Matt Trask
Matt Trask
10,027 Points

I dont get anything. I plug it in my code and nothing reacts on the index.html pages.

Post your code, don't forget to indent like this

<code> enter  like this</code>
Matt Trask
Matt Trask
10,027 Points

<script src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.wmuSlider.min.js"></script> <script src="external/matchmedia.js"></script> <script src="picturefill.js"></script>

    <script src="jquery.fitvids.js"></script>
    <script src="jquery.fittext.js"></script>

    <script>
      // Target your .container, .wrapper, .post, etc.
      $("#featured-video").fitVids();
      $(".fittext").fitText(2.2);
      var options = {navigationControl: false, animation:: "slide"};
      $(".wmuSlider").wmuSlider(options);
      </script>
Matt Trask
Matt Trask
10,027 Points
<script src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery.wmuSlider.min.js"></script>
    <script src="external/matchmedia.js"></script>
    <script src="picturefill.js"></script>

Do you have the inline styling?

 <style type="text/css">

/* mwuSlider */
.wmuSlider {
    position: relative;
    overflow: hidden;
    height:310px;
}
.wmuSlider .wmuSliderWrapper {
    display: none;
}
.wmuSlider .wmuSliderWrapper article {
    position: relative;
    height:310px;
}

.wmuSliderPagination {
    z-index: 2;
    position: absolute;
    left: 48%;
    bottom: 10px;
}
.wmuSliderPagination li {
    float: left;
    margin: 0 5px 0 0;
    list-style-type: none;
}
.wmuSliderPagination a {
    display: block;
    text-indent: -9999px;
    width: 10px;
    height: 10px;
    background: #4FB69F;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
.wmuSliderPagination a.wmuActive {
    background: #349C79;
}

@media screen and (max-width: 650px) {
    .wmuSlider {
        display:none;
    }
}
</style>
Matt Trask
Matt Trask
10,027 Points

I do but that doesnt affect me since the plugin doesnt work for me. I need the plugin to work first before i worry about the css

I believe you need to style it to see it. You need to check that you have the right classes

Matt Trask
Matt Trask
10,027 Points

i followed the video, and right when andrew activated it, you could see it affected the pages, but ill give it a try and see

also what browser are you using? I'd suggest mozilla or chrome. check it out in the codepen Andrew created.

Matt Trask
Matt Trask
10,027 Points

chomre, and ill check out codepen

sweet!

sweet!

sweet!