kopia lustrzana https://github.com/bristol-seds/pico-tracker
Interactive circles on the picture thing
Richard Meadows
rodzic
b7b282128f
commit
662010ae23
|
|
@ -22,19 +22,24 @@
|
|||
ga('send', 'pageview');
|
||||
</script>
|
||||
|
||||
<!-- Google Maps -->
|
||||
{% if page.maps %}
|
||||
<!-- Google Maps -->
|
||||
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
|
||||
{% for map in page.maps %}
|
||||
<script src="{{ map.url | prepend: page.asset_path }}"></script>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
<!-- nvd3 Graphs -->
|
||||
{% if page.graphs %}
|
||||
<!-- nvd3 Graphs -->
|
||||
<script src="/lib/nvd3/d3.min.js"></script>
|
||||
<script src="/lib/nvd3/nv.d3.min.js"></script>
|
||||
{% for graph in page.graphs %}
|
||||
<script src="{{ graph.url | prepend: page.asset_path }}"></script>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
<!-- scroll thing -->
|
||||
{% if page.scroll %}
|
||||
<script src="scroll.js"></script>
|
||||
{% endif %}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,9 @@
|
|||
---
|
||||
title: ARM Cortex M0+
|
||||
tagline: Low power and things
|
||||
linkname: armcortex
|
||||
x: 51%
|
||||
y: 33%
|
||||
---
|
||||
|
||||
You’ll find this post in your `_posts` directory. Go ahead and edit it
|
||||
|
|
|
|||
|
|
@ -1,6 +1,9 @@
|
|||
---
|
||||
title: Global Positioning System Receiver
|
||||
tagline: from ublox ag.
|
||||
linkname: gps
|
||||
x: 20%
|
||||
y: 42%
|
||||
---
|
||||
|
||||
You’ll find this post in your `_posts` directory. Go ahead and edit it
|
||||
|
|
|
|||
|
|
@ -92,15 +92,6 @@ pre {
|
|||
}
|
||||
|
||||
|
||||
.fill-page > img {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
border: 0px none;
|
||||
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Old Notice
|
||||
*/
|
||||
|
|
@ -110,3 +101,46 @@ pre {
|
|||
padding-right: 10px;
|
||||
float: right
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.fill-page > img {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
border: 0px none;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* A grid of interactive circles for the top image
|
||||
*/
|
||||
.ch-grid {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
position:absolute;
|
||||
}
|
||||
.ch-grid li {
|
||||
position: absolute;
|
||||
width: 4%;
|
||||
display: block;
|
||||
}
|
||||
.ch-pad {
|
||||
height: 0;
|
||||
padding-bottom: 100%;
|
||||
}
|
||||
.ch-item {
|
||||
margin: 10%;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
background-image: url(assets/circles.svg);
|
||||
background-size: 100%;
|
||||
|
||||
transition: all 0.2s ease-out;
|
||||
}
|
||||
.ch-item:hover {
|
||||
margin: 0px;
|
||||
}
|
||||
|
|
@ -0,0 +1,76 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="64px"
|
||||
height="64px"
|
||||
id="svg2985"
|
||||
version="1.1"
|
||||
inkscape:version="0.48.4 r9939"
|
||||
sodipodi:docname="circles.svg">
|
||||
<defs
|
||||
id="defs2987" />
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="11"
|
||||
inkscape:cx="16.710894"
|
||||
inkscape:cy="33.740909"
|
||||
inkscape:current-layer="layer1"
|
||||
showgrid="true"
|
||||
inkscape:document-units="px"
|
||||
inkscape:grid-bbox="true"
|
||||
inkscape:window-width="2560"
|
||||
inkscape:window-height="1497"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1" />
|
||||
<metadata
|
||||
id="metadata2990">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
id="layer1"
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer">
|
||||
<path
|
||||
sodipodi:type="arc"
|
||||
style="fill:none;stroke:#de2f0c;stroke-width:1.53711927000000004;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:0.81102359;stroke-dasharray:none"
|
||||
id="path2993"
|
||||
sodipodi:cx="42.136364"
|
||||
sodipodi:cy="41.272728"
|
||||
sodipodi:rx="9.590909"
|
||||
sodipodi:ry="9.090909"
|
||||
d="m 51.727273,41.272728 a 9.590909,9.090909 0 1 1 -19.181818,0 9.590909,9.090909 0 1 1 19.181818,0 z"
|
||||
transform="matrix(3.0827563,0,0,3.2523079,-97.896143,-102.23162)" />
|
||||
<path
|
||||
sodipodi:type="arc"
|
||||
style="fill:none;stroke:#de2f0c;stroke-width:2.36142825999999983;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:0.81176472;stroke-dasharray:none"
|
||||
id="path2993-7"
|
||||
sodipodi:cx="42.136364"
|
||||
sodipodi:cy="41.272728"
|
||||
sodipodi:rx="9.590909"
|
||||
sodipodi:ry="9.090909"
|
||||
d="m 51.727273,41.272728 a 9.590909,9.090909 0 1 1 -19.181818,0 9.590909,9.090909 0 1 1 19.181818,0 z"
|
||||
transform="matrix(2.0363473,0,0,2.1483464,-53.804271,-56.668117)" />
|
||||
</g>
|
||||
</svg>
|
||||
|
Po Szerokość: | Wysokość: | Rozmiar: 2.6 KiB |
20
index.html
20
index.html
|
|
@ -1,9 +1,23 @@
|
|||
---
|
||||
layout: default
|
||||
asset_path: assets/
|
||||
scroll: true
|
||||
---
|
||||
|
||||
<div id="image-cover" class="fill-page">
|
||||
<div id="image-highlight" class="fill-page">
|
||||
<!-- A grid of interactive circles for the top image -->
|
||||
<ul class="ch-grid">
|
||||
{% for post in site.posts %}
|
||||
|
||||
<li style="top: {{ post.y }}; left: {{ post.x }}">
|
||||
<a href="#{{ post.linkname }}">
|
||||
<div class="ch-item"><div class="ch-pad"></div></div>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
{% endfor %}
|
||||
</ul>
|
||||
|
||||
<img src="{{ "pico-tracker-apr-2015.jpg" | prepend: page.asset_path }}">
|
||||
</div>
|
||||
|
||||
|
|
@ -19,8 +33,8 @@ asset_path: assets/
|
|||
|
||||
<hr/>
|
||||
|
||||
<h2>{{ post.title }} <small>{{post.tagline}}</small></h2>
|
||||
<p class="">{{ post.excerpt }}</p>
|
||||
<h2 id="{{ post.linkname }}">{{ post.title }} <small>{{post.tagline}}</small></h2>
|
||||
<p class="">{{ post.content }}</p>
|
||||
|
||||
|
||||
{% endfor %}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,14 @@
|
|||
$(function() {
|
||||
$('a[href*=#]:not([href=#])').click(function() {
|
||||
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
|
||||
var target = $(this.hash);
|
||||
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
|
||||
if (target.length) {
|
||||
$('html,body').animate({
|
||||
scrollTop: target.offset().top
|
||||
}, 1000);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
Ładowanie…
Reference in New Issue