Se connecter avec
S'enregistrer | Connectez-vous

une image id en lien dans css

Dernière réponse : dans Programmation
Expert Programmation

Salut,

Je voudrais savoir si c'est possible d'ouvrir une page en cliquand sur une image qui n'apparait pas dans le code html mais dans le code css comme ceci:

#menu_h {
width: 900px;
height: 100px;
background: url(images/menu_h.gif);
border-left: 1px solid;
border-right: 1px solid;
}

Le code html contient juste ceci <div id="menu_h">, je voudrais kan clicquand sur l'image menu_h.gif ca ouvre une page! merci

Autres pages sur : image lien css

Lassé par la pub ? Créez un compte

Hello,

Tu peux attacher du javascript sur ton div :
  1. <div id="menu_h" onclick="window.location='mapage.htm';">Hello World</div>


Sinon, il reste la possibilité d'injecter du scripting javascript dans l'élément background du css :
  1. ...
    

  2. background: url('javascript:DefineBackgroundProperties();');
    

  3. ...

Dans ce cas, il faut veiller à faire plusieurs choses dans la fonction DefineBackgroundProperties :
- Définir l'image de fond (c'était le but initial de l'élément !)
- Attacher un évènement sur le onclick de la balise div

Ce dernier point doit être spécifique aux navigateurs. Si IE, utiliser attachEvent, sinon utiliser addEventListener.
Expert Programmation

Merci a vous deux, en fait le premier code javascript fonctionne pas comme je voudrais parce qu'il affiche une écriture, et le deuxième trop compliquer pour moi. pour <a href="#"><img src="/"></a> c'est comme ca que je fais d'habitude mais la je voulais ne mettre que <div id=""> dans le code html et gérer tout par le css. Ce n'est pas possible de mettre du js dans du css?

Citation :
il affiche une écriture

  1. <div id="toto" onclick="window.localtion='home.html';"> </div>

Ca affiche une écriture ?
je ne comprends pas ce que tu veux dire.

Citation :
Ce n'est pas possible de mettre du js dans du css?

Tu as 2 possibilités. Les 2 ne fonctionneront pas avec firefox :
1 - background: url('javascript:MaFonction();'); // Dans le CSS
2 - Utiliser l'élément css : behavior et un fichier htc

Tu peux toujours utiliser les selecteurs CSS à l'aide de ce superbe script Behaviour.js qui permet de mettre du code javascript associé à un selecteur CSS... Je pense que c'est le moyen le plus simple pour toi (pas de lien html, et rien de spéciale dans ton css, juste un petit appel à behaviour).
Tu inclus le behaviour. js et tu rajoute dans un autre fichier
  1. var myrules = {
    

  2. 		'#menu_h' : function(element){
    

  3. 			element.onclick = function(){
    

  4. 				window.localtion='TON_LIEN';
    

  5. 			}
    

  6. 		}
    

  7. 	};
    

  8.  
  9. 	Behaviour.register(myrules);
Lassé par la pub ? Créez un compte

Créer un nouveau sujet

Tom's guide dans le monde