animated BG with JSON flip titles

animated BG with JSON flip titles

by Andrew Pougher

HTML

<div class="container">
    <div class="row">
<h2 class="page-header text-center"></h2>
        <p class="text-center">
            <button type="button" class="btn btn-lg btn-danger">Learn More</button></p>
    </div>
      </div>

CSS

html, body {
    min-height: 100%;
}

body {
    background: url('http://lorempixel.com/800/1000/animals/');
    height: 100%;
}
h2{color:white}

JavaScript

setInterval(function () {
            $('body').animate({'background-position': '0px +=1px'}, 1);
        }, 50);



var TChanger = {

    /**
     * @param titles
     */
    run: function (titles) {
        if (!titles || titles.length < 2) {
            return;
        }
        var tempTitles = titles.slice(1);
        setInterval(function () {
            if (!tempTitles.length) {
                tempTitles = titles.slice(0);
            }
            var title = tempTitles.splice(0, 1)[0];
            document.title = title;
            $("h2").html(title)
        }, 1500);
    }
};

    TChanger.run( JSON.parse('["Andrews animal awareness site","Animals are amazing","Respect the animals", "Animals are not our property"]') );

/**/

/* http://keith-wood.name/backgroundPos.html
 Background position animation for jQuery v1.1.1.
 Written by Keith Wood (kbwood{at}iinet.com.au) November 2010.
 Available under the MIT (https://github.com/jquery/jquery/blob/master/MIT-LICENSE.txt) license.
 Please attribute the author if you use it. */
(function ($) {
    var g = !!$.Tween;
    if (g) {
        $.Tween.propHooks['backgroundPosition'] = {
            get: function (a) {
                return parseBackgroundPosition($(a.elem).css(a.prop))
            }, set: setBackgroundPosition
        }
    } else {
        $.fx.step['backgroundPosition'] = setBackgroundPosition
    }
    ;
    function parseBackgroundPosition(c) {
        var d = (c || '').split(/ /);
        var e = {center: '50%', left: '0%', right: '100%', top: '0%', bottom: '100%'};
        var f = function (a) {
            var b = (e[d[a]] || d[a] || '50%').match(/^([+-]=)?([+-]?\d+(\.\d*)?)(.*)$/);
            d[a] = [b[1], parseFloat(b[2]), b[4] || 'px']
        };
        if (d.length == 1 && $.inArray(d[0], ['top', 'bottom']) > -1) {
            d[1] = d[0];
            d[0] = '50%'
        }
        f(0);
        f(1);
        return d
    }

    function setBackgroundPosition(a) {
        if...