Mettre une image pour un entête créé

2 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Mettre une image pour un entête créé

Message par _backdraft_ Mer 18 Avr 2012 - 0:26

Bonjour à tous, voici mon problème.

J'ai fait il y a longtemps le tutoriel suivant :
https://forum.forumactif.com/t246228-images-de-la-barre-de-navigation-modifiees-au-passage-de-la-souris

Jusqu'à maintenant tout va bien sauf que dans ma barre de navigation du forum j'ai créé un nouveau entête, mon problème est que j'aimerais faire la même chose que pour les autres c'est à dire mettre une image à la place du texte et que quand on passe le curseur, l'image change. En faite mon problème est que pour le code CSS je ne trouve pas l'identifiant que je dois mettre pour qu'il reconnaisse que je veux modifier l'entête que j'ai créé. Une petite capture pour mieux comprendre :

Mettre une image pour un entête créé Sans_t14

Merci beaucoup !


Dernière édition par _backdraft_ le Jeu 19 Avr 2012 - 19:35, édité 1 fois
_backdraft_

_backdraft_
Membre habitué

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par Manumanu Mer 18 Avr 2012 - 5:36

Bonjour,

J'ai du mal à comprendre ton problème, essaie de l'expliquer un peu plus en détails. Si j'ai bien compris, tu veux remplacer les liens de ton menu par des images, et faire en sorte que ces images changent lorsque tu les survoles avec la souris ? Mais dans ton screen, il ne semble pas y avoir d'images ?

Ce n'est pas la même façon de procéder s'il s'agit d'images sans texte plein (dans le html quoi). Je t'en dirais plus après ta réponse. Wink
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par _backdraft_ Mer 18 Avr 2012 - 8:16

Non en faite je l'ai déjà fait sur les entêtes de navigation par défaut. Je vais essayer d'être plus claire :

Je viens de créer un nouvel entête que j'ai placé entre "message" et "déconnexion". J'ai voulut refaire le tutoriel pour que l'entête que je viens d'ajouter soit comme les autres (que l'image change quand on passe la souris). J'ai donc voulut refaire le tutoriel pour le nouvel entête, le problème est à l'étape du CSS je ne sais pas quel identifiant je dois mettre dans le CSS. Par exemple pour celui du bouton "connexion" l'identifiant dans le CSS est : #i_icon_mini_login. Mais comme mon entête a été créé par moi même je n'ai aucunes idées de quel identifiant je dois utiliser.

Merci, et j'espère avoir été plus claire.
_backdraft_

_backdraft_
Membre habitué

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par Manumanu Mer 18 Avr 2012 - 8:24

En effet, c'est bien plus clair, c'est juste une question de terminologie qui risque de faire quiproquo : Ce que tu appelles "en-tête", c'est simplement un lien, accessoirement un lien du menu si tu veux être plus précis. Wink

Pour pouvoir te dire quel ID utiliser, j'ai besoin de voir le forum, donc mets un lien (d'ailleurs, fais-le toujours quand tu demandes de l'aide, les gens ont presque toujours besoin de le voir pour t'aider).
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par _backdraft_ Mer 18 Avr 2012 - 8:27

_backdraft_

_backdraft_
Membre habitué

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par Manumanu Mer 18 Avr 2012 - 8:33

Bien, par contre il semble que ça ne s'affiche que si on est connecté. Tu as un compte factice pour que je puisse tester ?

Autre chose, désactiver le clic droit ne protège strictement (mais vraiment strictement) rien, par contre ça :
  • Détruit totalement la navigation (Si je veux faire clic droit > ouvrir dans un nouvel onglet ?)
  • Empêche d'utiliser des fonctions plus ou moins importantes (ou au moins pratiques)
  • Oblige quelqu'un qui veut t'aider à faire des manipulations pour désactiver le javascript chaque fois qu'il charge une page pour pouvoir t'aider
  • Et accessoirement, c'est juste super pénible pour tout visiteur

Je ne peux que te conseiller d'enlever ça. Wink
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par _backdraft_ Mer 18 Avr 2012 - 8:39

Manumanu a écrit:Autre chose, désactiver le clic droit ne protège strictement (mais vraiment strictement) rien, par contre ça :
  • Détruit totalement la navigation (Si je veux faire clic droit > ouvrir dans un nouvel onglet ?)
  • Empêche d'utiliser des fonctions plus ou moins importantes (ou au moins pratiques)
  • Oblige quelqu'un qui veut t'aider à faire des manipulations pour désactiver le javascript chaque fois qu'il charge une page pour pouvoir t'aider
  • Et accessoirement, c'est juste super pénible pour tout visiteur

