View difference between Paste ID: FsASJUTS and 3t3te2hp
SHOW: | | - or go back to the newest paste.
1
<!DOCTYPE html>
2
3
<!-- HTML5 Mobile Boilerplate -->
4
<!--[if IEMobile 7]><html class="no-js iem7"><![endif]-->
5
<!--[if (gt IEMobile 7)|!(IEMobile)]><!--><html class="no-js" lang="en"><!--<![endif]-->
6
7
<!-- HTML5 Boilerplate -->
8
<!--[if lt IE 7]><html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
9
<!--[if (IE 7)&!(IEMobile)]><html class="no-js lt-ie9 lt-ie8" lang="en"><![endif]-->
10
<!--[if (IE 8)&!(IEMobile)]><html class="no-js lt-ie9" lang="en"><![endif]-->
11
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"><!--<![endif]-->
12
<head>
13
14
 <meta charset="utf-8">
15
 <link rel="Shortcut Icon" type="image/x-icon" href="favicon.ico" />
16
<meta property="og:image" content="http://esmes.fi/flowfestival/instaflow/instaflow.jpg"/>
17
<meta property="og:title" content="instaflow - Flow Festival as seen on Instagram"/>
18
<meta property="og:description" content="Flow Festival is a music and arts festival in Helsinki, Finland. Instagram is a free photo-sharing program."/>
19
<title>instaflow - Flow Festival as seen on Instagram</title>
20
 <meta name="description" content="Flow Festival is a music and arts festival in Helsinki, Finland. Instagram is a free photo-sharing program.">
21
 <meta name="author" content="Esmes Digital">
22
 <meta name="HandheldFriendly" content="True">
23
 <meta name="MobileOptimized" content="320">
24
 <meta name="viewport" content="width=device-width, target-densitydpi=160dpi, initial-scale=1.0">
25
 <link rel="stylesheet" href="css/base.css" media="screen">
26
 <link rel="stylesheet" href="css/layout.css" media="screen"> 
27
 <link rel="stylesheet" href="css/jquery.fancybox-1.3.4.css" type="text/css">
28
<link rel="stylesheet" href="css/instaflow.css" type="text/css">
29
 <script src="js/modernizr.js"></script>
30
 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
31
 <script>window.jQuery || document.write('<script src="js/jquery-1.8.2.min.js"><\/script>')</script>
32
 <script src="js/jquery.instagram.js"></script>
33
<script type='text/javascript' src='js/jquery.fancybox-1.3.4.pack.js'></script>
34
 <script type="text/javascript">
35
		$(document).ready(function(){
36
			$('a.group').live('mouseenter', function(){
37
				$(this).fancybox({
38
				'nextEffect'	:	'fade',
39
				'prevEffect'	:	'fade',
40
				'overlayOpacity' :  0.8,
41
				'overlayColor' : '#000000',
42
				'arrows' : false,
43
				'titlePosition': 'inside',
44
                'titleFromAlt' :  true ,
45
			});
46
			});			
47
		});
48
		$(function(){
49
			
50
  var
51
    insta_container = $(".instagram")
52
  , insta_next_url
53
54
  insta_container.instagram({
55
      hash: 'flowfestival'
56
    , clientId : '0a15d0cfc6bd49f480b527e6a27f9d40'
57
    ,onLoad : function() {
58
    	$('#button').text('Loading...');
59
    }    
60
    , onComplete : function (photos, data) {
61
    	$('#button').text('Load more');
62
    insta_next_url = data.pagination.next_url
63
    }
64
  
65
  })
66
67
  $('button').on('click', function(){
68
    var
69
      button = $(this)
70
    , text = button.text()
71
    if (button.text() != 'All items loaded')
72
{
73
    if (button.text() != 'Loading...'){
74
      button.text('Loading...')
75
      insta_container.instagram({
76
          next_url : insta_next_url
77
    
78
        , onComplete : function(photos, data) {
79
          insta_next_url = data.pagination.next_url
80
          if (insta_next_url == null )
81
          {
82
          	  button.text('All items loaded')
83
            }
84
      else {
85
          button.text(text)
86
      }
87
        }
88
      })
89
    }
90
    }
91
     $("a.group").fancybox({
92
				'nextEffect'	:	'fade',
93
				'prevEffect'	:	'fade',
94
				'overlayOpacity' :  0.8,
95
				'overlayColor' : '#000000',
96
				'arrows' : false,
97
				'titlePosition': 'inside',
98
                'titleFromAlt' :  true ,
99
			});			    
100
  })
101
});
102
103
104
</script>
105
 
106
 <meta http-equiv="cleartype" content="on">
107
<style>
108
109
img
110
{
111
	border-style: none;
112
}
113
114
115
.thumbnail:hover { -webkit-filter: grayscale(100%);   }
116
117
</style>
118
</head>
119
<body>
120
  <div class="container clearfix">
121
	
122
  
123
    <div role="main" class="content clearfix">
124
	  <section class="row" role="content">
125
		<div class="rslides_container">
126
 	      <ul class="rslides" id="slider1">
127
        <img src="instaflow-header.jpg" alt="" />
128
129
 	      </ul> 
130
		</div>
131
		<section class="gallery row instagram"></section>
132
		
133
 	  </section>
134
135
   	</div>
136
		<div style="text-align: center; margin: 20px 0 20px 0;">
137
<button id="button" class="button orange">Load more</button>
138
</div>
139
140
141
      <footer role="contentinfo" class="row">
142
	 	<div style="width:100px;margin: 20px auto">
143
              <iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fesmes.fi%2Fflowfestival%2Finstaflow%2F&amp;send=false&amp;layout=button_count&amp;width=250&amp;show_faces=false&amp;font&amp;colorscheme=light&amp;action=like&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:21px;" allowTransparency="true"></iframe>
144
		</div>
145
		
146
      </footer>
147
  </div>
148
  <script src="js/respond.js"></script>
149
  <script src="js/jquery.flexnav-min.js"></script>
150
  <script src="js/tabs.js"></script>
151
  <script src="js/responsiveslides.min.js"></script>
152
  <script src="js/responsive_dropdown.js"></script>
153
  <script src="js/responsive_slideshow.js"></script>
154
  <script src="js/plugins.js"></script>
155
  <script src="js/script.js"></script>
156
  <script src="js/helper.js"></script>
157
  
158
  
159
  <script type="text/javascript">
160
        var _gaq = _gaq || [];
161
        _gaq.push(['_setAccount', 'UA-36963537-1']);
162
        _gaq.push(['_trackPageview']);
163
164
        (function() {
165
          var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
166
          ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
167
          var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
168
        })();
169
    </script>
170
</body>
171
</html>