bouton Hover
4 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
bouton Hover
Bonjour, mon premier problème est résolu mais il y en a 1 autre...
Premièrement j'ai un espace entre les boutons (Cette partie est résolu il faut réglé la même séquence dans le PA/Affichage/en-tête&Navigation et dans le CSS) mais toutes les pages HTML(et qui remplace un bouton d'origine) que j'ai ajouté et qui devraient s'ouvrir dans un nouvel onglet s'ouvre sur la même page et vont chercher la page par défaut.. EX: Calendrier me donne la page calendrier fournit avec le forum alors que moi j'avais mis un lien de redirection vers un site de stats et grille horaire... Je crois qu'il faut changer le ID #i_icon_mini_calendar et en attribuer un à ma page HTML avec un JS et le CSS mais je ne suis pas certain du comment on fait...
Voici le code CSS:
Il y aurait-il une façon d'enlever l'espace entre les boutons et que ceux qui devraient ouvrir une nouvelle page dans un nouvel onglet le fassent ?
Merci de bien vouloir m'aider !
Cdt,
Voici le code CSS:
- Code:
/*IMAGE INDEX*/
#i_icon_mini_index{
background-image:url('http://i58.servimg.com/u/f58/18/12/26/07/acceui13.jpg'); /*image si la souris ne survole pas*/
width:76px; /*Largeur de l'image*/
height:40px; /*Hauteur de l'image*/
}
#i_icon_mini_index:hover{
background-image:url('http://i58.servimg.com/u/f58/18/12/26/07/acceui16.jpg'); /*image si la souris survole*/
width:76px; /*Largeur de l'image*/
height:40px; /*Hauteur de l'image*/
}
/*IMAGE PORTAIL*/
#i_icon_mini_portal{
background-image:url('http://i58.servimg.com/u/f58/18/12/26/07/portai10.jpg'); /*image si la souris ne survole pas*/
width:76px; /*Largeur de l'image*/
height:40px; /*Hauteur de l'image*/
}
#i_icon_mini_portal:hover{
background-image:url('http://i58.servimg.com/u/f58/18/12/26/07/portai11.jpg'); /*image si la souris survole*/
width:76px; /*Largeur de l'image*/
height:40px; /*Hauteur de l'image*/
}
/*IMAGE CALENDRIER*/
#i_icon_mini_calendar{
background-image:url('URL'); /*image si la souris ne survole pas*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
#i_icon_mini_calendar:hover{
background-image:url('URL'); /*image si la souris survole*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
/*IMAGE FAQ*/
#i_icon_mini_faq{
background-image:url('URL'); /*image si la souris ne survole pas*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
#i_icon_mini_faq:hover{
background-image:url('URL'); /*image si la souris survole*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
/*IMAGE RECHERCHE*/
#i_icon_mini_search{
background-image:url('URL'); /*image si la souris ne survole pas*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
#i_icon_mini_search:hover{
background-image:url('URL'); /*image si la souris survole*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
/*IMAGE LISTE MEMBRES*/
#i_icon_mini_members{
background-image:url('URL'); /*image si la souris ne survole pas*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
#i_icon_mini_members:hover{
background-image:url('URL'); /*image si la souris survole*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
/*IMAGE GROUPES*/
#i_icon_mini_groups{
background-image:url('URL'); /*image si la souris ne survole pas*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
#i_icon_mini_groups:hover{
background-image:url('URL'); /*image si la souris survole*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
/*IMAGE PROFIL*/
#i_icon_mini_profile{
background-image:url('URL'); /*image si la souris ne survole pas*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
#i_icon_mini_profile:hover{
background-image:url('URL'); /*image si la souris survole*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
/*IMAGE MP (pas de nouveaux messages)*/
#i_icon_mini_message{
background-image:url('URL'); /*image si la souris ne survole pas*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
#i_icon_mini_message:hover{
background-image:url('URL'); /*image si la souris survole*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
/*IMAGE MP (nouveaux messages)*/
#i_icon_mini_new_message{
background-image:url('URL'); /*image si la souris ne survole pas*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
#i_icon_mini_new_message:hover{
background-image:url('URL'); /*image si la souris survole*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
/*IMAGE DECONEXION*/
#i_icon_mini_logout{
background-image:url('URL'); /*image si la souris ne survole pas*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
#i_icon_mini_logout:hover{
background-image:url('URL'); /*image si la souris survole*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
/*IMAGE S'ENREGISTRER*/
#i_icon_mini_register{
background-image:url('URL'); /*image si la souris ne survole pas*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
#i_icon_mini_register:hover{
background-image:url('URL'); /*image si la souris survole*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
/*IMAGE CONNEXION*/
#i_icon_mini_login{
background-image:url('URL'); /*image si la souris ne survole pas*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
#i_icon_mini_login:hover{
background-image:url('URL'); /*image si la souris survole*/
width:??px; /*Largeur de l'image*/
height:??px; /*Hauteur de l'image*/
}
Merci de bien vouloir m'aider !
Cdt,
Dernière édition par badibou le Ven 31 Jan 2014 - 22:39, édité 2 fois
Re: bouton Hover
Hello,
Pour faire simple : je n'ai absolument rien compris... Que voulez-vous faire exactement ?
Pour faire simple : je n'ai absolument rien compris... Que voulez-vous faire exactement ?
Re: bouton Hover
lolll, ok, bonjour Whynot ! bon pour faire simple je voudrais ajouter 2 boutons non inexistant au code CSS plus haut et qu'ils ouvres leur page dans un nouvel onglet...
Ex: j'ai fait un nouveau portail(en passant par PA/Affichage/En-tête & Navigation/Ajouter un menu personnalisé) pour qu'il s'ouvre dans un nouvel onglet.. ou Calendrier qui redirige sur un site ou il y a un calendrier sportif etc... je cherche comment intégré ces pages à mon menu..
J'espère avoir été plus limpide !!
Cdt,
Ex: j'ai fait un nouveau portail(en passant par PA/Affichage/En-tête & Navigation/Ajouter un menu personnalisé) pour qu'il s'ouvre dans un nouvel onglet.. ou Calendrier qui redirige sur un site ou il y a un calendrier sportif etc... je cherche comment intégré ces pages à mon menu..
J'espère avoir été plus limpide !!
Cdt,
Re: bouton Hover
Salut,
pour les ouverture dans un nouvel onglet
il te suffit de faire comme ceci :
pour les ouverture dans un nouvel onglet
il te suffit de faire comme ceci :
Re: bouton Hover
Bjr a tous ,
Je n’arrive pas à installer ce code pour le changement de mes boutons du + et du - système de réputation
J'ai pourtant suis à la lettre cette aide ; https://forum.forumactif.com/t316611-changer-l-image-des-signes-et-de-reputation#2757654 Mais rien n'y fait ...
Qui peut m'aider ? SVP
Je n’arrive pas à installer ce code pour le changement de mes boutons du + et du - système de réputation
J'ai pourtant suis à la lettre cette aide ; https://forum.forumactif.com/t316611-changer-l-image-des-signes-et-de-reputation#2757654 Mais rien n'y fait ...
Qui peut m'aider ? SVP
Invité- Invité
Re: bouton Hover
medamine14 a écrit:Salut,
pour les ouverture dans un nouvel onglet
il te suffit de faire comme ceci :
Bonjour Medamine, j'ai essayé cette solution mais dans le PA on ne peut rien changer :
C'est pourquoi j'avais créé une page "Portail" qui me donnais accès aux options... mais comme le code CSS plus haut ne tien compte que des ID déjà utilisés par le CSS "de base", il prend en compte l'autre page nommée "Portail" et je ne peux donc associés mes pages créés avec les boutons et avoir les options...
J'espère que je suis assez claire dans mes explications..
Cdt,
Re: bouton Hover
ça marche pas avec Accueil/portail de base
il marche avec les menu que tu crée
il marche avec les menu que tu crée
Re: bouton Hover
Bonjour
Si j'ai bien compris..
Vous pouvez essayez en rajoutant via PA/Affichage/En-tête & Navigation/Ajouter un menu personnalisé
Essayez en mettant dans URL de redirection par exemple
Cdt.
Si j'ai bien compris..
Vous pouvez essayez en rajoutant via PA/Affichage/En-tête & Navigation/Ajouter un menu personnalisé
Essayez en mettant dans URL de redirection par exemple
- Code:
http://google.com/" target="blank
Cdt.
Re: bouton Hover
Adam_sfp a écrit:Bonjour
Si j'ai bien compris..
Vous pouvez essayez en rajoutant via PA/Affichage/En-tête & Navigation/Ajouter un menu personnalisé
Essayez en mettant dans URL de redirection par exemple
- Code:
http://google.com/" target="blank
Cdt.
Bonjour Adam_sfp, j'ai essayé mais sans résultat...
La page calendar n'est pas modifiable et j'en avais créé une autre dans le temps:
J'ai ajouté le code que vous m'avez donné dans celle que j'avais créé:
De plus j'ai ajouté un code au CSS pour que le bouton calendrier(calendar) n'apparaisse plus:
- Code:
a.mainmenu[href="http://spt1.forum-canada.com/calendar"] { display: none; }
- Code:
a.mainmenu[href="http://spt1.forum-canada.com/portal"] { display: none; }
Merci !
Cdt,
Medamine a écrit: par medamine14 le Mar 28 Jan 2014 - 4:27
ça marche pas avec Accueil/portail de base
il marche avec les menu que tu crée
Bonjour Medamine.
Oui je crois que c'est relié puisque si tu bouge un menu(comme dans le cas de mes nouvelles pages de remplacement) et qu'il n'est pas à la même place que dans le CSS cela crée un espace entre les boutons.
Et si je mets la séquence identique dans le CSS et le menu:
- Code:
#i_icon_mini_index{
background-image:url('http://i58.servimg.com/u/f58/18/12/26/07/acceui13.jpg'); /*image si la souris ne survole pas*/
width:76px; /*Largeur de l'image*/
height:40px; /*Hauteur de l'image*/
}
#i_icon_mini_index:hover{
background-image:url('http://i58.servimg.com/u/f58/18/12/26/07/acceui16.jpg'); /*image si la souris survole*/
width:76px; /*Largeur de l'image*/
height:40px; /*Hauteur de l'image*/
}
/*IMAGE PORTAIL*/
#i_icon_mini_portal{
background-image:url('http://i58.servimg.com/u/f58/18/12/26/07/portai12.jpg'); /*image si la souris ne survole pas*/
width:76px; /*Largeur de l'image*/
height:40px; /*Hauteur de l'image*/
}
#i_icon_mini_portal:hover{
background-image:url('http://i58.servimg.com/u/f58/18/12/26/07/portai13.jpg'); /*image si la souris survole*/
width:76px; /*Largeur de l'image*/
height:40px; /*Hauteur de l'image*/
}
/*IMAGE CALENDRIER*/
#i_icon_mini_calendar{
background-image:url('http://i58.servimg.com/u/f58/18/12/26/07/calend12.jpg'); /*image si la souris ne survole pas*/
width:99px; /*Largeur de l'image*/
height:40px; /*Hauteur de l'image*/
}
#i_icon_mini_calendar:hover{
background-image:url('http://i58.servimg.com/u/f58/18/12/26/07/calend13.jpg'); /*image si la souris survole*/
width:99px; /*Largeur de l'image*/
height:40px; /*Hauteur de l'image*/
}
/*IMAGE LISTE MEMBRES*/
#i_icon_mini_members{
background-image:url('http://i58.servimg.com/u/f58/18/12/26/07/membre12.jpg'); /*image si la souris ne survole pas*/
width:90px; /*Largeur de l'image*/
height:40px; /*Hauteur de l'image*/
}
#i_icon_mini_members:hover{
background-image:url('http://i58.servimg.com/u/f58/18/12/26/07/membre13.jpg'); /*image si la souris survole*/
width:90px; /*Largeur de l'image*/
height:40px; /*Hauteur de l'image*/
Dans le panneau:
Et le résultat:
Merci !
Cdt,
Re: bouton Hover
Bonsoir
Vous voulez ouvrir quel lien dans une nouvelle page?
le calendrier du forum ou un lien externe?
Cdt.
Vous voulez ouvrir quel lien dans une nouvelle page?
le calendrier du forum ou un lien externe?
Cdt.
Re: bouton Hover
Adam_sfp a écrit:Bonsoir
Vous voulez ouvrir quel lien dans une nouvelle page?
le calendrier du forum ou un lien externe?
Cdt.
Bonjour, le portail dans une nouvelle page et un lien externe nommé "Calendrier" de statistiques et de pointage.. http://www.sportstats.com/hockey/usa/nhl/
Cdt,
Re: bouton Hover
Bonsoir
Pour etre sur d'avoir bien compris vous voulez ajouter un bouton dans
PA/Affichage/En-tête & Navigation/Ajouter un menu personnalisé
Par exemple un bouton calendar
avec une image et qu'il ouvre ce lien http://www.sportstats.com/hockey/usa/nhl/ dans un nouvel onglet?
Pour etre sur d'avoir bien compris vous voulez ajouter un bouton dans
PA/Affichage/En-tête & Navigation/Ajouter un menu personnalisé
Par exemple un bouton calendar
avec une image et qu'il ouvre ce lien http://www.sportstats.com/hockey/usa/nhl/ dans un nouvel onglet?
Re: bouton Hover
Exact !
Re: bouton Hover
Bonsoir
Essayez en mettant dans
PA/Affichage/En-tête & Navigation/Ajouter un menu personnalisé
Dans image le lien de votre image
et dans
Url de redirection
Cdt.
Essayez en mettant dans
PA/Affichage/En-tête & Navigation/Ajouter un menu personnalisé
Dans image le lien de votre image
et dans
Url de redirection
- Code:
http://www.sportstats.com/hockey/usa/nhl/" target="blank
Cdt.
Re: bouton Hover
Bonjour Adam, cela fonctionne comme ça mais le bouton n'est pas hover.. http://spt1.forum-canada.com/
Cdt.
Cdt.
Re: bouton Hover
Re,
il faut lui donné l'id que tu utilise dans ton css
comme ceci :
dans l'url de l'image
il faut lui donné l'id que tu utilise dans ton css
comme ceci :
- Code:
http://2img.net/i/fa/empty.gif" id="i_icon_mini_calendar
dans l'url de l'image
Re: bouton Hover
medamine14 a écrit:Re,
il faut lui donné l'id que tu utilise dans ton css
comme ceci :
- Code:
http://2img.net/i/fa/empty.gif" id="i_icon_mini_calendar
dans l'url de l'image
- Code:
http://i58.servimg.com/u/f58/18/12/26/07/calend13.jpg" id="i_icon_mini_calendar
J'ai rien dit cela fonctionne
Merci !!
Re: bouton Hover
Il ne reste qu'un souci.. les 2 boutons que je remplace reste visible en Admin...
Merci encore !
Cdt,
EDIT!: Chose étrange j'ai réussis à faire "disparaitre" le bouton Portail en le remontant en dessous de l'autre dans la liste du PA(mais ne s'ouvre plus dans une nouvelle page) et ça ne fonctionne pas avec le calendrier...
EDIT2:
Question par curiosité.. comment faire comme ceci dans le TUTO de Choupette: Pour un remplacement immédiat sans temps de chargement ( la première fois ), vous pourriez avoir l'image et son remplacement sur la même "image" et utiliser la propriété background-position dans le CSS pour faire apparaître l'une ou l'autre.
Merci encore !
Cdt,
EDIT!: Chose étrange j'ai réussis à faire "disparaitre" le bouton Portail en le remontant en dessous de l'autre dans la liste du PA(mais ne s'ouvre plus dans une nouvelle page) et ça ne fonctionne pas avec le calendrier...
EDIT2:
Question par curiosité.. comment faire comme ceci dans le TUTO de Choupette: Pour un remplacement immédiat sans temps de chargement ( la première fois ), vous pourriez avoir l'image et son remplacement sur la même "image" et utiliser la propriété background-position dans le CSS pour faire apparaître l'une ou l'autre.
Re: bouton Hover
Up! Bonjour, avant de vouloir mettre le hover j'avais ce code pour ne pas qu'un 2e boutons identique apparaisse...
Faudrait-il le changer d'attribut ? ke sais pas.. a.mainmenu.hover....
Cdt,
- Code:
a.mainmenu[href="http://spt1.forum-canada.com/calendar"] { display: none; }
Faudrait-il le changer d'attribut ? ke sais pas.. a.mainmenu.hover....
Cdt,
Re: bouton Hover
Salut,
pour le problème de portail, tu as pas bien mis l'id dans l'image
si tu arrive pas passe moi le code
pour l'autre problème je pense que c'est celui la le bon :
essaye le et dis moi si c'est bon ^^
pour le problème de portail, tu as pas bien mis l'id dans l'image
si tu arrive pas passe moi le code
pour l'autre problème je pense que c'est celui la le bon :
- Code:
a.mainmenu[href="/calendar"] {display: none;}
essaye le et dis moi si c'est bon ^^
Re: bouton Hover
medamine14 a écrit:Salut,
pour le problème de portail, tu as pas bien mis l'id dans l'image
si tu arrive pas passe moi le code
pour l'autre problème je pense que c'est celui la le bon :
- Code:
a.mainmenu[href="/calendar"] {display: none;}
essaye le et dis moi si c'est bon ^^
Mon ami, tu dis que t'es pas un pro... mais tu es meilleur que tu crois... !!
Merci encore et encore !
Cdt, Badi !
Sujets similaires
» Le Hover du Bouton n'apparait pas
» Animation + hover bouton haut et bas
» Mettre un bouton cliquable vers une nouvelle page en hover
» Sous-forum en hover
» Image new/no new hover.
» Animation + hover bouton haut et bas
» Mettre un bouton cliquable vers une nouvelle page en hover
» Sous-forum en hover
» Image new/no new hover.
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum