Package Exports

react-scroll-nav

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-scroll-nav) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-scroll-nav

Simple React components to create a single page web app with scroll based navigation

#Example

var React = require('react');
var Section = require('react-scroll-nav').Section
var Link = require('react-scroll-nav').Link

var Page = React.createClass({

    render: function() {
        return(
            <div>
                <div style={{position:"fixed", top:"0px", right:"200px", bottom:"0px", left:"0px"}}>
                    <Link name="chapter1">
                        This will scroll to the chapter1 section
                    </Link>

                    <Link name="chapter2">
                        This will scroll to the chapter2 section
                    </Link>

                    <Link name="chapter3">
                        This will scroll to the chapter2 section
                    </Link>
                <div>


                <div style={{position:"absolute", left:"200px", right:"0px"}}>
                    <Section name="chapter1">
                        <div style={{height:"500px"}}>
                            This has some info.
                        <div>
                    </Section>

                    <Section name="chapter2">
                        <div style={{height:"500px"}}>
                            This has some more info.
                        </div>
                    </Section>

                    <Section name="chapter3">
                        <div style={{height:"500px"}}>
                            This has evenm more info.
                        </div>
                    </Section>
                </div>
            </div>
        );
    }

});

React.render(
    <Page />,
    document.getElementById('example')
);