<div id="wrapper" class="toggled">



         <div id="sidebar-wrapper">
            <ul class="sidebar-nav">
                <li class="sidebar-brand">
                    <a href="#">
                        SlashTv
                    </a>
                </li>
                <li>
                    <a href="#">Nos émissions</a>
                </li>
                <li>
                    <a href="#">A venir</a>
                </li>
                <li>
                    <a href="#">Evènements</a>
                </li>
                <li>
                    <a href="#">A Propos</a>
                </li>
                <li>
                    <a href="#">Services</a>
                </li>
                <li>
                    <a href="#">Contact</a>
                </li>
            </ul>
        </div>        


<div id="page-content-wrapper">
     <img src="data:image/png;base64,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" alt="quote-left" style="max-width:100px" class="pull-right">
    <a class="btn btn-default" href=#menu-toggle" id="menu-toggle"><span class="glyphicon glyphicon-align-justify"></span></a>
    <div class="container-fluid">
        <div class="row">

            <div class="home-container">   
                 <canvas></canvas> 
                <div class="main-content">
                   
                    <div class="text-home">
                        <img src="data:image/png;base64,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" alt="quote-left" style="max-width:100%">
                        
                        <div class="line"></div>
                        <ul class="nav">
                           <li><a href="#" class="chaffle maj" data-lang="en"  >Votre</a></li>
                           <li><a href="#" class="chaffle maj" data-lang="en"  >Télévision</a></li>
                           <li><a href="#" class="chaffle maj" data-lang="en"  >Numérique</a></li>
                        </ul>
                       
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<div id="footer">

</div>

</div>
  
html,body{padding:0}

body {

    color: #333;
    margin: 0px;
    padding: 0px;
    font-size: 14px;
    line-height: 1.2;
    font-family: 'Lato', sans-serif;
    background-color:#fff ;
    overflow:hidden;
    overflow-x: hidden;
background: url(../images/poly_bg.jpg)no-repeat;
}

canvas{	position: absolute;top: 0;left: 0;right: 0;bottom: 0;height: 100%;width: 100%;}
.text-home{display:table-cell;vertical-align:middle;text-align:center;}
.maj{text-transform:uppercase}
.home-container{height:100%;position: relative;}
.main-content{display:table;vertical-align:middle;margin-right: auto;margin-left: auto;text-align:center;}
.chaffle{background:none;background-color:transparent;color:#000;float:left}
.nav > li > a:hover, .nav > li > a:focus {text-decoration: none;background-color: transparent;color:#000;}
.nav {padding-left: 3em;}
 .line {top: 0;left: 0;right: 0;width: 30px;margin: 1em auto;border: 1px solid rgba(50, 50, 50, 0.9);}
/*!
 * Start Bootstrap - Simple Sidebar HTML Template (https://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

/* Toggle Styles */

#wrapper {
    padding-left: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#wrapper.toggled {
    padding-left: 250px;
}

#sidebar-wrapper {
    z-index: 1000;
    position: fixed;
    left: 250px;
    width: 0;
    height: 100%;
    margin-left: -250px;
    overflow-y: auto;
    background: #000;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#wrapper.toggled #sidebar-wrapper {
    width: 250px;
}

#page-content-wrapper {
    width: 100%;
    padding: 15px;
}

#wrapper.toggled #page-content-wrapper {
    position: absolute;
    margin-right: -250px;
}

/* Sidebar Styles */

.sidebar-nav {
    position: absolute;
    top: 0;
    width: 250px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sidebar-nav li {
    text-indent: 20px;
    line-height: 40px;
}

.sidebar-nav li a {
    display: block;
    text-decoration: none;
    color: #999999;
}

.sidebar-nav li a:hover {
    text-decoration: none;
    color: #fff;
    background: rgba(255,255,255,0.2);
}

.sidebar-nav li a:active,
.sidebar-nav li a:focus {
    text-decoration: none;
}

.sidebar-nav > .sidebar-brand {
    height: 65px;
    font-size: 18px;
    line-height: 60px;
}

.sidebar-nav > .sidebar-brand a {
    color: #999999;
}

.sidebar-nav > .sidebar-brand a:hover {
    color: #fff;
    background: none;
}

@media(min-width:768px) {
    #wrapper {
        padding-left: 250px;
    }

    #wrapper.toggled {
        padding-left: 0;
    }

    #sidebar-wrapper {
        width: 250px;
    }

    #wrapper.toggled #sidebar-wrapper {
        width: 0;
    }

    #page-content-wrapper {
        padding: 20px;
    }

    #wrapper.toggled #page-content-wrapper {
        position: relative;
        margin-right: 0;
    }
}
/* FUNCTIONS BASE JS */
function goTo(element) {
	jQuery('html, body').animate({scrollTop: (jQuery(element).offset().top)-170}, 500, function(){});
}


