position d'un calque limitée dans un tableau [résolu]

position d'un calque limitée dans un tableau [résolu] - HTML/CSS - Programmation

Marsh Posté le 27-06-2005 à 16:52:28    

Hello !
 
je dois positionner un calque (une image d'une croix) sur une image.
 
vu que la postion de l'image n'est pas fixe suivant les cirtonstances des différentes pages, je me demande s'il est possible de limiter l'espace du calque dans une zone précise comme un tableau ou sur une image.
 
comme ça, la position 0,0 est le coin supérieur gauche du tableau ou de l'image.
 
si jamais ce n'est pas possible et si vous avez une autre solution, je suis preneur !
 
Merci  :jap:


Message édité par Pizz le 28-06-2005 à 12:01:35

---------------
C'est quand on a le nez dans la tomate qu'on voit mieux la tomate !
Reply

Marsh Posté le 27-06-2005 à 16:52:28   

Reply

Marsh Posté le 27-06-2005 à 16:55:16    


Salut :)

Pizz a écrit :

je dois positionner un calque (une image d'une croix) sur une image.


Ca existe pas les calques, ni en HTML, ni en CSS. Ce que tu veux positionner, c'est une image ;)
 

Pizz a écrit :

vu que la postion de l'image n'est pas fixe suivant les cirtonstances des différentes pages, je me demande s'il est possible de limiter l'espace du calque dans une zone précise comme un tableau ou sur une image.


Faut les grouper dans un <div> par exemple :

<div>
  <img src="pouet.jpeg" alt="pouet" />
  <img src="croix.jpeg" alt="croix" />
</div>


Après : dimension fixe sur la div, positionnement (si pas absolu -> relatif), puis position absolue sur l'image de croix, et voilàààà !

Reply

Marsh Posté le 27-06-2005 à 16:56:18    

FlorentG a écrit :

Salut :)
 
Ca existe pas les calques, ni en HTML, ni en CSS. Ce que tu veux positionner, c'est une image ;)
 
 
Faut les grouper dans un <div> par exemple :

<div>
  <img src="pouet.jpeg" alt="pouet" />
  <img src="croix.jpeg" alt="croix" />
</div>


Après : dimension fixe sur la div, positionnement (si pas absolu -> relatif), puis position absolue sur l'image de croix, et voilàààà !


On peut aussi mettre l'image en background et la croix par dessus [:freekill]


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 27-06-2005 à 16:56:39    

Ouaip, ça dépend du cas... Mais manque de description, hein ;)

Reply

Marsh Posté le 27-06-2005 à 22:08:33    

FlorentG a écrit :


Ca existe pas les calques, ni en HTML, ni en CSS. Ce que tu veux positionner, c'est une image ;)


La commande z-index fait aussi parti des trucs à proscrire ? :ouch:  
 [:at war with emo]

Reply

Marsh Posté le 27-06-2005 à 22:42:00    

mais nan the-shadow, on parlait surtout du fait k'on ne parle pas de calques en HTML ni en CSS, c'est une abération dreamweaver et netscape avec ses layer.
et ce que le gars veut faire, c'est largement faisable avece une image

Reply

Marsh Posté le 27-06-2005 à 22:47:21    

Okey pour ce que le gars veut faire.
Maintenant, pourquoi ne faut-il pas parler de calques dans du HTML ? Dès l'instant où les CSS permettent la gestion de bloc pouvant être superposés avec des zones transparentes et gestion de la profondeur, le terme calque me semble bien choisi.
Enfin, ça va plus vite que de dire "un bloc superposé au troisième niveau avec des zones transparentes". :D

Reply

Marsh Posté le 27-06-2005 à 22:57:55    

Reply

Marsh Posté le 27-06-2005 à 23:08:12    

Okey, je n'ai jamais connu la balise <layer>.
Mais bon, on peut quand même employé le terme.
 

Citation :

La seule utilisation plus ou moins valable du terme "calque" de nos jours serait la désignation de conteneurs qui se superposent (utilisation de la propriété z-index).


 
 
On va dire que je chipotte, mais en lisant FlorentG, je me suis dit "ça y est, Florent va m'apprendre ce soir que le W3C recommande de ne pas utiliser le z-index" ou un truc du genre. :D

