ABA


"רוצים שעון כמו אצל רוטר למטה"
גירסת הדפסה        
קבוצות דיון בניית אתרים נושא #12934 מנהל    סגן המנהל    מפקח   Winner    צל"ש   מומחה  
אשכול מספר 12934
פנחס

   22:42   19.09.07   
אל הפורום  
  רוצים שעון כמו אצל רוטר למטה  
 
   <a href="http://rotter.net">
<html>
<head><title>Clock</title>
<STYLE TYPE="TEXT/CSS">
<!--
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:active {text-decoration: none;}
a:hover {text-decoration: none;}
-->
</style>
<BODY STYLE="margin-top:0px" BGCOLOR="#FCF8F2" VLINK="#707070" ALINK="Black" LINK="red" rightmargin="0" leftmargin="0">
<script type="text/javascript" src="lp_settings.js"></script>
<script type="text/javascript" src="lp_utils_all_cookie.js"></script>
<script type="text/javascript" src="clocks_colors.js"></script>
<!-->
<script type="text/javascript" src="lp_excanvas.js"></script>
<!-->

<script type="text/javascript">
var _gadgetID=27;
var clock12trbyopntzug;

function Clock() {

var MONTH_NAMES=new Array('1','2','3','4','5','6','7','8','9','10','11','12');
var DAY_NAMES=new Array('ראשון','שני','שלישי','רביעי','חמישי','ששי','שבת');
var addZero = function(x) {return(x<0||x>9?"":"0")+x}

var canvas, ctx, backEl, dayEl, dateEl, secondsEl;

var colorIndex = 0;
var prevHour = -1;
var waitRound = 0;
var settings = new lpSettings("lp_big_clock_settings", lpSettings.COOKIE_URL, lpSettings.COOKIE_EXPIRATION);

this.init = function() {

secondsEl = document.getElementById("seconds1");
backEl = document.getElementById("back1");
dayEl = document.getElementById("day1");
dateEl = document.getElementById("date1");
canvas = document.getElementById("cv");
ctx = canvas.getContext("2d");

this.setLayout();
this.loadSettings();
this.setInterface();
setInterval('clock12trbyopntzug.repaintClock();',1000);
onresize=function(){clock12trbyopntzug.setLayout()};

setTimeout("clock12trbyopntzug.saveSettings();",1000);//123123 remove when delete old cookie
}

this.saveSettings = function() {

var exp = 730*24*60*60*1000;
var setStr = ""+colorIndex;

lp_set_cookie( 'lp_clock_settings', setStr, exp);
settings.setParam("skin_id",setStr);
}

this.loadSettings = function() {

var setStr = lp_get_cookie('lp_clock_settings');
try {
colorIndex = parseInt(setStr,10);
if (!colorIndex)
colorIndex = 0;
} catch (e) {}
}

this.setSkin = function(skinID) {

colorIndex = skinID;
this.saveSettings();
this.setInterface();
}

this.setInterface = function() {

backEl.src = "5_clock.gif";
secondsEl.src = "1_seconds.gif";
waitRound = 0;

dayEl.style.color = clocksColors;
dateEl.style.color = clocksColors;
this.setDate();
}

this.changeColor = function(dir) {

if (dir == 1) {
colorIndex = (colorIndex + 1) % numOfDesigns;
}
else {
colorIndex = (colorIndex + numOfDesigns -1) % numOfDesigns;
}
this.saveSettings();
this.setInterface();
}

this.setDate = function() {

var now = new Date();

dayEl.innerHTML = DAY_NAMES;
dateEl.innerHTML = addZero(now.getDate()) + "." + MONTH_NAMES + ".07" ;

}

this.draw = function() {


ctx.save();

var now = new Date();
var sec = now.getSeconds();
var min = now.getMinutes();
var hr = now.getHours();

if (hr<=12) {
hr = (hr-12);
}

//set the date
if (hr != prevHour) {
this.setDate();
prevHour = hr;
}


ctx.strokeStyle = clocksColors;
ctx.fillStyle = clocksColors;
ctx.rotate(-(Math.PI/2));

// write Hours
ctx.save();
ctx.rotate(hr*(Math.PI/6) + (Math.PI/360)*min + (Math.PI/21600)*sec);
ctx.lineWidth = 5;
ctx.beginPath();
ctx.moveTo(11,0);
ctx.lineTo(50,0);
ctx.stroke();
ctx.restore();

// write Minutes
ctx.save();
ctx.rotate( (Math.PI/30)*min + (Math.PI/1800)*sec);
ctx.lineWidth = 4;
ctx.beginPath();
ctx.moveTo(11,0);
ctx.lineTo(75,0);
ctx.stroke();
ctx.restore();

// Write seconds
ctx.save();
ctx.rotate(sec * Math.PI/30);
ctx.beginPath();
if (lp_isIE()) {
if (waitRound > 2) {
ctx.drawImage(secondsEl,77,0);
}
else {
waitRound++;
}
}
else {
var radgrad = ctx.createRadialGradient(88,0,12,88,0,.5);
radgrad.addColorStop(0.2, clocksColors);
radgrad.addColorStop(1, '#ffffff');
ctx.fillStyle = radgrad;
ctx.arc(85, 0, 6, 0, Math.PI*2, false);
//ctx.arc(0, 0, 6, 0, Math.PI*2, false);
ctx.fill();
}


ctx.restore();
ctx.restore();
}

this.repaintClock = function() {

ctx.save();
ctx.clearRect(0,0,200,196);
ctx.translate(101,97);
clock12trbyopntzug.draw();
ctx.restore();
}

this.setLayout = function() {

var t = lp_getAbsoluteTop("anchor1");
var l = lp_getAbsoluteLeft("anchor1");

if (lp_isSafari())
t = t-150;

backEl.style.visibility = "visible";

dayEl.style.top = t+116;
dayEl.style.left = l+33;
dayEl.style.visibility = "visible";

dateEl.style.top = t+116;
dateEl.style.left = l+134;
dateEl.style.visibility = "visible";

canvas.style.top = t+24;
canvas.style.left = l+9;
canvas.style.visibility = "visible";
}
}

