CodeS-SourceS est hébergé par Frontier.fr

Cliquez ici pour mettre ce site au démarrage de votre navigateur

AccueilCodesTutorielsForumsEmploiLivresConnexion

begin process at 2009 01 09 22:59:39

[TIPS] EVITER LE DOUBLE CLICK SUR UN POSTBACK par Luke77

STYLECOP ET FXCOP par Mona7170

QUESTION SQL SERVER POUR LES EXPERTS par RaptorXP

[OPEN XML] LES LIENS ET LES TWITTERS DE LA SEMAINE 05/01/2009 par neodante

[WPF] COMMENT ASSIGNER UNE RESSOURCE DYNAMIQUE DEPUIS LE CODE-BEHIND ? par Thomas LEBRUN

REPONSE : RéSOLUTION D'éCRAN par alaindu_33

RE : PROBLèME POUR CHANGER LE DOCUMENT.BGCOLOR DANS IE par scratchdesign

RE : MAITRISE D'UN COPIER/COLLER DANS UNE IFRAME par LHUZ

PROBLèME POUR CHANGER LE DOCUMENT.BGCOLOR DANS IE par scratchdesign

RE : MAITRISE D'UN COPIER/COLLER DANS UNE IFRAME par Bul3

+ de logiciels à télécharger

1 331 259 membres
683 nouveaux aujourd'hui
14 644 membres club

Trouver une ressource

Trouvez une ressource parmi 39 266 codes, 1 223 647 messages d'aide etc...

Recherche: dans [ Dernières recherches ]

Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

TEXTE EN SPIRALE SUR SOURIS

Information sur la source

Catégorie :Effets Classé sous : souris, texte, effet, spirale, suivre Niveau : Expert Date de création : 15/10/2005 Vu : 6 665

Auteur : beladel

Site perso

Ecrire un message privé

Note :

6,50 / 10

Commentaire sur cette source (14)

Ajouter un commentaire et/ou une note

Description

Ce code en javascript va vous permettre d'afficher un message en spirale autour de la souris. Intéressant!? Hein?
Peut-être pour certains.

Source

Copiez ce code et mettez le à la place de <body>...</body>.
-----------------------------------------------------------
<SCRIPT LANGUAGE="JavaScript1.2">
var msg='http://belaadel.ifrance.com';
var font='Verdana,Arial';
var size=2;
var color='#666666';
var speed=.2;
var rotation=.2;
var ns=(document.layers);
var ie=(document.all);
var msg=msg.split('');
var n=msg.length;
var a=size*15;
var currStep=0;
var ymouse=0;
var xmouse=0;
var scrll=0;
var props="<font face="+font+" size="+size+" color="+color+">";
if (ie)
window.pageYOffset=0
if (ns){
for (i=0; i < n; i++)
document.write('<layer name="nsmsg'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props+msg[i]+'</font></center></layer>');
}
if (ie){
document.write('<div id="outer" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < n; i++)
document.write('<div id="iemsg" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center;font-weight:regular;cursor:default">'+props+msg[i]+'</font></div>');
document.write('</div></div>');
}
(ns)?window.captureEvents(Event.MOUSEMOVE):0;
function Mouse(evnt){
ymouse = (ns)?evnt.pageY+20-(window.pageYOffset):event.y;
xmouse = (ns)?evnt.pageX+20:event.x-20;
}
if (ns||ie)
(ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
y=new Array();
x=new Array();
Y=new Array();
X=new Array();
for (i=0; i < n; i++){
y[i]=0;
x[i]=0;
Y[i]=0;
X[i]=0;
}
function makecircle(){
if (ie) outer.style.top=document.body.scrollTop;
currStep-=rotation;
for (i=0; i < n; i++){ // makes the circle
var d=(ns)?document.layers['nsmsg'+i]:iemsg[i].style;
d.top=y[i]+a*Math.sin((currStep+i*1)/3.8)+window.pageYOffset-15;
d.left=x[i]+a*Math.cos((currStep+i*1)/3.8)*2; // remove *2 for just a plain circle, not oval
}
}
function drag(){
scrll=(ns)?window.pageYOffset:0;
y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);
x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
for (var i=1; i < n; i++){
y[i]=Math.round( Y[i]+=(y[i-1]-Y[i])*speed);
x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);
}
makecircle();
setTimeout('drag()',10);
}
if (ns||ie)window.onload=drag;
</SCRIPT>

