Firef0cks der Hurensohn
This commit is contained in:
parent
d8613a0190
commit
35686be025
|
@ -4,27 +4,29 @@
|
|||
<title>f0ck me!</title>
|
||||
<link rel="icon" type="image/gif" href="./s/favicon.gif" />
|
||||
<link rel="stylesheet" type="text/css" href="./s/style.css">
|
||||
<link rel="stylesheet" type="text/css" href="//codepen.io/assets/reset/normalize.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="navbar"><a href="/">f0ck.me</a> | <a href="/how">how to</a> | <a href="/contact">Contact</a></div>
|
||||
<ul id="posts" data-last="{{ last }}">
|
||||
{% for item in items %}<li class="post"><a href="//f0ck.me/{{ item.id }}" title="{{ item.mime }}"><img class="thumb" src="//f0ck.me/t/{{ item.id }}.png" /></a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<div class="body">
|
||||
<div id="posts" data-last="{{ last }}">
|
||||
{% for item in items %}<a href="./{{ item.id }}" title="{{ item.mime }}"><img class="thumb" src="./t/{{ item.id }}.png" /></a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<script src="./s/jquery-3.1.0.min.js"></script>
|
||||
<script>
|
||||
var scrollListener = function () {
|
||||
$(window).one("scroll", function () {
|
||||
var scrollListener = () => {
|
||||
$(window).one("scroll", () => {
|
||||
if($(window).scrollTop() + 256 >= $(document).height() - $(window).height()) {
|
||||
$.ajax({
|
||||
url: './api/p/'+$('#posts').data('last'),
|
||||
dataType: 'json',
|
||||
success: function(msg) {
|
||||
success: (msg) => {
|
||||
var html = "";
|
||||
for(var i = 0; i < msg.items.length; i++)
|
||||
if(msg.items[i].id)
|
||||
html += "<li class=\"post\"><a href=\"//f0ck.me/"+msg.items[i].id+"\" title=\""+msg.items[i].mime+"\"><img class=\"thumb\" src=\"//f0ck.me/t/"+msg.items[i].id+".png\" /></a></li>\n";
|
||||
html += "<a href=\"./"+msg.items[i].id+"\" title=\""+msg.items[i].mime+"\"><img class=\"thumb\" src=\"./t/"+msg.items[i].id+".png\" /></a>\n";
|
||||
$('#posts').append(html);
|
||||
$('#posts').data('last', msg.last);
|
||||
}
|
||||
|
@ -33,7 +35,7 @@
|
|||
setTimeout(scrollListener, 200);
|
||||
});
|
||||
};
|
||||
$(document).ready(function () {
|
||||
$(document).ready(() => {
|
||||
scrollListener();
|
||||
});
|
||||
</script>
|
||||
|
|
32
s/style.css
32
s/style.css
|
@ -1,35 +1,24 @@
|
|||
html, body {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
body {
|
||||
width: 100%;
|
||||
margin: 1em auto 3em auto;
|
||||
background-color: #262626;
|
||||
color: #fff;
|
||||
font-family: Monospace;
|
||||
}
|
||||
ul#posts {
|
||||
width: calc(100% - 210px);
|
||||
margin: 0;
|
||||
margin-left: 100px;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
display: -ms-flexbox;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-flow: row wrap;
|
||||
justify-content: space-around;
|
||||
}
|
||||
li.post {
|
||||
padding: 5px;
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
margin-top: 5px;
|
||||
line-height: 128px;
|
||||
.body {
|
||||
width: 90%;
|
||||
margin: 1em auto 3em auto;
|
||||
background-color: #262626;
|
||||
color: #fff;
|
||||
font-family: Monospace;
|
||||
}
|
||||
.thumb {
|
||||
border: 0;
|
||||
margin: 0 8px 8px 0;
|
||||
float: left;
|
||||
border: 2px solid #4c4a4a;
|
||||
}
|
||||
.thumb:hover {
|
||||
|
@ -64,7 +53,6 @@ a:hover {
|
|||
}
|
||||
.navbar {
|
||||
text-align: center;
|
||||
margin-top: 7px;
|
||||
}
|
||||
.return {
|
||||
text-align: center;
|
||||
|
|
Loading…
Reference in New Issue
Block a user