1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
|
<html>
<head>
<title>Live Tile</title>
<style>
body { margin:0;padding:0;font-family:Segoe UI;}
.metroBig { font-size:36px; line-height:36px; }
.live-tile, .list-tile
{
color:#fff;
float:left;
height: 125px;
margin:0px;
overflow:hidden;
position:relative;
width: 125px;
}
.live-tile img, .list-tile img { border:none; }
.live-tile.me>.slide-back>a.metroBig { position:absolute; left:0; bottom:0; padding: 0 0 12px 12px; text-decoration:none; }
.live-tile a:link, .live-tile a:visited { color:#fff; text-decoration:underline; }
.live-tile a:hover { color:#fff; text-decoration:none; }
.live-tile p { font-size:13px; line-height: 16px; padding:10px; }
.live-tile .tile-title, .list-tile .tile-title { position:absolute; bottom:0px; font-size:12px; left:0px; width:100%; padding:0 0 ; z-index:30; }
.live-tile a.tile-title, .list-tile a.tile-title { text-decoration:none; }
.live-tile.me>.metroBig { padding-top:45px; }
.live-tile,.live-tile>div,.list-tile>div
{ /* ensure elements on backside don't continue to take focus */
backface-visibility:hidden;
-webkit-backface-visibility:hidden;
-moz-backface-visibility:hidden;
}
.live-tile>div,.list-tile>div
{
top:0px;
left:0px;
margin:0px;
height:100%;
width:100%;
position:absolute;
z-index:20;
}
.list-tile>div
{
position:relative;
}
img.full , a.full
{
display:block;
margin:0px;
height:100%;
width:100%;
}
.live-tile>.slide-back,.live-tile
{
position:absolute;
z-index:10;
}
</style>
</head>
<body style="float: left; position: absolute; top: 0; left: 0;">
<div class="tiles">
<div style="background-color: #1ba0e1;" class="live-tile me" data-stops="50%,100%,0px" data-stack="true" data-delay="3000">
<div><a href="http://dakoder.koding.com" target="_parent"><img src="DaKoder.png" alt="DaKoder" class="full" /></a></div>
<div><a class="metroBig" href="http://dakoder.koding.com" target="_parent"><font size="5px" face="Segoe UI">DaKoder</font></a></div>
</div></div></body>
<script src="jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="MetroJs.lt.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".live-tile,.flip-list").liveTile();
});
</script>
</html>
|
