Infinite Scroll Bare Minimum.01

<!DOCTYPE html>
<html>
    <head>
		<title>Infinite Scroll Bare Minimum</title>


		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js">
		</script>

		<script type="text/javascript" src="http://static.tumblr.com/m9qxvhq/lCDmhw3in/isotope.js"></script>


<script type="text/javascript">
                $('#content').isotope({
  // options
  itemSelector : '.entry',
  layoutMode : 'masonry'
});
$('#container').isotope({
  masonry: {
    gutterWidth: 3
  }
});


$(document).ready(function(){
	var $container = $('#content');
	$container.isotope({
		filter: '*',
		animationOptions: {
			duration: 750,
			easing: 'linear',
			queue: false,
		}
	});

	$('#nav a').click(function(){
		var selector = $(this).attr('data-filter');
		$container.isotope({
			filter: selector,
			animationOptions: {
				duration: 750,
				easing: 'linear',
				queue: false,
			}
		});

		return false;
	});
});
</script>


<script type="text/javascript" src="http://static.tumblr.com/m9qxvhq/SWTmhumkz/jquery-1.7.1.min.js"></script>
    	<script type="text/javascript" src="http://static.tumblr.com/m9qxvhq/lCDmhw3in/isotope.js"></script>
<script src="http://static.tumblr.com/twte3d7/qNulm663d/infinite.js"></script>
 <script>
    $(function(){

      var $container = $('#content');

      $container.imagesLoaded( function(){
        $container.isotope({
          itemSelector : '.entry',
          isAnimated: true,
        });
      });

      $container.infinitescroll({
        navSelector  : 'div.navigation',
        nextSelector : '.navigation a#next',
        itemSelector : '#content .entry',
        },

            function( newElements ) {
                var $newElems = $( newElements ).css({ opacity: 0 });
        		$newElems.imagesLoaded(function(){
         	    $newElems.animate({ opacity: 1 });
          		$container.isotope( 'appended', $newElems, true );
        	});
        }
      );
    });
</script>


<meta name="image:Background" content="" />
<meta name="image:Lollipop Background" content="" />
<meta name="image:Quote Background" content="" />
<meta name="image:HeaderBackground" content="" />
<meta name="color:Background" content="#369fa0" />
<meta name="color:Links" content="#619251" />
<meta name="color:Text highlight" content="#d83e5c" />
<meta name="color:Lollipop" content="#000000" />
<meta name="color:Lollipop Hover" content="#b7512e" />
<meta name="color:Hover" content="#b7512e" />

<meta name="text:Post Width" content="500px" />
<meta name="text:Text Width" content="500px" />
<meta name="text:Post margin" content="10px" />
<meta name="text:Columns" content="4" />


<meta name="text:Font size" content='0.8em'/>
<meta name="text:Google Analytics ID" content=''/>
<meta name="text:Twitter Username" content=''/>

<meta name="if:Fade" content="1" />
<meta name="if:Infinite Scroll" content="1" />


    <meta name="viewport" content="width=device-width, maximum-scale=1, minimum-scale=1" />


        <link rel="shortcut icon" href="{Favicon}">
                <link rel="alternate" type="application/rss+xml" href="{RSS}">
                <link href="http://static.tumblr.com/wgijwsy/k1Hm9ei8b/normalize.css" rel="stylesheet" type="text/css" />


    <style type="text/css">


      @font-face {font-family:"Mayo";src:url('http://static.tumblr.com/m9qxvhq/dD6mhcpd0/mayonaise-condensed.otf');}
      @font-face {font-family:"Blake";src:url('http://static.tumblr.com/m9qxvhq/bnRmhedq1/blake2.ttf');}
      @font-face {font-family:"Sugah";src:url('http://static.tumblr.com/m9qxvhq/Dghmhi6ct/frenchsugar.ttf');}
      @font-face {font-family:"Sachiko";src:url('http://static.tumblr.com/m9qxvhq/UTEmhi6ks/sachiko.ttf');}
      @font-face {font-family:"Buffet";src:url('http://static.tumblr.com/m9qxvhq/0V2mhl3je/buffet_script.ttf');}
      @font-face {font-family:"Accent";src:url('http://static.tumblr.com/m9qxvhq/mc9mhlhm3/accent.ttf');}
      @font-face {font-family:"Barkentina";src:url('http://static.tumblr.com/m9qxvhq/CH5mhn23p/barkentina_1.otf');}


 ::-webkit-scrollbar {width: 8px; height: 4px; background: #ffffff; opacity:0.5;}
::-webkit-scrollbar-thumb { background-color: #aaaaaa; -webkit-border-radius: 2ex; opacity:0.5; }
::-moz-scrollbar {width: 8px; height: 4px; background: #ffffff; }
::-moz-scrollbar-thumb { background-color: #aaaaaa; -moz-border-radius: 2ex; opacity:0.4; }
::-o-scrollbar {width: 8px; height: 4px; background: #ffffff; }
::-o-scrollbar-thumb { background-color: #aaaaaa; -o-border-radius: 2ex; opacity:0.4; }


        ::selection {background: #d83e5c;color: #fff;}
        ::-moz-selection {background: #d83e5c;color: #fff;}


                                body {
                                background: #ffffff;
                                font-family: Tahoma;
                                font-size: 11px;
                                margin-left:20px;
                                }

                                #content {
                                }


.oiolosse a {
position:relative;
text-transform:uppercase;
text-decoration:none;
padding-top:50px;
font-family:Mayo;
font-size:90px;
text-align:center;
color:{color:Lollipop};
-webkit-transition: color 0.7s ease-out;
-moz-transition: color 0.7s ease-out;
}

.oiolosse a:hover {
color: {color:Lollipop Hover};
text-align:center;
-webkit-transition: color 0.7s ease-out;
-moz-transition: color 0.7s ease-out;
background-image:url('{image:Lollipop Background}');
background-attachment: fixed;
background-position: center center;
background-repeat: no-repeat;
}


.title {
font-family:"Buffet";
font-size: 25px;
margin-bottom: 10px;
}

.entry {
color: #212121;
float: left;
background: #ffffff;
margin-left:3px;
margin-bottom:1px;
}


.tumblrAutoPager_page_info, .tumblrAutoPager_page_separator {display:none;}
#infscr-loading {display:none;}
.navigation {display:none!important;}


.text {
width:{text:Text Width};
}

.photo {
width:{text:Post Width};
}

.panorama {
width:{text:Text Width};
}

.panorama:first-child {
width:{text:Post Width};
}

.photoset {
width:{text:Post Width};
}


    </style>


	</head>


	<body>


                    <div class="oiolosse">

        <h1><center><a href="/" title="{lang:Home}">{Title}</a></center></h1>
                        {block:Description}
                        <p>{Description}</p>
                        {block:Description}
                    </div>


		<div id="content">
        {block:Posts}

    	{block:Text}
		<div class="entry text">
		    {block:Title}<h1 class="title"><a href="{Permalink}">{Title}</a></h1>{/block:Title}
		    {Body}
		{/block:Text}


		    	{block:Photo}

                {block:IndexPage}

                <div class="entry photo">
                     <div class="heart" data-reblog="{ReblogURL}" data-id="{PostID}" title="Like"></div>

		        {LinkOpenTag}
                <a href="{Permalink}">
                <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="{text:Post Width}" />
                </a>
                {LinkCloseTag}


                {/block:IndexPage}


                {block:PermalinkPage}
                <div class="photo" align="center">
{LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" min-width="800px" />{LinkCloseTag}
                </div>


</div>

            {/block:PermalinkPage}


     {/block:Photo}


         {block:Panorama}
         {block:IndexPage}
         <div class="entry photo panorama">
          <div class="heart" data-reblog="{ReblogURL}" data-id="{PostID}" title="Like"></div>
         {LinkOpenTag}<img src="{PhotoURL-Panorama}" alt="{PhotoAlt}" width="{text:Text Width}" />{LinkCloseTag}

         {/block:IndexPage}

         {block:PermalinkPage}
         <div class="panorama">
         {LinkOpenTag}    <img src="{PhotoURL-Panorama}" alt="{PhotoAlt}" width="100%"/>
                        {LinkCloseTag}
         </div>
                                             {block:Caption}
                            <div class="caption">{Caption}</div>
                        {/block:Caption}

                    {/block:PermalinkPage}

                {/block:Panorama}


		{block:Photoset}
		<div class="entry photo photoset">
		    {block:IndexPage}{Photoset-250}{/block:IndexPage}
		    {block:PermalinkPage}{Photoset-700}{/block:PermalinkPage}
		    {block:Caption}{Caption}{/block:Caption}
		{/block:Photoset}


		</div>


		{/block:Posts}
		</div>


        <div class="navigation">
{block:Pagination}
{block:NextPage}<p id="page_nav"><a style="float:right" href="{NextPage}" id="next">Older ?</a>{/block:NextPage}
{block:PreviousPage}<a style="float:left" href="{PreviousPage}">? Newer</a></p>{/block:PreviousPage}
{/block:Pagination}
</div>


	</body>
</html>