Catégorie rétractable via une image en sprite
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
Catégorie rétractable via une image en sprite
Détails techniques
Version du forum : phpBB3
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://nsp-d3.forumofficiel.com/
Description du problème
Bonjour,J'ai utilisé ce script pour avec les catégories rétractables et il marche très bien :
- Code:
/* categories retractables sans invision */
$(function() {
if(window.localStorage) {
var b = JSON.parse(localStorage.getItem("catRet")) || {}
}
var f = 0;
if($("body#phpbb").length) {
var a = "div.table-title h2", e = "ul.topiclist", c = ":not(ul.topiclist.forums)"
}else {
$("#pun-intro").length ? (a = "div.page-title h2", e = "div.main-head", c = ":not(div.main-content)") : (a = "th.secondarytitle h2", e = "tr", c = ":not(tr)")
}
$(a).closest(e).css("cursor", "pointer").each(function() {
var d = "c" + f++, a;
window.localStorage ? b[d] && (a = !0) : a = !1;
a && $(this).nextUntil(c).toggle();
$(this).click(function() {
$(this).nextUntil(c).toggle();
window.localStorage && (b[d] ? delete b[d] : b[d] = 1, localStorage.setItem("catRet", JSON.stringify(b)))
})
})
});
Seulement j'aimerai avoir quelque chose d'un peu différent.
J'aimerai mettre une image en background de titre de la catégorie avec ce sprite :
1ère image pour réduire
2ème image pour agrandir
3ème image pour réduire (hover curseur)
4ème image pour agrandir (hover curseur)
Merci d'avance!
Dernière édition par Ancients le Jeu 7 Avr 2016 - 9:09, édité 1 fois
Re: Catégorie rétractable via une image en sprite
Bonsoir essaye de mettre ce code dans le css:
le nombre de div correspond aux catéogorie, genre + div= 1ere catégorie; + div + div = seconde catégorie etc.... et tu choisie la couleur que tu souhaites avec voila bonne soirée
amicalement serge
- Code:
ul.linklist:not(.navlinks):nth-of-type(1) + div .header {
background-color: red !important;
}
ul.linklist:nth-of-type(1) + div + div .header {
background-color: blue !important;
}
ul.linklist:nth-of-type(1) + div + div + div .header {
background-color: orange !important;
}
le nombre de div correspond aux catéogorie, genre + div= 1ere catégorie; + div + div = seconde catégorie etc.... et tu choisie la couleur que tu souhaites avec voila bonne soirée
amicalement serge
Re: Catégorie rétractable via une image en sprite
Bonsoir,
Merci pour votre réponse! Les couleurs marchent très bien mais j'aimerai à la place appliqué le sprite que j'ai mit dans mon sujet comme image de fond et le paramétrer.
Bien à vous.
Merci pour votre réponse! Les couleurs marchent très bien mais j'aimerai à la place appliqué le sprite que j'ai mit dans mon sujet comme image de fond et le paramétrer.
Bien à vous.
Re: Catégorie rétractable via une image en sprite
bonsoir la je ne peut t'aider il va falloir que tu attendent une solution par contre j'ai été faire un tour sur ton forum et sa avance bien félicitaiton, si j'avai juste un conseil , fixe ta scroolbar du forum ses plus simpa et il suivra le forum de la même façon que t'a à l'heure actuel , ps: ses juste un avis perso bonne soirée
Re: Catégorie rétractable via une image en sprite
C'est à dire fixer ma scrollbar? et comment?
Re: Catégorie rétractable via une image en sprite
Bonjour panneau d'admin---modules--sur ta gauche ( toolbar ( fixer la toolbar )
voila le tour est jouer amicalement serge
voila le tour est jouer amicalement serge
Re: Catégorie rétractable via une image en sprite
Je ne comprends pas, scrollbar ou toolbar?
Je ne veux pas de la toolbar (en haut)
Je ne veux pas de la toolbar (en haut)
Re: Catégorie rétractable via une image en sprite
Bonjour @winatickets @Ancients
Les messages hors sujet ont été supprimés !
Si vous avez des divergences de vues, merci d'utiliser les MP.
Bonne journée.
Cordialement.
Les messages hors sujet ont été supprimés !
Si vous avez des divergences de vues, merci d'utiliser les MP.
Bonne journée.
Cordialement.
Re: Catégorie rétractable via une image en sprite
Ancients a écrit:J'aimerai mettre une image en background de titre de la catégorie avec ce sprite :
Hello "Ancients"
Compte tenu de ton "Javascript" tu peux déjà mettre un truc tout simple en place
dans ton index_box tu dois avoir quelque chose du genre:
- Code:
<div class="table-title">{catrow.tablehead.L_FORUM}
</div>
Modifie le en:
- Code:
<div class="table-title">{catrow.tablehead.L_FORUM}
<span id="contract-expand" title="Réduire/Ouvrir"> + / -
</span>
</div>
Ensuite dans ton CSS rajoute:
- Code:
#contract-expand{
cursor: pointer;
float: right;
}
En fin de cellule va s'afficher " + / - " et au survol souris "Réduire/Ouvrir"
Ceci n'empêchant pas qu'au clic sur toute la cellule le "Javascript" sera actif
Re: Catégorie rétractable via une image en sprite
Salut lmc
Merci pour ta réponse.
Cela marche très mais c'est pas ce que je veux avoir au final
J'aimerai mettre l'image en fond des titres de catégorie
Merci pour ta réponse.
Cela marche très mais c'est pas ce que je veux avoir au final
J'aimerai mettre l'image en fond des titres de catégorie
Re: Catégorie rétractable via une image en sprite
.
Pour placer une image "Fond de titre de catégories" rien de plus simple
dans PA - Affichages - Images & couleurs - Gestion des images -
Image du fond des titres : -> "tu places l'http de ton image"
à priori dans ton cas -> 600px * 28px
.
Pour placer une image "Fond de titre de catégories" rien de plus simple
dans PA - Affichages - Images & couleurs - Gestion des images -
Image du fond des titres : -> "tu places l'http de ton image"
à priori dans ton cas -> 600px * 28px
.
Re: Catégorie rétractable via une image en sprite
Ah super
J'ai mit le sprite dans "Image du fond des titres"
Ce qui m'intéresserai c'est de coder ce sprite pour avoir le "-" et son hover quand la catégorie est repliée et le "+" et son hover quand la catégorie est déroulée
J'ai mit le sprite dans "Image du fond des titres"
Ce qui m'intéresserai c'est de coder ce sprite pour avoir le "-" et son hover quand la catégorie est repliée et le "+" et son hover quand la catégorie est déroulée
Re: Catégorie rétractable via une image en sprite
Ancients a écrit:,J'ai utilisé ce script pour avec les catégories rétractables et il marche très bien :
- Code:
/* categories retractables sans invision */
$(function() {
if(window.localStorage) {
var b = JSON.parse(localStorage.getItem("catRet")) || {}
}
var f = 0;
if($("body#phpbb").length) {
var a = "div.table-title h2", e = "ul.topiclist", c = ":not(ul.topiclist.forums)"
}else {
$("#pun-intro").length ? (a = "div.page-title h2", e = "div.main-head", c = ":not(div.main-content)") : (a = "th.secondarytitle h2", e = "tr", c = ":not(tr)")
}
$(a).closest(e).css("cursor", "pointer").each(function() {
var d = "c" + f++, a;
window.localStorage ? b[d] && (a = !0) : a = !1;
a && $(this).nextUntil(c).toggle();
$(this).click(function() {
$(this).nextUntil(c).toggle();
window.localStorage && (b[d] ? delete b[d] : b[d] = 1, localStorage.setItem("catRet", JSON.stringify(b)))
})
})
});
J'ai mis le sprite dans "Image du fond des titres"
Oui mais ce "Sprite" comme tu dis n'est pas dans -> l' Image du fond des titres et n'agit pas sur elle ...
Ton image est "quadruple" , il n'en faut qu'une, sans les " + " ou " - "
il faudrait pouvoir intercepter le "toggle" du "JS" pour lui affecté une valeur class= "contract" ou "expand" et afficher en fonction de sa position une image soit -> pour réduire soit -> pour ouvrir ...
Faisable ... la preuve -> < iCi >
Les catégories sont rétractables ... avec le signe " - " qui change en " + "
Le système est installé avec le "thème" et fonctionne à merveille et en plus il mémorise la position
si tu quitte ton Forum en position "catégorie fermée" à le réouverture la "catégorie est fermée"
.
Re: Catégorie rétractable via une image en sprite
C'est pas plus simple de mettre simple une image en background lorsque c'est rétracté avec son hover et une image en background lorsque c'est développé avec son hover?
Parce que ce qui m'intéresse c'est l'image en entière ya déja tout, sans rajouté de - ou +.
Parce que ce qui m'intéresse c'est l'image en entière ya déja tout, sans rajouté de - ou +.
Re: Catégorie rétractable via une image en sprite
Ancients a écrit:C'est pas plus simple de mettre simple une image en background lorsque c'est rétracté avec son hover et une image en background lorsque c'est développé avec son hover?
Parce que ce qui m'intéresse c'est l'image en entière ya déja tout, sans rajouté de - ou +.
Que ce soit l'une ou l'autre solution le problème reste le même ...
ton image actuelle est mise en place dans le PA donc non modifiable ...
pour être modifiée elle doit être programmée en CSS avec une Div exp: #retract & #expand ... mais faut-il encore que le JS donne la position du "toggle" qui implémente la bascule de -> #retract à -> #expand
Le plus simple en attendant (la solution) c'est de laisser ton image actuelle (sans + sans -) et d'utiliser la méthode d'affichage donnée plus haut du " +/- " avec l'info bulle "Réduire/Ouvrir" ...
Bon c'est pas Nickel ... mais ça permet aux visiteurs de comprendre qu'il faut cliquer pour voir ... Hormis l'effet visuel ... c'est le but de la manœuvre qui compte
Re: Catégorie rétractable via une image en sprite
J'ai enlevé l'image dans le PA car ça l'a met pour les catégories et aussi pour les sujets!
Re: Catégorie rétractable via une image en sprite
Bonjour, toujours pas d'aide hélas..?
Re: Catégorie rétractable via une image en sprite
Bonjour, un peu d'aide svp?
Re: Catégorie rétractable via une image en sprite
Bonsoir, toujours personne pour m'aider?
Merci d'avance!
Merci d'avance!
Sujets similaires
» Barre de catégorie rétractable avec image 2ème épisode: le retour
» Catégorie retractable
» Catégorie Rétractable
» Catégorie rétractable ne fonctionne plus
» Catégorie rétractable pas clair
» Catégorie retractable
» Catégorie Rétractable
» Catégorie rétractable ne fonctionne plus
» Catégorie rétractable pas clair
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