begin process at 2012 02 12 18:56:35
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > 

Code

 > 

Effets

 > IMAGES ÉCLATÉES QUI SE REGROUPENT

IMAGES ÉCLATÉES QUI SE REGROUPENT


 Information sur la source

Note :
10 / 10 - par 3 personnes
10,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Effets Niveau :Initié Date de création :12/11/2003 Vu :9 184
Auteur : francktfr

Ecrire un message privé
Site perso
Commentaire sur cette source (1)
Ajouter un commentaire et/ou une note

 Description

Cliquez pour voir la capture en taille normale
Amusez vous bien :o)

Source

  • <HTML>
  • <HEAD>
  • <TITLE></TITLE>
  • <SCRIPT>
  • // 12-11-2003 - francktfr@systeme-d.net
  • // écrit pour http://www.systeme-d.net
  • var imgs = new Array()
  • var ImagesDone = 0
  • var DivX = 6 // Nombre de divisions en longueur
  • var DivY = 2 // Nombre de divisions en hauteur
  • var MoveSteps = 150 // Nombre d'étapes pour le déplacement
  • var Interval = 2000 // Temps entre deux images (ms)
  • AddImage("http://winomail.com/images/ban1.gif")
  • AddImage("http://www.milimel.com/site/bannieres/ban_2.gif")
  • function AddImage(Source){
  • var img = new Image()
  • img.src = Source
  • imgs.push(img)
  • }
  • function Separate(Index){
  • var h = imgs[Index].height / DivY
  • var w = imgs[Index].width / DivX
  • var MinX = -w*2
  • var MaxX = document.body.offsetWidth + 2*w
  • var MinY = -h*2
  • var MaxY = document.body.offsetHeight + 2*h
  • Dones = new Array()
  • for (y = 0; y < DivY; y++){
  • for (x = 0; x < DivX; x++){
  • var i = 0
  • var j = 0
  • var doit = true
  • var small = new Image()
  • small.src = imgs[Index].src
  • small.id = "SmallImg"
  • while (doit){
  • i = ((MaxX - MinX) * Math.random() + MinX)
  • j = ((MaxY - MinY) * Math.random() + MinY)
  • if (((i+w)<0 || i>document.body.offsetWidth) || ( (j+h)<0 || j>document.body.offsetHeight)) {doit=false}
  • }
  • small.style.cssText = "position: absolute; top: "+(j + (((DivY-y)*h)- small.height - Container.offsetTop))+";left:"+(i + (((DivX-x)*w)- small.width - Container.offsetLeft))+"; clip: rect(" + (y*h) + ", " + ((x+1)*w) + ", " + ((y+1)*h) + ", " + (x*w) + ")"
  • Container.insertAdjacentElement("afterBegin", small)
  • }
  • }
  • ImagesDone = 0
  • //WaitImages(Index)
  • for (i=0; i<SmallImg.length; i++){setTimeout("Regroup("+Index+","+i+",1)",50)}
  • }
  • function Clear(Index){
  • if (typeof(BigImg) != "undefined"){Container.removeChild(BigImg)}
  • SmallImg[0].style.zIndex = 10
  • SmallImg[0].style.cssText = ""
  • SmallImg[0].id = "BigImg"
  • var nb = SmallImg.length
  • for (i=0; i<nb; i++){if (typeof(SmallImg[0]) != "undefined"){Container.removeChild(SmallImg[0])}}
  • BigImg.style.zIndex = -1
  • Index >= (imgs.length-1) ? Index=0 : Index ++
  • setTimeout("Separate("+Index+")",Interval)
  • }
  • function Regroup(id, nb, Step){
  • var img = SmallImg[nb]
  • var sx = Math.round(img.offsetLeft/(MoveSteps-Step))
  • var sy = Math.round(img.offsetTop/(MoveSteps-Step))
  • if (Step >= MoveSteps)
  • {
  • img.left = 0
  • img.top = 0
  • ImagesDone++
  • if (ImagesDone == (DivX*DivY)){setTimeout("Clear("+id+")",10)}
  • return(0)
  • }
  • else
  • {
  • Step ++
  • img.style.top = img.offsetTop - sy
  • img.style.left = img.offsetLeft - sx
  • setTimeout("Regroup("+id+","+nb+","+Step+")",10)
  • }
  • }
  • </SCRIPT>
  • </HEAD>
  • <BODY SCROLL="no" onload="Separate(0)">
  • <DIV ID=Container STYLE="border: 1 solid black; position: absolute; top: 50; left: 150; width: 470; height: 62;"></DIV>
  • </BODY>
  • </HTML> 
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT>
// 12-11-2003 - francktfr@systeme-d.net
// écrit pour http://www.systeme-d.net
var imgs = new Array()
var ImagesDone = 0
var DivX = 6	//	Nombre de divisions en longueur
var DivY = 2	//	Nombre de divisions en hauteur
var MoveSteps = 150	//	Nombre d'étapes pour le déplacement
var Interval = 2000		//	Temps entre deux images (ms)
AddImage("http://winomail.com/images/ban1.gif")
AddImage("http://www.milimel.com/site/bannieres/ban_2.gif")
function AddImage(Source){
	var img = new Image()
	img.src = Source
	imgs.push(img)
}
function Separate(Index){
	var h = imgs[Index].height / DivY
	var w = imgs[Index].width / DivX
	var MinX = -w*2
	var MaxX = document.body.offsetWidth + 2*w
	var MinY = -h*2
	var MaxY = document.body.offsetHeight + 2*h
	Dones = new Array()
	for (y = 0; y < DivY; y++){
		for (x = 0; x < DivX; x++){
			var i = 0
			var j = 0
			var doit = true
			var small = new Image()
			small.src = imgs[Index].src
			small.id = "SmallImg"
			while (doit){
				i = ((MaxX - MinX) * Math.random() + MinX)
				j = ((MaxY - MinY) * Math.random() + MinY)
				if (((i+w)<0 || i>document.body.offsetWidth) || ( (j+h)<0  || j>document.body.offsetHeight)) {doit=false}
			}
			small.style.cssText = "position: absolute; top: "+(j + (((DivY-y)*h)- small.height - Container.offsetTop))+";left:"+(i + (((DivX-x)*w)- small.width - Container.offsetLeft))+"; clip:  rect(" + (y*h) + ", " + ((x+1)*w) + ", " + ((y+1)*h) + ", " + (x*w) + ")"
			Container.insertAdjacentElement("afterBegin", small)
		}
	}
	ImagesDone = 0
	//WaitImages(Index)
	for (i=0; i<SmallImg.length; i++){setTimeout("Regroup("+Index+","+i+",1)",50)}
}
function Clear(Index){
	if (typeof(BigImg) != "undefined"){Container.removeChild(BigImg)}
	SmallImg[0].style.zIndex = 10
	SmallImg[0].style.cssText = ""
	SmallImg[0].id = "BigImg"
	var nb = SmallImg.length
	for (i=0; i<nb; i++){if (typeof(SmallImg[0]) != "undefined"){Container.removeChild(SmallImg[0])}}
	BigImg.style.zIndex = -1
	Index >= (imgs.length-1) ?  Index=0 : Index ++
	setTimeout("Separate("+Index+")",Interval)
}
function Regroup(id, nb, Step){
	var img = SmallImg[nb]
	var sx = Math.round(img.offsetLeft/(MoveSteps-Step))
	var sy = Math.round(img.offsetTop/(MoveSteps-Step))
	if (Step >= MoveSteps)
		{
			img.left = 0
			img.top = 0
			ImagesDone++
			if (ImagesDone == (DivX*DivY)){setTimeout("Clear("+id+")",10)}
			return(0)
		}
		else
		{	
			Step ++
			img.style.top = img.offsetTop - sy
			img.style.left = img.offsetLeft - sx
			setTimeout("Regroup("+id+","+nb+","+Step+")",10)
		}
}
</SCRIPT>
</HEAD>
<BODY SCROLL="no" onload="Separate(0)">
<DIV ID=Container STYLE="border: 1 solid black; position: absolute; top: 50; left: 150; width: 470; height: 62;"></DIV>
</BODY>
</HTML>



 Sources du même auteur

Source avec une capture CHOIX DE DATES ET DE PERIODE
HORLOGE DIGITALE , SI SI
Source avec une capture TEXT COLORISÉ AVEC LE POURCENTAGE
Source avec une capture MENU AVEC EFFET DE DÉGRADÉ
ANNONCE LETTRE PAR LETTRE
Toutes les sources de francktfr

 Sources de la même categorie

Source avec Zip Source avec une capture SHOWMAPAREA par phidelum
DHTML IE FILTRE DÉGRADÉ (OUTIL HTML POUR DÉVELOPPEUR) par internetdev
Source avec Zip ANIMATION DU TEXTE par brennal
Source avec Zip Source avec une capture EFFET RAYONS DU SOLEIL par tefa24600
TAILLE DE TEXTE EN FONCTION DE LA RÉSOLUTION par tefa24600
Toutes les sources de la catégorie Effets

Commentaires et avis

Commentaire de lukacs le 12/11/2003 13:25:07

Sympa :)

Le seul regret est son usage CPU à mon gout un peu lourd.
Mais bravo quand même :)

 Ajouter un commentaire

Nos sponsors


Sondage...

CalendriCode

Février 2012
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
272829    

Consulter la suite du CalendriCode
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 1,279 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)