var mainslider;
/***********/
$(document).ready(function(){
    var options = {
        slides: '.slide', // the name of a slide in the slidescontainer
        swipe: true,    // add possibility to swipe > note that you have to include touchswipe for this
        transition:'fade',
        slidetracker: true, // add a ul with list items to track the current slide
        slidetrackerid: 'slideposition', // the name of the ul that tracks the slides
        slideoninterval: true, // slide on interval
        interval: 9000, // interval to slide on if slideoninterval is enabled
        animateduration: 1000, // duration of an animation
        animationeasing: 'ease', // accepts: linear ease in out in-out snap easeoutcubic easeinoutcubic easeincirc easeoutcirc easeinoutcirc easeinexpo easeoutexpo easeinoutexpo easeinquad easeoutquad easeinoutquad easeinquart easeoutquart easeinoutquart easeinquint easeoutquint easeinoutquint easeinsine easeoutsine easeinoutsine easeinback easeoutback easeinoutback
        pauseonhover: false, // pause when user hovers the slide container
        neverending:true
    };

    $(".slider").simpleslider(options);
    mainslider = $(".slider").data("simpleslider");
    /* yes, that's all! */

    $(".slider").on("beforesliding", function(event){
        var prevslide = event.prevslide;
        var newslide = event.newslide;
        $(".slider .slide[data-index='"+prevslide+"'] .slidecontent").fadeout();
        $(".slider .slide[data-index='"+newslide+"'] .slidecontent").hide();
    });

    $(".slider").on("aftersliding", function(event){
        var prevslide = event.prevslide;
        var newslide = event.newslide;
        $(".slider .slide[data-index='"+newslide+"'] .slidecontent").fadein();
    });

    $(".slide#first").backstretch("images/bg1.jpg");
    $(".slide#sec").backstretch("images/bg3.jpg");
    $(".slide#thirth").backstretch("images/bg4.jpg");
    $(".slide#fourth").backstretch("images/bg5.jpg");

    $('.slide .backstretch img').on('dragstart', function(event) { event.preventdefault(); });

    $(".slidecontent").each(function(){
        $(this).css('margin-top', -$(this).height()/2);
    });
});