function loadClock() {

var c = document.getElementById("cv");
if (c.getContext) {

clock12trbyopntzug = new Clock();
clock12trbyopntzug.init();
} else {
setTimeout('loadClock();',200);
}
}

</script>

</head>
<body>

<table border="0" cellpadding="0" width="220" height="263" cellspacing="0">
<tr height="230" style="height:230px;">
<td id="anchor1" width="220" height="230" colspan="2"><a href="" target = "_new">
<img id="seconds1" border="0" style="border-style:none; visibility:hidden; position:absolute; top:0px; left:0px;" width="12" height="12" />
</a>
<a target="_new">
<img id="back1" border="0" style="border-style:none; visibility:hidden;" width="220" height="230" /></a><a href="" target = "_new">
<div style="border-style:none; text-align: center; visibility:hidden; font-family: Arial,Verdana, sans-serif; font-weight: bold; font-size:12px; width:54px; overflow:hidden; position:absolute; top:0px; left:0px;" id="day1"> </div>
<div align DIR="RTL" style="border-style:none; text-align: center; visibility:hidden; font-family: Arial,Verdana, sans-serif; font-weight: bold; font-size:12px; width:54px; overflow:hidden; position:absolute; top:0px; left:0px;" id="date1"> </div>
<canvas id="cv" style="border-style:none; visibility:hidden; position:absolute; top:0px; left:0px;" width="200" height="196"></canvas></a>
</td>
</tr>
<tr style="height:10px;">
<td width="220" colspan="2" height="10">
<table border="0" height="10" cellpadding="0" width="220" cellspacing="0">
<tr>
<td align="right" width="74" height="10" class="style1"> </td>
<td align="center" width="73" height="10" class="style1">

</td>
<td align="left" width="73" height="10" class="style1"> </td>
</tr>
</table>
</td>
</tr>
<tr height="11" style="height:11px;">
<td colspan="2" height="11" valign="bottom">

