-<head>
<!-- Thank you to Toby Pitman for posting this really cool article (and
javascript / css / image) explaining how to make a running analog
clock webpage. See: http://css-tricks.com/css3-clock for more info. -->
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>Analog Clock</title>
- <script type="text/javascript" src="jquery-1.2.6.min.js"></script>
- <style type="text/css">
+<head>
+<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
+<style type="text/css">
* {
margin: 0px;
padding: 0px;
line-height:0.5;
}
#clock {
- position: relative;
+ position: absolute;
+ top: 100px;
+ left: 120px;
width: 600px;
height: 600px;
margin: 20px auto 0 auto;
+ float: none;
+ // background-image: url("clockimg/smallface.gif");
list-style: none;
}
#analog {
- position: relative;
+ position: absolute;
+ top: 200px;
+ left: 750px;
width: 100%;
+ float: none;
+ }
+ #bottom {
+ position: absolute;
+ top: 750px;
}
#txt {
position: absolute;
.digit {
display: block;
}
- </style>
- <script type="text/javascript">
+</style>
+<script type="text/javascript">
$(document).ready(
function() {
$.fn.preload = function() {
var s2 = seconds % 10;
$("#s1").css({"content" : "url(" + digit_images[s1] + ")"});
$("#s2").css({"content" : "url(" + digit_images[s2] + ")"});
- }, 75);
+ }, 125);
// Rotate minute hand and set minutes.
function updateMinutes() {
$("#m2").css({"content" : "url(" + digit_images[m2] + ")"});
}
updateMinutes();
- setInterval(function(){updateMinutes();}, 1000);
+ setInterval(function(){updateMinutes();}, 3000);
// Rotate hour hand and set hours.
function updateHours() {
$("#h2").css({"content" : "url(" + digit_images[h2] + ")"});
}
updateHours();
- setInterval(function(){updateHours();}, 1000);
+ setInterval(function(){updateHours();}, 10000);
function updateDate() {
var date = new Date();
$("#mm").css({"content" : "url(" + month_images[month] + ")"});
}
updateDate();
- setInterval(function(){updateDate();}, 1000);
+ setInterval(function(){updateDate();}, 10000);
});
</script>
</head>
<body>
- <table border=0 width=100%>
- <tr>
- <td width=50%>
- <ul id="clock">
- <div id="txt">
- <table style="background-color:#999999" border>
- <td><img src="0.png" height=26 id="d1" class="digit"></td>
- <td><img src="1.png" height=26 id="d2" class="digit"></td>
- </table>
- </div>
- <li id="sec"></li>
- <li id="hour"></li>
- <li id="min"></li>
- </ul>
- </td>
- <td STYLE="vertical-align:middle">
- <li><div id="analog">
- <center>
- <table style="background-color:#999999;height:80px;" border>
- <tr>
- <td><img src="clockimg/2.png" id="h1" class="digit"></td>
- <td><img src="clockimg/3.png" id="h2" class="digit"></td>
- <td style="border: none"> </td>
- <td><img src="clockimg/4.png" id="m1" class="digit"></td>
- <td><img src="clockimg/5.png" id="m2" class="digit"></td>
- <td style="border: none"> </td>
- <td><img src="clockimg/6.png" id="s1" class="digit"></td>
- <td><img src="clockimg/7.png" id="s2" class="digit"></td>
- </tr>
- </table>
- <br>
- <table style="background-color:#999999;height:80px;" border>
- <tr>
- <td><img src="clockimg/sun.png" id="dow" class="digit"></td>
- <td style="border: none"> </td>
- <td><img src="clockimg/8.png" id="dd1" class="digit"></td>
- <td><img src="clockimg/9.png" id="dd2" class="digit"></td>
- <td style="border: none"> </td>
- <td><img src="clockimg/jan.png" id="mm" class="digit"></td>
- </tr>
- </table>
- </center>
- </div>
- </li>
- </ul>
- </td>
- </tr>
- </table>
-</body>
-</html>
+ <div style="height:775px; float:none">
+ <ul id="clock">
+ <div id="txt">
+ <table style="background-color:#999999" border>
+ <td><img src="0.png" height=26 id="d1" class="digit"></td>
+ <td><img src="1.png" height=26 id="d2" class="digit"></td>
+ </table>
+ </div>
+ <li id="sec"></li>
+ <li id="hour"></li>
+ <li id="min"></li>
+ <li><div id="analog">
+ <center>
+ <table style="background-color:#999999;height:80px;" border>
+ <tr>
+ <td><img src="clockimg/2.png" id="h1" class="digit"></td>
+ <td><img src="clockimg/3.png" id="h2" class="digit"></td>
+ <td style="border: none"> </td>
+ <td><img src="clockimg/4.png" id="m1" class="digit"></td>
+ <td><img src="clockimg/5.png" id="m2" class="digit"></td>
+ <td style="border: none"> </td>
+ <td><img src="clockimg/6.png" id="s1" class="digit"></td>
+ <td><img src="clockimg/7.png" id="s2" class="digit"></td>
+ </tr>
+ </table>
+ <br>
+ <table style="background-color:#999999;height:80px;" border>
+ <tr>
+ <td><img src="clockimg/sun.png" id="dow" class="digit"></td>
+ <td style="border: none"> </td>
+ <td><img src="clockimg/8.png" id="dd1" class="digit"></td>
+ <td><img src="clockimg/9.png" id="dd2" class="digit"></td>
+ <td style="border: none"> </td>
+ <td><img src="clockimg/jan.png" id="mm" class="digit"></td>
+ </tr>
+ </table>
+ </center>
+ </div></li>
+ </ul>
+ </div>
+<HEAD>
+ <META HTTP-EQUIV="Pragma" CONTENT="no-cache">
+ <META HTTP-EQUIV="Expires" CONTENT="-1">
+</HEAD>
<h1>Lake Wenatchee Webcams:</h1>
<hr>
<center>
<table border=0>
<tr>
<td>
-<img alt="Fish Lake" width="512" height="384" src="http://lakewenatcheeinfo.com/images/cam2/Fishlake.jpg" />
+<img alt="Dirty Face"
+ border="0"
+ width="512"
+ height="384"
+ src="https://lakewenatcheeinfo.com/wp-content/images/dirtyfacecam/Dface.jpg" />
</td>
<td>
-<img alt="Lake Wenatchee" width="512" height="384" src="http://home.comcast.net/~rmakela/jpeg/lake.jpg" />
+<img alt="State Park"
+ border="0"
+ width="512"
+ height="384"
+ src="https://biz.parks.wa.gov/webcams/LakeWen1.jpg" />
</td>
</tr>
<tr>
<td>
-<img alt="Cabin Driveway" border="0" height="392" width="512" src="http://webcam:asdfghjkl@ski.dyn.guru.org/webcam/videostream.cgi"/>
+<img alt="Cabin Driveway"
+ border="0"
+ height="392"
+ width="512"
+ src="http://10.0.0.233:8080/rirF9tp7MdjNFl2atzoEvU2BFDyWin/jpeg/WHyDnbh4sv/c3XfOJfFDn/s.jpg"
<br />
</td>
<td>
-<img alt="Midway" border="0" height="392" width="512" src="http://lakewenatcheeinfo.com/images/cam2/midwaylatest.jpg" />
+<img alt="Midway"
+ border="0"
+ height="392"
+ width="512"
+ src="https://lakewenatcheeinfo.com/wp-content/images/midwaycam/Cam4.jpg" />
</td>
</tr>
</table>