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

HTML Build an Interactive Website jQuery Plugins Responsive Slider Plugin - CSS

Kiyomi Li
Kiyomi Li
22,436 Points
Posted by Kiyomi Li
Kiyomi Li
22,436 Points

wmuSlider not appearing on page

Hi,

I was following along with the video but after you added the wmuSlider plugin, the slider portion of the page did not appear. I just get a blank area with two little circles. I even used the project files associated with the video and I still get the same result. Please help. Thank you.

Héctor Carneiro
Héctor Carneiro
10,746 Points
Héctor Carneiro
Héctor Carneiro
10,746 Points

have you write this code at the bottom?

  setTimeout (function(){
    $(".fittext").fitText(2.2);

  }),1;

2 Answers

Brian Hernandez
Brian Hernandez
20,285 Points
Brian Hernandez
Brian Hernandez
20,285 Points

Hey Kiyomili,

I was getting the same problems as you with just the pagination in mint green showing up on the lower left and nothing else showing. The problem for me seemed to happen after adding some of the CSS styling from the demo.css that came with the plugin download into the head of the index.html page.

After looking through some of the CSS styling that we are told to put in the head of index.html I noticed this:

    <meta name="viewport" content="width=device-width, initial-scale = 1.0">
    <style>
        .wmuSlider {
            position: relative;
            overflow: hidden;
            height: 310px;
        }
        .wmuSlider .wmuSliderWrapper {
            display: none;
        }
        .wmuSlider .wmuSliderWrapper article {
            position: relative;
            height: 310px;
        }

Can you tell? .wmuSlider and .wmuSliderWrapper is set to display:none After commenting out this line, I was able to see the plugin again in both my Safari and Firefox browsers. Maybe it was forgotten to be mentioned in the video.

        .wmuSlider .wmuSliderWrapper {
            /*display: none;*/
        }

Hopefully that helps your situation. Since the pagination was showing up, I began to troubleshoot with turing off some of the different CSS declarations and quickly stumbled upon the display: none and figured that had to be the reason why it wasn't showing.

Kiyomi Li
Kiyomi Li
22,436 Points
Kiyomi Li
Kiyomi Li
22,436 Points

Thanks! I noticed that right after I posted my question.