</td>
</tr>
<tr style="height:14px;">
<td width="220" colspan="2">
<table width="220" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="166" height="14" id="tdad" style="width:166px; height:14px; font-size:11px; font-family: Verdana, Arial, sans-serif; color:#006CB3;" >
<script type=text/javascript>
var marq1 = new LPMarquee();
marq1.create(document.getElementById("tdad"),"Ad1",166,14,"");
</script>
</td>
<td align="right" valign="top" width="54" height="14"></td>
</tr>
</table>
</td>
</tr>
</table>

<!-- Ad Server - hidden block -->
<div id="testHidden" style="visibility:hidden; position:absolute; top:-400px;">

</div>

<!-- init module -->
<script type="text/javascript" >
onload=function(){
loadClock();
document.getElementById("Ad1").innerHTML = document.getElementById("testHidden").innerHTML;
}

</script>

<!-- google analytics -->
<script src="urchin.js" type="text/javascript"></script>

</body>
</html></a>


                                שתף        
מכתב זה והנלווה אליו, על אחריות ועל דעת הכותב בלבד

  האשכול     מחבר     תאריך כתיבה     מספר  
  פנחס עדיף שתכניס את בתוך סוגריים... Rayman  19.09.07 23:10 1
  ממש לא, משהו מכוער פחד, אבל תודה! HoDoR 19.09.07 23:52 2
  סבה עכשיו למדתי איך עושים את זה תודה רימן פנחס 20.09.07 00:14 3

       
Rayman  לחץ כאן להצגת דירוג המשתמש
חבר מתאריך 2.7.02
61775 הודעות, 6 פידבק
   23:10   19.09.07   
אל הפורום  
  1. פנחס עדיף שתכניס את בתוך סוגריים...  
בתגובה להודעה מספר 0
 
   סוגריים כאלה נשמה:
[code]
[/code]
ואז זה יראה ככה:

<a href="http://rotter.net">
<html>
<head><title>Clock</title>
<STYLE TYPE="TEXT/CSS">
<!--
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:active {text-decoration: none;}
a:hover {text-decoration: none;}
-->
</style>
<BODY STYLE="margin-top:0px" BGCOLOR="#FCF8F2" VLINK="#707070" ALINK="Black" LINK="red" rightmargin="0" leftmargin="0">
<script type="text/javascript" src="lp_settings.js"></script>
<script type="text/javascript" src="lp_utils_all_cookie.js"></script>
<script type="text/javascript" src="clocks_colors.js"></script>
<!-->
<script type="text/javascript" src="lp_excanvas.js"></script>
<!-->
<script type="text/javascript">
var _gadgetID=27;
var clock12trbyopntzug;

function Clock() {

var MONTH_NAMES=new Array('1','2','3','4','5','6','7','8','9','10','11','12');
var DAY_NAMES=new Array('ראשון','שני','שלישי','רביעי','חמישי','ששי','שבת');
var addZero = function(x) {return(x<0||x>9?"":"0")+x}

var canvas, ctx, backEl, dayEl, dateEl, secondsEl;

var colorIndex = 0;
var prevHour = -1;
var waitRound = 0;
var settings = new lpSettings("lp_big_clock_settings", lpSettings.COOKIE_URL, lpSettings.COOKIE_EXPIRATION);

this.init = function() {

secondsEl = document.getElementById("seconds1");
backEl = document.getElementById("back1");
dayEl = document.getElementById("day1");
dateEl = document.getElementById("date1");
canvas = document.getElementById("cv");
ctx = canvas.getContext("2d");

this.setLayout();
this.loadSettings();
this.setInterface();
setInterval('clock12trbyopntzug.repaintClock();',1000);
onresize=function(){clock12trbyopntzug.setLayout()};

setTimeout("clock12trbyopntzug.saveSettings();",1000);//123123 remove when delete old cookie
}

this.saveSettings = function() {

var exp = 730*24*60*60*1000;
var setStr = ""+colorIndex;

lp_set_cookie( 'lp_clock_settings', setStr, exp);
settings.setParam("skin_id",setStr);
}

this.loadSettings = function() {

var setStr = lp_get_cookie('lp_clock_settings');
try {
colorIndex = parseInt(setStr,10);
if (!colorIndex)
colorIndex = 0;
} catch (e) {}
}

this.setSkin = function(skinID) {

colorIndex = skinID;
this.saveSettings();
this.setInterface();
}

this.setInterface = function() {

backEl.src = "5_clock.gif";
secondsEl.src = "1_seconds.gif";
waitRound = 0;

dayEl.style.color = clocksColors;
dateEl.style.color = clocksColors;
this.setDate();
}

this.changeColor = function(dir) {

if (dir == 1) {
colorIndex = (colorIndex + 1) % numOfDesigns;
}
else {
colorIndex = (colorIndex + numOfDesigns -1) % numOfDesigns;
}
this.saveSettings();
this.setInterface();
}

this.setDate = function() {

var now = new Date();

dayEl.innerHTML = DAY_NAMES;
dateEl.innerHTML = addZero(now.getDate()) + "." + MONTH_NAMES + ".07" ;

}

this.draw = function() {


ctx.save();

var now = new Date();
var sec = now.getSeconds();
var min = now.getMinutes();
var hr = now.getHours();

if (hr<=12) {
hr = (hr-12);
}

//set the date
if (hr != prevHour) {
this.setDate();
prevHour = hr;
}


ctx.strokeStyle = clocksColors;
ctx.fillStyle = clocksColors;
ctx.rotate(-(Math.PI/2));

// write Hours
ctx.save();
ctx.rotate(hr*(Math.PI/6) + (Math.PI/360)*min + (Math.PI/21600)*sec);
ctx.lineWidth = 5;
ctx.beginPath();
ctx.moveTo(11,0);
ctx.lineTo(50,0);
ctx.stroke();
ctx.restore();

// write Minutes
ctx.save();
ctx.rotate( (Math.PI/30)*min + (Math.PI/1800)*sec);
ctx.lineWidth = 4;
ctx.beginPath();
ctx.moveTo(11,0);
ctx.lineTo(75,0);
ctx.stroke();
ctx.restore();

// Write seconds
ctx.save();
ctx.rotate(sec * Math.PI/30);
ctx.beginPath();
if (lp_isIE()) {
if (waitRound > 2) {
ctx.drawImage(secondsEl,77,0);
}
else {
waitRound++;
}
}
else {
var radgrad = ctx.createRadialGradient(88,0,12,88,0,.5);
radgrad.addColorStop(0.2, clocksColors);
radgrad.addColorStop(1, '#ffffff');
ctx.fillStyle = radgrad;
ctx.arc(85, 0, 6, 0, Math.PI*2, false);
//ctx.arc(0, 0, 6, 0, Math.PI*2, false);
ctx.fill();
}


ctx.restore();
ctx.restore();
}

this.repaintClock = function() {

ctx.save();
ctx.clearRect(0,0,200,196);
ctx.translate(101,97);
clock12trbyopntzug.draw();
ctx.restore();
}

this.setLayout = function() {

var t = lp_getAbsoluteTop("anchor1");
var l = lp_getAbsoluteLeft("anchor1");

if (lp_isSafari())
t = t-150;

backEl.style.visibility = "visible";

dayEl.style.top = t+116;
dayEl.style.left = l+33;
dayEl.style.visibility = "visible";

dateEl.style.top = t+116;
dateEl.style.left = l+134;
dateEl.style.visibility = "visible";

canvas.style.top = t+24;
canvas.style.left = l+9;
canvas.style.visibility = "visible";
}
}

function loadClock() {

var c = document.getElementById("cv");
if (c.getContext) {

clock12trbyopntzug = new Clock();
clock12trbyopntzug.init();
} else {
setTimeout('loadClock();',200);
}
}

</script>

</head>
<body>

<table border="0" cellpadding="0" width="220" height="263" cellspacing="0">
<tr height="230" style="height:230px;">
<td id="anchor1" width="220" height="230" colspan="2"><a href="" target = "_new">
<img id="seconds1" border="0" style="border-style:none; visibility:hidden; position:absolute; top:0px; left:0px;" width="12" height="12" />
</a>
<a target="_new">
<img id="back1" border="0" style="border-style:none; visibility:hidden;" width="220" height="230" /></a><a href="" target = "_new">
<div style="border-style:none; text-align: center; visibility:hidden; font-family: Arial,Verdana, sans-serif; font-weight: bold; font-size:12px; width:54px; overflow:hidden; position:absolute; top:0px; left:0px;" id="day1"> </div>
<div align DIR="RTL" style="border-style:none; text-align: center; visibility:hidden; font-family: Arial,Verdana, sans-serif; font-weight: bold; font-size:12px; width:54px; overflow:hidden; position:absolute; top:0px; left:0px;" id="date1"> </div>
<canvas id="cv" style="border-style:none; visibility:hidden; position:absolute; top:0px; left:0px;" width="200" height="196"></canvas></a>
</td>
</tr>
<tr style="height:10px;">
<td width="220" colspan="2" height="10">
<table border="0" height="10" cellpadding="0" width="220" cellspacing="0">
<tr>
<td align="right" width="74" height="10" class="style1"> </td>
<td align="center" width="73" height="10" class="style1">

</td>
<td align="left" width="73" height="10" class="style1"> </td>
</tr>
</table>
</td>
</tr>
<tr height="11" style="height:11px;">
<td colspan="2" height="11" valign="bottom">

</td>
</tr>
<tr style="height:14px;">
<td width="220" colspan="2">
<table width="220" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="166" height="14" id="tdad" style="width:166px; height:14px; font-size:11px; font-family: Verdana, Arial, sans-serif; color:#006CB3;" >
<script type=text/javascript>
var marq1 = new LPMarquee();
marq1.create(document.getElementById("tdad"),"Ad1",166,14,"");
</script>
</td>
<td align="right" valign="top" width="54" height="14"></td>
</tr>
</table>
</td>
</tr>
</table>

<!-- Ad Server - hidden block -->
<div id="testHidden" style="visibility:hidden; position:absolute; top:-400px;">

</div>

<!-- init module -->
<script type="text/javascript" >
onload=function(){
loadClock();
document.getElementById("Ad1").innerHTML = document.getElementById("testHidden").innerHTML;
}

</script>

<!-- google analytics -->
<script src="urchin.js" type="text/javascript"></script>

</body>
</html></a>


ואז יהיה מאוד נוח לקרוא את הקוד




אני זה אני וטוב לי ככה כמו שאני

אני חושב על העתיד בשביל לחיות את ההוווה טוב יותר מהעבר...
ותגיד זמן והזמן עובר...
1995-2009


                                                         (ניהול: מחק תגובה)
מכתב זה והנלווה אליו, על אחריות ועל דעת הכותב בלבד
HoDoR

   23:52   19.09.07   
אל הפורום  
  2. ממש לא, משהו מכוער פחד, אבל תודה!  
בתגובה להודעה מספר 0
 
  


                                                         (ניהול: מחק תגובה)
מכתב זה והנלווה אליו, על אחריות ועל דעת הכותב בלבד
פנחס

   00:14   20.09.07   
אל הפורום  
  3. סבה עכשיו למדתי איך עושים את זה תודה רימן  
בתגובה להודעה מספר 0
 
  


                                                         (ניהול: מחק תגובה)
מכתב זה והנלווה אליו, על אחריות ועל דעת הכותב בלבד

תגובה מהירה  למכתב מספר: 
 
___________________________________________________________________

___________________________________________________________________
למנהלים:  נעל | תייק בארכיון | מחק | העבר לפורום אחר | מחק תגובות | עגן אשכול
       



© כל הזכויות שמורות ל-רוטר.נט בע"מ rotter.net