Copiez ce code et mettez le à la place de <body>...</body>.
-----------------------------------------------------------

<SCRIPT LANGUAGE="JavaScript1.2">
var msg='http://belaadel.ifrance.com';
var font='Verdana,Arial';
var size=2; 
var color='#666666';
var speed=.2;
var rotation=.2;
var ns=(document.layers);
var ie=(document.all);
var msg=msg.split('');
var n=msg.length;
 
var a=size*15;
var currStep=0;
var ymouse=0;
var xmouse=0;
var scrll=0;
var props="<font face="+font+" size="+size+" color="+color+">";
if (ie)
window.pageYOffset=0
	if (ns){
for (i=0; i < n; i++)
	document.write('<layer name="nsmsg'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props+msg[i]+'</font></center></layer>');
	}
if (ie){
document.write('<div id="outer" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
	for (i=0; i < n; i++)
	document.write('<div id="iemsg" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center;font-weight:regular;cursor:default">'+props+msg[i]+'</font></div>');
document.write('</div></div>');
	}
	(ns)?window.captureEvents(Event.MOUSEMOVE):0;
function Mouse(evnt){
	ymouse = (ns)?evnt.pageY+20-(window.pageYOffset):event.y; 
	xmouse = (ns)?evnt.pageX+20:event.x-20; 
}
if (ns||ie)
(ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
y=new Array();
x=new Array();
Y=new Array();
X=new Array();
for (i=0; i < n; i++){
y[i]=0;
x[i]=0;
Y[i]=0;
	X[i]=0;
}
function makecircle(){ 
if (ie) outer.style.top=document.body.scrollTop;
currStep-=rotation;
	for (i=0; i < n; i++){ // makes the circle
	var d=(ns)?document.layers['nsmsg'+i]:iemsg[i].style;
d.top=y[i]+a*Math.sin((currStep+i*1)/3.8)+window.pageYOffset-15;
d.left=x[i]+a*Math.cos((currStep+i*1)/3.8)*2; // remove *2 for just a plain circle, not oval 
}
}
function drag(){ 
	scrll=(ns)?window.pageYOffset:0;
y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);
	x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
	for (var i=1; i < n; i++){
		y[i]=Math.round( Y[i]+=(y[i-1]-Y[i])*speed);
		x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);
	}
makecircle();
	setTimeout('drag()',10);
}
if (ns||ie)window.onload=drag;
</SCRIPT>

Sources du même auteur

INTÉGRER DU SON CONTRÔLABLE

DÉSACTIVATION DU CLIC DROIT SUR LES IMAGES.

Toutes les sources de beladel

Sources de la même categorie

AFFICHE DE 1 A PLEIN DE MESSAGES DANS LA BARRE DE STATUT DU ... par kangourouxxx

DETECTION CLICK DROIT UN PEUT PARTICULIER par kangourouxxx

LISTE UL DÉFILANTE UTILISANT SCRIPT.ACULO.US par mikerob

CONFORTABLE AUTO DÉFILEMENT OU (SCROLL BAR) TOUT AUTOMATIQUE... par abdelaziz_info

DIAPO EN FONDU ENCHAINE par kazma

Toutes les sources de la catégorie Effets

Sources en rapport avec celle ci

IMAGE REGARDANT ET SUIVANT LA SOURIS par abder05

EFFET D'EXPLOSION SUR TEXTE ET/OU IMAGE par PetoleTeam

EFFET D'ONDULATION SUR TEXTE ET/OU IMAGE par PetoleTeam

EFFET DE DRAPEAU SUR TEXTE ET/OU IMAGE par PetoleTeam

UNE IMAGE QUI SUIT LA SOURIS... par gierschv

Commentaires et avis

Commentaire de algori le 15/10/2005 17:06:31

Salut,
je trouve l'effet plutôt cool. Mais c'est assez difficile à lire pour une longue chaine de caractères. Dommage...
@++

Commentaire de beladel le 16/10/2005 00:33:26

Salut Algori,
Pour que tu puisse afficher une grande chaine de caractères dont la largeur dépasse ce qui est en haut comme message, t'as 2 solutions plus ou moins identiques.
1- tu remplace la valeur 3.8 à la ligne 56 et à la ligne 57 par une valeur plus grande 4.2 par expl.
2- tu crée une valeur paramétrable: var larg=4.5; puis sur ces lignes tu remplace la valeur de 3.8 par larg et le tour est joué. Je l'ai tésté, Voila! a+