Je ne peux que te conseiller d'enlever ça. Wink

Je sais mais c'est une décision qu'on n'a pris en concertation avec mes membres.
Je te l'envoie par mp.

Merci
_backdraft_

_backdraft_
Membre habitué

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par Manumanu Mer 18 Avr 2012 - 8:49

Ça n'est pas pour autant une bonne décision parce que le nombre l'a souhaité ; mais soit. Ce n'était qu'une remarque. Wink

Alors, l'élément n'a pas d'identifiant. Pour le sélectionner, il suffit d'utiliser le sélecteur d'attribut. Je m'explique :

Voici ton code html :
Code:
<img src="" border="0" hspace="0" alt="Affectations" title="Affectations">

On va prendre l'attribut alt et sa valeur pour sélectionner l'élément, en supposant que celui-ci soit unique (pas d'autre image avec le même attribut). Ce qui nous donnera ça :

Code:
img[alt=Affectations] {
   /* ce que tu veux */
}

img[alt=Affectations]:hover {
   /* ce que tu veux */
}


Et le tour est joué. Pensez bien entendu à mettre la fameuse image transparente (https://2img.net/i/fa/empty.gif) dans la source de l'image. Wink
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par _backdraft_ Mer 18 Avr 2012 - 9:04

Merci beaucoup toute fois je ne mes pas résolu car je le ferait ce soir, je dois aller travailler ^^ Encore merci.
_backdraft_

_backdraft_
Membre habitué

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par Manumanu Mer 18 Avr 2012 - 9:25

J'attends le verdict ce soir. Wink
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par _backdraft_ Mer 18 Avr 2012 - 22:44

Merci ça marche cependant j'ai un petit problème et deux questions ^^ :

Pour commencer j'ai un problème, l'image est entouré d'un cadre (voir screenshot) et j'ai aucune idée d'où il sort.

Ensuite première question : Si j'en fais un autre je peux encore utiliser la même astuce (en changeant bien sur le nom) ?

Deuxième question : pas trop de rapport mais c est sur le clic droit, vous m'avez fait réfléchir car j'hésitais à l'enlevé car je sais très bien qu'avec Firefox c'est facilement contournable... personnellement si je voulais un anti clic droit c'était pour empêcher de pouvoir accéder au code source. Y a t il donc un autre moyen de le cacher ?

Merci beaucoup
Mettre une image pour un entête créé Sans_t15
_backdraft_

_backdraft_
Membre habitué

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par Manumanu Jeu 19 Avr 2012 - 8:37

Première question, oui tu peux bien entendu refaire ça plusieurs fois.

Par contre, tu n'as aucun moyen d'empêcher l'accès au code source d'une part, et d'autre part aucune raison de le faire. Le HTML est un code libre, et ton forum ne contient rien qui ne soit pas reproductible ailleurs, avec ou sans le code de ton forum. D'ailleurs, je ne crois pas qu'il existe une façon de s'approprier un code html/css, légalement parlant.

Le trait, c'est parce que ton image n'a pas de source : il affiche donc l'emplacement d'une image, sans son image, ce qui donne ça. Par contre, je ne vois pas pourquoi tu t'embêtes avec des images pour ton menu, il est parfaitement faisable à l'identique, plus simple parce que tu n'auras pas à t'embêter avec des images à l'avenir, et en plus fonctionnel et plus pratique... Et plus beau, parce que là la qualité des images est assez basse.

Quelque chose comme ça suffirait à tout le menu textuel :
/* normal */
Code:
ul.linklist a {
   font-size: 12px;
   color: #722a14;
   display: block;
}

/* au survol */
ul.linklist a:hover {
   background: #23b2f3;
}
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par _backdraft_ Jeu 19 Avr 2012 - 17:48

Merci beaucoup pour ton aide ! J'avais créé des images car c'est comme ça qu'il le propose sur le tutoriel mais j'avoue ne pas être fort en CSS, pour faire ça je dois enlever les images que j'avais mis et remettre le lien en texte plutot qu'en image ? (je préfère demander avant de faire n'importe quoi ^^)

PS : je ne voulais pas m'approprier un code mais il y a de plus en plus de forum qui on le même fonctionnement et le même thème que le mien et je sais que certains formulaires de mon forum leur plairaient et j'avoue que le fait qu'ils le copient alors que j'ai passé plusieurs heures à le faire me rendrait vert...
_backdraft_

_backdraft_
Membre habitué

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par Manumanu Jeu 19 Avr 2012 - 17:58

Oui, exactement ; il y aurait sûrement quelques petits ajustements à faire, mais sur le principe, c'est ça.

Si tu essaies, n'hésites pas à montrer le résultat, on le peaufinera.

Sinon pour le code, je comprends bien ; mais toi-même, ne prendrais-tu pas quelque chose qui te semblerait intéressant sur un site ? Les gens qui passent des heures à faire un tutoriel le font bien pour que d'autres puissent les reprendre. Après, c'est une question de point de vue, et je ne redirais rien si la méthode de protection ne sacrifiait pas le clic droit. Wink
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par _backdraft_ Jeu 19 Avr 2012 - 18:32

Merci pour le code mais il est encore modifiable en effet, les en tête son les uns en dessous des autres, je ne trouve pas très esthétique.

Merci

PS : il y a également un autre problème, cela fait le fond bleu pour tous les liens, il n y a pas un moyen de le faire que pour les menus de navigation ?
_backdraft_

_backdraft_
Membre habitué

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par Manumanu Jeu 19 Avr 2012 - 18:41

Oui, je vois pourquoi.

Code:
ul.linklist a {
  font-size: 12px;
  color: #722a14;
  display: inline-block;
}

/* au survol */
ul.linklist a:hover {
  background: #23b2f3;
  border-radius: 5px;
}

Ça sera mieux ainsi.
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par _backdraft_ Jeu 19 Avr 2012 - 18:51

Merci beaucoup c'est exactement ce que je voulais il y a juste un tout petit truc qui me dérange et se sera parfait : c'est le fait que le fond bleu s'enclenche pour tous les liens y a t il un autre identifiant pour que ça le face uniquement sur les en tête merci.
_backdraft_

_backdraft_
Membre habitué

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Mettre une image pour un entête créé

Message par Manumanu Jeu 19 Avr 2012 - 18:58

Et comme ceci ?

Code:
#page-header .linklist a {
    font-size: 12px;
    color: #722a14;
    display: inline-block;
}

/* au survol */
#page-header .linklist a:hover {
    background: #23b2f3;
    border-radius: 5px;
}
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par _backdraft_ Jeu 19 Avr 2012 - 18:59

Non désolé c'est toujours sur tous les liens.
_backdraft_

_backdraft_
Membre habitué

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par Manumanu Jeu 19 Avr 2012 - 19:02

Tu dois remplacer l'ancien code par le nouveau. Wink
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par _backdraft_ Jeu 19 Avr 2012 - 19:05

Oui oui ^^ mais ça marche toujours pas.
_backdraft_

_backdraft_
Membre habitué

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par _backdraft_ Jeu 19 Avr 2012 - 19:08

Ah si pardon j'avais fait une mauvaise manoeuvre :S

Au risque de paraitre embêtant j'ai juste une dernière question, en faite avant quand j avais les images j'avais réglé que pour les nouveaux mp le bouton messagerie apparaissait avec un fond rouge est ce possible de le refaire (il faut surement utiliser du JS non ?)
_backdraft_

_backdraft_
Membre habitué

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par Manumanu Jeu 19 Avr 2012 - 19:12

Il doit y avoir une classe qui s'ajoute lorsqu'il y a un MP ; tu pourrais en envoyer un sur le compte auquel tu m'as donné accès, que je regarde ça ?
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par _backdraft_ Jeu 19 Avr 2012 - 19:21

Voilà Wink
_backdraft_

_backdraft_
Membre habitué

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par Manumanu Jeu 19 Avr 2012 - 19:21

Est-ce bon du coup ?
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par _backdraft_ Jeu 19 Avr 2012 - 19:23

Comment ça ?
Si vous parlez du mp oui je vous l'ai envoyé.
_backdraft_

_backdraft_
Membre habitué

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Mettre une image pour un entête créé

Message par Manumanu Jeu 19 Avr 2012 - 19:26

Ah oui, je n'y étais plu, désolé.

Voilà qui devrait marcher :
Code:
.linklist .new-message {
    color: red;
}
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par _backdraft_ Jeu 19 Avr 2012 - 19:29

Nickel j'ai juste mis background au lieu de color, merci beaucoup cheers

Au plaisir je l'espère Wink
_backdraft_

_backdraft_
Membre habitué

Masculin
Messages : 1509
Inscrit(e) le : 04/03/2010

http://www.caserne35.com
_backdraft_ a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mettre une image pour un entête créé

Message par Manumanu Jeu 19 Avr 2012 - 19:31

Pas de soucis!
Manumanu

Manumanu
****

Masculin
Messages : 437
Inscrit(e) le : 27/12/2011

http://helpinghelps-phpbb2.forumgratuit.org/
Manumanu a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum