[Cstrike-Comunity]->We Are Crowing Every Day!!!
 
AcasaPortalCalendarFAQCautareMembriGrupuriInregistrareConectare
banner3 EvolutionGaming!

Distribuiţi | 
 

 Ceas personalizat

Vezi subiectul anterior Vezi subiectul urmator In jos 
AutorMesaj
ca17ta
G.Moderator
G.Moderator
avatar

Mesaje : 37
Puncte : 54
Reputatie : 1
Data de inscriere : 10/06/2011

MesajSubiect: Ceas personalizat   Sam Aug 06, 2011 7:03 pm

Bun, acum hai sa incepem.

Pentru inceput ai nevoie de 13 imagini,
aceste imagini sunt numerele de la ceas, cele doua puncte ce despart
orele de minute si minutele de secunde si imaginile ce indica ameaza si
dupa-ameaza. Nu conteaza cum le denumesti, dar ca-sa nu te incurci ar fi
bine sa le denumesti in felul urator:

Scuzati-mi tabelu dar nu prea aveam chef de ps...


Poti
face orice fel de numere vrei tu, orice marime, orice model, orice font
insa sa fie format png cu background transparent si sa numesti
imaginile t0, t1, t2 etc...

Acum facem un document TEXT nou ... si adaugam urmatorul cod afisat jos:
Cod:
var imageclock=new Object()
//Enter path to clock digit images here, in order of 0-9, then "am/pm", then colon image:
imageclock.digits=["t0.png",
"t1.png", "t2.png", "t3.png", "t4.png", "t5.png", "t6.png", "t7.png",
"t8.png", "t9.png", "am.png", "pm.png", "olon.png"]
imageclock.instances=0
var preloadimages=[]
for (var i=0; i<imageclock.digits.length; i++){ //preload images
preloadimages[i]=new Image()
preloadimages[i].src=imageclock.digits[i]
}

imageclock.imageHTML=function(timestring){ //return timestring (ie: 1:56:38) into string of images instead
var sections=timestring.split(":")
if (sections[0]=="0") //If hour field is 0 (aka 12 AM)
sections[0]="12"
else if (sections[0]>=13)
sections[0]=sections[0]-12+""
for (var i=0; i<sections.length; i++){
if (sections[i].length==1)
sections[i]='<img src="'+imageclock.digits[0]+'" />'+'<img src="'+imageclock.digits[parseInt(sections[i])]+'" />'
else
sections[i]='<img
src="'+imageclock.digits[parseInt(sections[i].charAt(0))]+'"
/>'+'<img
src="'+imageclock.digits[parseInt(sections[i].charAt(1))]+'" />'
}
return
sections[0]+'<img src="'+imageclock.digits[12]+'"
/>'+sections[1]+'<img src="'+imageclock.digits[12]+'"
/>'+sections[2]
}

imageclock.display=function(){
var clockinstance=this
this.spanid="clockspan"+(imageclock.instances++)
document.write('<span id="'+this.spanid+'"></span>')
this.update()
setInterval(function(){clockinstance.update()}, 1000)
}

imageclock.display.prototype.update=function(){
var dateobj=new Date()
var currenttime=dateobj.getHours()+":"+dateobj.getMinutes()+":"+dateobj.getSeconds() //create time string
var
currenttimeHTML=imageclock.imageHTML(currenttime)+'<img
src="'+((dateobj.getHours()>=12)? imageclock.digits[11] :
imageclock.digits[10])+'" />'
document.getElementById(this.spanid).innerHTML=currenttimeHTML

}


il salvam cu extensa .js ! nume.js..

Acum facem un alt document text pentru a mai salva inca ceva..
In document bagam acest cod :
Cod:
new imageclock.display()

salvam tot cu extensa JS !!! nume.js

asa acum avem 2 fisiere .js...
Le uploadam pe host sau aici http://pmsc.free.fr/gb/J/upload.php
Dupa ce ai uploadat documentele trece link-ul in aceste cod-uri:

Cod:
<script type='text/javascript' src='Link catre documentul cu codul lung'></script>

si
Cod:
<script type='text/javascript' src='Link catre documentul cu codul scurt'></script>

Le pui unde doresti tu sa fie afisat ceasul.


Daca doresti o imagine de fundal sa pui la ceas, aceste 2 coduri trebuie puse intr-un tabel
Exemplu:
Cod:
<table border="0" align="center">
<tr>
<td background="LINK Imagine de fundal" align='center">
cele 2 coduri aici
</td>
</tr>
</table>


VEZI DEMO
DESCARCA IMAGINIILE
Sus In jos
Vezi profilul utilizatorului
 
Ceas personalizat
Vezi subiectul anterior Vezi subiectul urmator Sus 
Pagina 1 din 1

Permisiunile acestui forum:Nu puteti raspunde la subiectele acestui forum
We Are Crowing Every Day! -> Suntem in crestere in fiecare zi! :: Cstrike # Tutoriale Web :: ..:: Tutoriale JS ::..-
Mergi direct la:  
Creati un forum | © phpBB | Forum gratuit de suport | Contact | Semnaleaza un abuz | Poti avea un blog