Commentaire de lamarty le 17/10/2005 09:46:49

Je le trouve trés interessant.
merci.

Commentaire de ken70 le 17/10/2005 19:21:42

L'effet est super sympa...
Merci pour ton code.
Cependant, ça ne semble marcher que pour IE?
Comment faire pour que ça passe sur les autres navigateurs, comme Mozilla, FireFox ou Netscape....? Et je n'ai pas été voir le rendu avec un navigateur Mac...
Merci d'avance, si tu as la solution.

Commentaire de ken70 le 17/10/2005 20:26:38

Ah oui, aussi : on peut gérer la vitesse de défilement du texte avec : var speed=.2; ...?
Merci @++.

Commentaire de beladel le 18/10/2005 00:07:31

Salut,
Pour la vitesse, il y en deux:
La 1ère: pour que le texte suit la souris, la variable "speed" sert à ça.
La 2ème: pour la rotation elle-même, c'est la valeur de "rotation" qui fait le boulot.
------------------------------------------------------------------
En ce qui concerne les autres navigateurs, je vais essayer de chercher la réponse, je ne l'ai pas pour l'instant, désolé.
a+.

Commentaire de ken70 le 18/10/2005 17:04:51

Ok : j'ai repéré les 2 variables, et testé aussi les autres paramètres...
Merci.
J'attends donc pour les autres navigateurs.
++.

Commentaire de beladel le 19/10/2005 00:36:20

Je vois que le code, il détécte le navigateur (IE ou NS), mais il n'affiche rien sur Netscape (Bizarre!!), je dois chercher encore la solution. A bientôt.

Commentaire de benben90d le 20/10/2005 11:01:03

merci et bravo
j'aimerai que tu m'aide a compiler des codes en java script avec des images dans l'explorateur internet je suis un amateur qui debute

Commentaire de beladel le 20/10/2005 14:31:10

salut,
Je ne sais pas comment je peux t'aider.

Commentaire de hadrien01 le 30/10/2005 21:43:56

Ce script ne marche pas sur Safari le naviguateur mac

Commentaire de Morpheusyz le 07/12/2005 10:30:05

Ne marche pas sou Firefox 1.0.7 :(

Commentaire de stfou le 11/06/2006 16:58:54

cool! très bel effet^^

Commentaire de astron35 le 01/03/2007 19:18:56

Pareil que Morpheusyz, ça ne marche pas. T'as une solution ?

Ajouter un commentaire

Discussions en rapport avec ce code source dans le forum

Afficher du texte sous le passage de la souris [ par Arnauti ] Bonjour, je voudrais avoir une image qui lorsque la souris passe dessus, l'image change et que ca affiche le texte. Jusque la pas de problème&nb Comment on fait pour développer un texte au passage de la souris [ par nessobh ] J'aimerai savoir comment on peut faire (avec ou sans 'OnMouseOver') pour faire qu'un texte se développe au passage de la souris dessus. Effet de texte [ par romain2boss ] Salut,je suis pas un fan de javascript, et je cherche de puis un bon bout de temps un script de défilement de texte qui fasse un peu comme l'intro de Texte défilant avec arrêt souris [ par Jonef ] Salut à tousJ'ai un petit prob car j'aimerais créer un page internet où il y aurait un script java qui ferait défiler un texte horizontalement et qui Texte qui change au passage de la souris [ par swiss_cheese10 ] Tcho tout le monde !Eske qqun pourrait me dire le code à insérer pour que lorsque qu'on passe la souris sur un textge, le texte change ???Merci d'aide Texte changeant de couleur lors du survol souris [ par abdonabil ] bonjour,je veux un petit script qui permetra de changer la couleur d'un texte lors du survol du pointeur , sachant que ce texte est un lien.merci d'av Enlever un focus... [ par Ang3lo ] Boujours à tous,Dans un formulaire, j'ai une fonction qui me met le focus dans le champ de texte survolé par la souris et j'aimerais pouvoir effet de fading [ par spookyz ] Bonjour je voudrais savoir si il est possible et comment faire (je suis debutant ) pour avoir un effet de fading sur la couleur de fond d'un menu et s