//Menu latéral toggle & lettring
jQuery(function() {
	
    $("#menu-toggle").click(function(e) {
        e.preventDefault();
        $("#wrapper").toggleClass("toggled");
    });
    $(document).ready(function() {
     $('.chaffle').chaffle({
      speed: 20,
      time: 140
    });
   });
});

//effets background particules

    (function() {
        setInterval(function() {
            var now, timestamp;
            timestamp = new Date(1987, 5, 30);
            now = new Date();
            return $('#time').text(((now - timestamp) / 1000).toFixed(0));
        }, 1000);
    }).call(this);

    $(window).on('resize', function() {
        reinit();
    });

//CANVAS
    $(function() {
        var canvas = document.querySelector('canvas'),
                ctx = canvas.getContext('2d'),
                color = '#000';
        canvas.width = window.innerWidth;
        canvas.height = window.innerHeight;
        canvas.style.display = 'block';
        ctx.fillStyle = color;
        ctx.lineWidth = .1;
        ctx.strokeStyle = color;

        var mousePosition = {
            x: 30 * canvas.width / 65,
            y: 30 * canvas.height / 65
        };

        var dots = {
            nb: 150,
            distance: 100,
            d_radius: 150,
            array: []
        };

        function Dot() {
            this.x = Math.random() * canvas.width;
            this.y = Math.random() * canvas.height;

            this.vx = -.5 + Math.random();
            this.vy = -.5 + Math.random();

            this.radius = Math.random();
        }

        Dot.prototype = {
            create: function() {
                ctx.beginPath();
                ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, false);
                ctx.fill();
            },
            animate: function() {
                for (i = 0; i < dots.nb; i++) {

                    var dot = dots.array[i];

                    if (dot.y < 0 || dot.y > canvas.height) {
                        dot.vx = dot.vx;
                        dot.vy = -dot.vy;
                    }
                    else if (dot.x < 0 || dot.x > canvas.width) {
                        dot.vx = -dot.vx;
                        dot.vy = dot.vy;
                    }
                    dot.x += dot.vx;
                    dot.y += dot.vy;
                }
            },
            line: function() {
                for (i = 0; i < dots.nb; i++) {
                    for (j = 0; j < dots.nb; j++) {
                        i_dot = dots.array[i];
                        j_dot = dots.array[j];

                        if ((i_dot.x - j_dot.x) < dots.distance && (i_dot.y - j_dot.y) < dots.distance && (i_dot.x - j_dot.x) > -dots.distance && (i_dot.y - j_dot.y) > -dots.distance) {
                            if ((i_dot.x - mousePosition.x) < dots.d_radius && (i_dot.y - mousePosition.y) < dots.d_radius && (i_dot.x - mousePosition.x) > -dots.d_radius && (i_dot.y - mousePosition.y) > -dots.d_radius) {
                                ctx.beginPath();
                                ctx.moveTo(i_dot.x, i_dot.y);
                                ctx.lineTo(j_dot.x, j_dot.y);
                                ctx.stroke();
                                ctx.closePath();
                            }
                        }
                    }
                }
            }
        };

        function createDots() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            for (i = 0; i < dots.nb; i++) {
                dots.array.push(new Dot());
                dot = dots.array[i];

                dot.create();
            }

            dot.line();
            dot.animate();
        }

        $('canvas').on('mousemove mouseleave', function(e) {
            if (e.type == 'mousemove') {
                mousePosition.x = e.pageX;
                mousePosition.y = e.pageY;
            }
            if (e.type == 'mouseleave') {
                mousePosition.x = canvas.width / 2;
                mousePosition.y = canvas.height / 2;
            }
        });
        setInterval(createDots, 1000 / 30);
    });
Run Pen

External CSS

  1. https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js