Login

vana · (Dieser Beitrag wurde zuletzt bearbeitet: 01.10.2011, 20:35 von vana.)

danke erledigt

oldster · 01.10.2011, 20:36

Zitat:<html><head>

<link rel="stylesheet" href="Private/lines.css" type="text/css" media="screen" charset="utf-8">
<script src="Private/lines.js" type="text/javascript" charset="utf-8"></script>



<style>

body {
margin: 0;
top: 0;
}

@font-face {
font-family: Default;
src: url(Default.ttf);
}

SPAN#clock
{
display: none;
font-family: Default;
font-weight: 100;
color: white;
text-shadow: 0px 0px 2px black;
font-size: 40px;
-webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(#666), to(transparent), color-stop(0.5, #666));
}
SPAN#ampm
{
display: none;
font-family: Default;
font-weight: 100;
color: red;
text-shadow: 0px 0px 1px black;
font-size: 25px;
text-transform: uppercase;
-webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(#666), to(transparent), color-stop(0.5, #666));
}
SPAN#weekday
{
display: none;
font-family: Default;
font-weight: 100;
color: white;
text-shadow: 0px 0px 1px black;
font-size: 15px;
text-transform: uppercase;
-webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(#666), to(transparent), color-stop(0.67, #666));
}
SPAN#date
{
display: none;
font-family: Default;
font-weight: 100;
color: red;
text-shadow: 0px 0px 1px black;
font-size: 19px;
-webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(#666), to(transparent), color-stop(0.67, #666));
}
SPAN#month
{
display: none;
font-family: Default;
font-weight: 100;
color: white;
text-shadow: 0px 0px 1px black;
font-size: 15px;
text-transform: uppercase;
-webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(#666), to(transparent), color-stop(0.67, #666));
}
img {
position: absolute;
top: 32px;
left: 53.5px;
width: 213px;
height: 320px;
z-index: -15;
}
img.fade-out {
-webkit-transition-property: opacity;
-webkit-transition-duration: 4s;
opacity: 0;
}
img.fade-in {
opacity: 1;
}
</style>



<script type="text/javascript">

function init ( )
{
timeDisplay = document.createTextNode ( "" );
document.getElementById("clock").appendChild ( timeDisplay );
}
function updateClock ( )
{
var currentTime = new Date ( );
var currentHours = currentTime.getHours ( );
var currentMinutes = currentTime.getMinutes ( );
var currentSeconds = currentTime.getSeconds ( );
// Pad the minutes and seconds with leading zeros, if required
currentHours = ( currentHours < 10 ? "0" : "" ) + currentHours;
currentMinutes = ( currentMinutes < 10 ? "0" : "" ) + currentMinutes;
currentSeconds = ( currentSeconds < 10 ? "0" : "" ) + currentSeconds;

/*---------------------------------------------------------------------------------------------------------------------------------12 hours to 24 hour Edit------*/

/* Remove the /* from under this line to display the 12 hours clock */ /* NEW!! */

// Choose either "AM" or "PM" as appropriate
var timeOfDay = ( currentHours < 12 ) ? "AM" : "PM";
// Convert the hours component to 12-hour format if needed
currentHours = ( currentHours > 12 ) ? currentHours - 12 : currentHours;
// Convert an hours component of "0" to "12"
currentHours = ( currentHours == 0 ) ? 12 : currentHours;

/*-----------------------------------------------------------------------------------------------------------------------------------------------*/

// Compose the string for display
var currentTimeString = currentHours + ":" + currentMinutes;

// Update the time display
document.getElementById("clock").firstChild.nodeValue = currentTimeString;
}

function init2 ( )
{
timeDisplay = document.createTextNode ( "" );
document.getElementById("ampm").appendChild ( timeDisplay );
}

function amPm ( )
{
var currentTime = new Date ( );
var currentHours = currentTime.getHours ( );

/*---------------------------------------------------------------------------------------------------------------------------------AM PM Edit------*/

/* Remove the /* from under this line to display am or pm after the 12 hours clock */ /* NEW!! */

// Choose either "AM" or "PM" as appropriate
var timeOfDay = ( currentHours < 12 ) ? "AM" : "PM";
// Convert the hours component to 12-hour format if needed
currentHours = ( currentHours > 12 ) ? currentHours - 12 : currentHours;
// Convert an hours component of "0" to "12"
currentHours = ( currentHours == 0 ) ? 12 : currentHours;
// Compose the string for display
var currentTimeString = timeOfDay;
// Update the time display
document.getElementById("ampm").firstChild.nodeValue = currentTimeString;
}
function init3 ( )
{
timeDisplay = document.createTextNode ( "" );
document.getElementById("date").appendChild ( timeDisplay );
}
function calendarDate ( )
{
var this_date_name_array = new Array("00","01","02","03","04","05","06","07","08","09","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24","25","26","27","28","29","30","31")
var this_weekday_name_array = new Array("Sunday","Monday","Tuesday","Wednesday","Thurday","Friday","Saturday")
var this_month_name_array = new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","August","September","Oct","Nov","Dec") //predefine month names

var this_date_timestamp = new Date()
var this_weekday = this_date_timestamp.getDay()
var this_date = this_date_timestamp.getDate()
var this_month = this_date_timestamp.getMonth()
var this_year = this_date_timestamp.getYear()

if (this_year < 1000)
this_year+= 1900;
if (this_year==101)
this_year=2001;

document.getElementById("weekday").firstChild.nodeValue = this_weekday_name_array[this_weekday] + " " //concat long date string
document.getElementById("date").firstChild.nodeValue = this_date_name_array[this_date] + " " //concat long date string
document.getElementById("month").firstChild.nodeValue = this_month_name_array[this_month] //concat long date string
}
// -->

</script>

</head>
<body bgcolor="Transparent" onLoad="onLoad()">

<img id="img1" class="fade-in">
<img id="img2" class="fade-out">
<script>

var interval = 6 * 5; // Seconds between change (must be > duration)
var imageDir = "./Private/Walls/"; // You can add your own images if you want to
var duration = 4; // The transition duration in seconds
// (must match -webkit-transition-duration above)
var images = [ // List of image filenames

"Wall0.jpg",
"Wall1.jpg",
"Wall2.jpg",
"Wall3.jpg",
"Wall4.jpg",
"Wall5.jpg",
"Wall6.jpg",
"Wall7.jpg",
"Wall8.jpg",
"Wall9.jpg",
"Wall10.jpg",
"Wall11.jpg",
"Wall12.jpg",
"Wall13.jpg",
"Wall14.jpg",
"Wall15.jpg",
"Wall16.jpg",
"Wall17.jpg",
"Wall18.jpg",
"Wall19.jpg",
];

//// Dont change anything below ////

var index = 0;
var imageCount = images.length;
var randomize = function(){
return Math.round(5 - 10 * Math.random());
};

var fade = function(){
img1.style.zIndex = 1;
img2.style.zIndex = 2;
img1.className = "fade-in";
img2.className = "fade-out";

index = (index + 1) % imageCount;
if(!index){
images.sort(randomize);
}
var tmp = img1;
img1 = img2;
img2 = tmp;
setTimeout(function(){img1.src = imageDir + images[index];}, duration * 1000);
setTimeout(fade, interval * 1000);
};
images.sort(randomize);
img1.src = imageDir + images[index];
fade();
</script>

<div id="linesContainerH"></div>
<div id="linesContainerV"></div>
<table style="position: absolute; top: 355px; left: 0px; width: 320px; height: 480px; z-index: 20;">
<tr align="center" valign="top" border="0" cellpadding="0">
<td height="12" valign="top" margin-left="20" >
<span id="clock"> <span id="ampm">
<script language="JavaScript">updateClock(); setInterval('updateClock()', 1000 )</script> <script language="JavaScript">amPm(); setInterval('amPm()', 1000 )</script>
</span>
</td>
</tr>
<tr></table>

<table style="position: absolute; top: 385px; left: 0px; width: 320px; height: 480px; z-index: 20;">
<tr align="center" valign="top" border="0" cellpadding="0">
<td height="12" valign="top" margin-left="20" >
<span id="weekday"> <span id="date"> <span id="month">
<script language="JavaScript">calendarDate(); setInterval('calendarDate()', 1000 )</script>
</span>
</td>
</tr>
<tr></table>

<img src="Layer.png" style="position: absolute; top: 0px; left: 0px; width: 320px; height: 480px; z-index: -20;">
<img src="Private/Walls/frame.png" style="position: absolute; top: 5px; left: 31.5px; width: 257px; height: 375px; z-index: 20;">

</body></html>

display: none; einfügen....geht schneller als alles löschen.....bewirkt das Datum und Uhrzeit nicht mehr angezeigt wird.

<div id="linesContainerH"></div>
<div id="linesContainerV"></div> löschen.

So sollte es funktionieren. Aber Datei vorher sichern. Wink

Gruß oldster

Hab nur auf die Schnelle drüber gesehen.

Login
Benutzername:
Passwort:	Passwort vergessen?
	Merken