fullpageJS visual studio html

Question

I have been asked to write a simple demo page and we settled on fullpage.js.

I have used html and css before, I typically write in c++ and c# so this is not my forte. I haven't done any front end work in a while.

For some reason, when I try to follow the official tutorial, my page has no styling and the scroll does not work. just a white page with a bit of text.

Can anyone help point me in the right direction in order to set up a simple page in visual studio?

here is the html page i have:

<!DOCTYPE html>
<html>
<head>
    <link href="Content/jquery.fullPage.css" rel="stylesheet" />
    <script src="scripts/jquery.fullPage.min.js"></script>
    <script src="scripts/jquery-2.1.4.intellisense.js"></script>
    <script src="scripts/jquery-2.1.4.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#fullpage').fullpage();
        });
    </script>
</head>

<body>
    <div id="fullpage">
        <div class="section">Section 1</div>
        <div class="section">
            <div class="slide">Section 2 Slide 1</div>
            <div class="slide">Section 2 Slide 2</div>
            <div class="slide">Section 2 Slide 3</div>
         </div>
        <div class="section">Section 3</div>
    </div>
</body>
</html>

Answer 1

After downloading their examples it looks like you have the basic implementation correct.

Only difference is that all of their example projects include a sectionsColor: property like this

$(document).ready(function() {
    $('#fullpage').fullpage({
        sectionsColor: ['#f2f2f2', '#4BBFC3', '#7BAABE', 'whitesmoke','#ccddff']
    });
});

If adding that doesn't work, inspect element and check the console tab. See if its giving you a 404 error for your dependencies, and make sure all those paths don't need a '../', or have a bad capitalization, or dependencies are in the correct order.

But if everything is breaking with something doing this much magic for you, there's a bad bit of js some place and you only have one function to look at.

EDIT: Now that I mention it, you have jQuery below fullpage.js. It needs to be above it as javascript reads and runs those in order. So it can't see the jquery functions it needs. Switch that around and you should be fine.

fullpageJS visual studio html

Question

1 answers

solution1
0 2016-07-14 00:17:59

fullpageJS visual studio html

Question

1 answers

solution1 0 2016-07-14 00:17:59

solution1
0 2016-07-14 00:17:59