Reply

Marsh Posté le 28-06-2005 à 08:00:45    

C'est moi :D
 
Je vais tester le truc de Masklinn.
 
Sinon, pour le "calque" je ne savais pas comment ça s'appelait, c'est mon collègue qui bosse sur dreamweaver qui m'a dit cette dénomination. Je bosse sur Quanta Plus (Linux) et ça ne parle pas de "calque" (ça ne parle de rien du tout d'ailleurs).
 
Pour ce que j'essaye de faire :
 
C'est un plan d'un batiment (image png) avec un point (image png) qui indique l'emplacement des bureaux suivant les données transmises à un script php.
 
Le probleme, c'est que ce plan doit être accessible sur de nombreuses pages et la mise en page est différente de page en page. Et donc mon point rouge ne se trouve à un endroit différente suivant la mise en page, ce qui est très emmerdant :o
 
Merci pour vos aides :jap:


---------------
C'est quand on a le nez dans la tomate qu'on voit mieux la tomate !
Reply

Marsh Posté le 28-06-2005 à 08:00:45   

Reply

Marsh Posté le 28-06-2005 à 08:43:19    

ben tu met ton plan en background d'un DIV et tu place ton point avec les margin-left et margin-top, tout ceci en position normal
ou sinon tu met ton DIV en position relative puis tu place ton img en position relative.

Reply

Marsh Posté le 28-06-2005 à 09:01:09    

gatsusat a écrit :

ben tu met ton plan en background d'un DIV et tu place ton point avec les margin-left et margin-top, tout ceci en position normal
ou sinon tu met ton DIV en position relative puis tu place ton img en position relative.


 :non: image placée en position absolue avec le conteneur explicitement positionné [:aloy]


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 28-06-2005 à 09:22:18    

ben on prend ceci :  
 
 
<div id="monplan">
<img src="point.png">
</div>
 
et dans la CSS
#monplan{
  position : relative
}
#monplan IMG{
  top:10px
  left:10px;
}  
 
là l'image se place avec top et left à à partir du coin haut gauche de son conteneur #monplan
 
Je me trompe ?  
 
à moins que j'ai mal compris ce que tu veux dire par conteneur explicitement positionné

Reply

Marsh Posté le 28-06-2005 à 09:37:43    

gatsusat a écrit :

ben on prend ceci :  
 
 
<div id="monplan">
<img src="point.png">
</div>
 
et dans la CSS
#monplan{
  position : relative
}
#monplan IMG{
  top:10px
  left:10px;
}  
 
là l'image se place avec top et left à à partir du coin haut gauche de son conteneur #monplan
 
Je me trompe ?


oui
 

#monplan {
  position : relative;
}
#monplan img {
  position: absolute;
  top:10px;
  left:10px;
}
 
[...]
 
<div id="monplan">
<img src="point.png">
</div>


Message édité par masklinn le 28-06-2005 à 09:41:22

---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 28-06-2005 à 09:44:52    

oui j'ai oublié le position:absolute j'en avais parlé juste avant,  
 
PS : erf j'avais écrit relative au lieu de absolute, alors que je l'ia utilisé hierrrrrr

Reply

Marsh Posté le 28-06-2005 à 10:29:07    

The-Shadow a écrit :

On va dire que je chipotte, mais en lisant FlorentG, je me suis dit "ça y est, Florent va m'apprendre ce soir que le W3C recommande de ne pas utiliser le z-index" ou un truc du genre. :D


T'es vraiment chiant parfois :D Bien-sûr que tu peux utiliser z-index, quand t'as des éléments qui se chevauchent. Mais maintenant faut pas se dire "ok, faut que ce machin soit au-dessus du reste, je le fous dans un calque que je positionne", mais "je positionne directement l'élément, sans le foutre dans un <div> inutile, <div> par ailleurs renommé abusivement en 'calque'". Sachant que calque fait partie du domaine de la présentation, et que l'HTML n'est pas un langage de présentation :)

Reply

Marsh Posté le 28-06-2005 à 10:30:40    

Merci beaucoup, ça fonctionne :love:
 
 :jap:


---------------
C'est quand on a le nez dans la tomate qu'on voit mieux la tomate !
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed