problème ticket sur le forum Création de sites web - 27-06-2006 19:40:28

Liste des sujets

problème ticket

Azee

Niveau 10

27 juin 2006 à 19:40:28

bonjour, bonjour.
J´ai un problème assez embetant:
je fait des tickets a gratter pour mon site, mais je n´arrive pas a ce que la zone a gratter (qui est une couleur unie par exemple #cabe99.) ne soit pas une couleur, mais une image.
voila le code:

var down= false;
var couleurGrattage = new Array(´#cabe99´);

comment faire pour que je puisse mettre une image a la place de la couleur ?

_WatzaKamikaze_

Niveau 10

27 juin 2006 à 20:41:22

heu.. ?

C´est pas le code ça :/

Azee

Niveau 10

27 juin 2006 à 21:38:52

oui mais le code entier est long :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transi
tional//EN">
<html>
<head>
<title>Ticket a grater</title>
<STYLE type="text/css">
.ticket {width:290px;height:290px;border:1px solid

black;position:relative;overflow:hidden;cursoroint
er;}
.casesTicket {position:absolute; display:block;}
</STYLE>
<script type="text/javascript">
var down= false;
// couleurGrattage liste des dégradés de couleurs
du grattages (1 couleur ou plus) avant de faire disparaître la case
var couleurGrattage = new Array(´#cabe99´);
// prix liste des prix possible a afficher dans le
ticket (1 ou plus) élément html ou texte
var prix = new Array("<img
src=´
http://img354.imageshack.us/img354/7536/vsave
zgagn7js.jpg´ border=´0´>","<img
src=´
http://img354.imageshack.us/img354/4773/vsave
zperdu6bn.jpg´ border=´0´>","<img
src=´
http://img457.imageshack.us/img457/3610/vsave
zpresqueperdut3dq.jpg´ border´0´>","<img
src=´
http://img457.imageshack.us/img457/117/vsavez
presquega2et.jpg´ border´0´>");
var largeurCase = 35; // largeur de la case a grat
er en PX
var hauteurCase = 35;// hauteur de la case a grate
r en PX
function loadTicket(div)
{
document.body.onmousedown = function(){down=true;}
document.body.onmouseup = function(){down=false;}
var leTicket = document.getElementById(div);
var nPrix = Math.floor(Math.random()*prix.length);

leTicket.innerHTML = prix[nPrix];

for(rangee=0;rangee<(leTicket.offsetHeight/hauteur
Case)+1;rangee++)

for(colonne=0;colonne<(leTicket.offsetWidth/largeu
rCase)+1;colonne++)
{
var span = document.createElement("span")
span.noCouleur = 1;
span.className = "casesTicket";
span.style.width = largeurCase+"px";
span.style.height = hauteurCase+"px";
span.style.backgroundColor = couleurGrattage[0];
span.style.top = (rangee * hauteurCase)+"px";
span.style.left =(colonne * largeurCase)+"px";
span.sonTicket = leTicket;
span.onmouseover = function(){if(!down)
return;if(this.noCouleur>=couleurGrattage.length){
this.style.display="none"};this.style.color =
couleurGrattage[this.noCouleur];this.style.backgro
undColor =
couleurGrattage[this.noCouleur];this.noCouleur++}

leTicket.appendChild(span);
}
}
</script>
</head>
<body>
<div class="ticket" id="ticket"></div>
<form action="monPrix.php" name="form">
</form>
<script type="text/javascript">
loadTicket("ticket");
</script>
</body>
</html>

_WatzaKamikaze_

Niveau 10

28 juin 2006 à 09:46:40

En gros c´est :

span.style.backgroundColor que tu dois transformé un peu partout en style.background=´url(urldufichier.jpg)´

Mais bon, j´ai la flemme de regarder plus loin... ^^

Si t´as pas de connaissance en JS, je peux faireun effoet, mais norm ce que je viens de dire suffit !

Bye !

Azee

Niveau 10

28 juin 2006 à 14:35:19

ok c´est cool de m´avoir répondu merci _WatzaKamikaze_.
je vais essayer

Azee

Niveau 10

29 juin 2006 à 17:36:07

:désolé: mais peut tume mettre le code que je doit mettre pour l´iamge, car moi je met <img src=´
http://image.jpg´>

Azee

Niveau 10

29 juin 2006 à 23:10:47

personne pourrait me le faire plz

deepblue

Niveau 16

29 juin 2006 à 23:13:25

azee...le gars qui ne lit pas les reponses

Remplace les span.style.backgroundColor par style.background=´url(urldufichier.jpg)´ (remplace aussi les ´ par des apotrophes droite, elle du chifre 4 de ton clavier)

Azee

Niveau 10

29 juin 2006 à 23:32:22

, j´avais compris, mais qd vous dites :"´url
(urldufichier.jpg)´" , je dois mettre sa :<img src
=´http: //image.jpg´> ?

deepblue

Niveau 16

29 juin 2006 à 23:36:09

Si ton est images/mon_image.jpg

tu mets : style.background=´url(images/mon_image.jpg
)´ et remplace les ´ par de vrais apostophes (celle de la touche 4 de ton clavier)

Azee

Niveau 10

29 juin 2006 à 23:55:25

d´accord merci

Azee

Niveau 10

30 juin 2006 à 00:19:21

voila ce que sa me donne:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transi
tional//EN">
<html>
<head>
<title>Ticket a grater</title>
<STYLE type="text/css">
.ticket {width:400px;height:400px;border:1px solid

black;position:relative;overflow:hidden;cursoroint
er;}
.casesTicket {position:absolute; display:block;}
</STYLE>
<script type="text/javascript">
var down= false;
// couleurGrattage liste des dégradés de couleurs
du grattages (1 couleur ou plus) avant de faire disparaître la case
var couleurGrattage = new Array(´url(htt
p://img354.imageshack.us/img354/4773/vsavezperdu6b
n.jpg")´);
// prix liste des prix possible a afficher dans le
ticket (1 ou plus) élément html ou texte
var prix = new Array("<img src=´ht
tp://img354.imageshack.us/img354/7536/vsavezgagn7j
s.jpg´ border=´0´>","<img src=´htt
p://img354.imageshack.us/img354/4773/vsavezperdu6b
n.jpg´ border=´0´>","<img src=´htt
p://img457.imageshack.us/img457/3610/vsavezpresque
perdut3dq.jpg´ border´0´>","<img src=´htt
p://img457.imageshack.us/img457/117/vsavezpresqueg
a2et.jpg´ border´0´>");
var largeurCase = 35; // largeur de la case a grat
er en PX
var hauteurCase = 35;// hauteur de la case a grate
r en PX
function loadTicket(div)
{
document.body.onmousedown = function(){down=true;}
document.body.onmouseup = function(){down=false;}
var leTicket = document.getElementById(div);
var nPrix = Math.floor(Math.random()*prix.length);

leTicket.innerHTML = prix[nPrix];

for(rangee=0;rangee<(leTicket.offsetHeight/hauteur
Case)+1;rangee++)

for(colonne=0;colonne<(leTicket.offsetWidth/largeu
rCase)+1;colonne++)
{
var span = document.createElement("span")
span.noCouleur = 1;
span.className = "casesTicket";
span.style.width = largeurCase+"px";
span.style.height = hauteurCase+"px";
style.background=
´url(
http://img354.imageshack.us/img354/4773/vsave
zperdu6bn.jpg)´;
span.style.top = (rangee * hauteurCase)+"px";
span.style.left =(colonne * largeurCase)+"px";
span.sonTicket = leTicket;
span.onmouseover = function(){if(!down)
return;if(this.noCouleur>=couleurGrattage.length){
this.style.display="none"};this.style.color =
couleurGrattage[this.noCouleur];this.style.backgro
undColor =
couleurGrattage[this.noCouleur];this.noCouleur++}

et sa marche toujours pas ...

Yoda_Software

Niveau 30

30 juin 2006 à 00:44:27

Tes images, mets les sur ton site, pas chez imageshack, car tu n´est pas certain qu´elles y restent. En plus, ça alourdit sacrément le chargement.

_WatzaKamikaze_

Niveau 10

30 juin 2006 à 09:16:09

Ouai, mais faut aller un petit peux plus loin.

function(){if(!down)

return;if(this.noCouleur>=couleurGrattage.length){

this.style.display="none"};this.style.color =

couleurGrattage[this.noCouleur];this.style.backgro

undColor =
couleurGrattage[this.noCouleur];this.noCouleur++}

:/ c´est surtout çà qui est important de changer. Et comme il est tôt j´arrive pas trop à lire ce source Je m´y repenche ce soir ;)

Azee

Niveau 10

03 juillet 2006 à 14:41:08

ok, mais qu´est-ce que je met dans :var couleurGrattage = new Array(...);

deepblue

Niveau 16

03 juillet 2006 à 15:00:06

Tu peux donner un code plus lisible stp :
http://wall.simmstein.be

Azee

Niveau 10

03 juillet 2006 à 15:12:13

http://simmstein.be/phpcode/?rub=wall&nom=5MNBXgLE&type=xhtml

deepblue

Niveau 16

03 juillet 2006 à 15:16:29

Le code n´est pas fait pour

Azee

Niveau 10

03 juillet 2006 à 16:45:53

et donc tu peut rien faire ?

deepblue

Niveau 16

03 juillet 2006 à 16:46:14

desole

Aide à l'achat Mac
Macintosh
Création de Jeux
Programmation
Création de sites web
Linux
Internet
Steam Deck
Hardware

La vidéo du moment

News jeu

173 715 spectateurs

Halo: Campaign Evolved fait de la coopération sa plus grande force

Loin de se limiter à une simple refonte graphique, Halo: Campaign Evolved reconstruit la campagne du premier Halo en accordant une place centrale à la coopération. Que ce soit pour découvrir l'aventure une première fois ou la parcourir à nouveau, le titre multiplie les options pour permettre aux joueurs de former facilement une escouade, tout en ajoutant de nouvelles mécaniques qui encouragent la rejouabilité.

Toutes les news jeu