Changer couleur des résultats de recherche dans la Toolbar
2 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
Changer couleur des résultats de recherche dans la Toolbar
Version du forum : Phbb2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://empiredesouvenirs.forumactif.com/
Bonjour à tous ! ^^
Actuellement entrain de faire plusieurs essai sur mon forum à propos de la Toolbar, je me retrouve confronté à un petit soucis, voila lorsque j'effectue des recherches via celle-ci, les résultats apparaissent en couleur blanc.
Je souhaiterai savoir comment faire pour que les résultats apparaissent avec une couleur noir car du blanc sur du blanc c'est pas top pour la lecture ...
Merci.
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://empiredesouvenirs.forumactif.com/
Bonjour à tous ! ^^
Actuellement entrain de faire plusieurs essai sur mon forum à propos de la Toolbar, je me retrouve confronté à un petit soucis, voila lorsque j'effectue des recherches via celle-ci, les résultats apparaissent en couleur blanc.
Je souhaiterai savoir comment faire pour que les résultats apparaissent avec une couleur noir car du blanc sur du blanc c'est pas top pour la lecture ...
Merci.
Re: Changer couleur des résultats de recherche dans la Toolbar
Je te remercie pour ton aide Neptunia !
J'ai testé l'ajout via la feuille de CSS ça fonctionne mais j'ai lu dans le fil qu'il y a moyen de modifier la couleur directement dans le Javascript également.
Ne maîtrisant pas trop tout ce qui est codage et ne souhaitant pas faire de bêtises, pourrais tu me dire comment faire pour le modifier directement dedans ? Car sur le topic, tu parles d'un ajout à la ligne 199 mais il semblerai que j'en ai pas autant dans le mien.
Merci d'avance pour ton aide.
Ps : je souhaiterai savoir aussi, hormis le fait de rajouter des lignes supplémentaires, le fait de faire l'ajout dans le CSS ou le Javascript a t-il une influence quelconque sur le forum ?
J'ai testé l'ajout via la feuille de CSS ça fonctionne mais j'ai lu dans le fil qu'il y a moyen de modifier la couleur directement dans le Javascript également.
Ne maîtrisant pas trop tout ce qui est codage et ne souhaitant pas faire de bêtises, pourrais tu me dire comment faire pour le modifier directement dedans ? Car sur le topic, tu parles d'un ajout à la ligne 199 mais il semblerai que j'en ai pas autant dans le mien.
- Code:
(function() {
'DEVELOPED BY ANGE TUTEUR';
'NO DISTRIBUTION WITHOUT CONSENT OF THE AUTHOR';
'ORIGIN : http://fmdesign.forumotion.com/t1118-live-search#26404';
window.fa_ajax_search = {
input_fields : 'input[name="search_keywords"]', // input elements you want to enable ajax searching on
delay : 100, // delay before sending search
// language settings
lang : {
title : 'Résultats de la recherche',
searching : 'Recherche de sujets pour "{KEYWORDS}"...',
no_results : 'Aucun résultat n\'a été trouvé pour "{KEYWORDS}"',
view_all : 'Afficher dans la page de recherche',
close : 'Fermer'
},
// wait before sending the search
queue : function (caller) {
fa_ajax_search.clear(); // clear ongoing searches
fa_ajax_search.wait = window.setTimeout(function() {
fa_ajax_search.query(caller);
}, fa_ajax_search.delay);
},
// create the search result popup
createPopup : function (caller) {
if (!fa_ajax_search.popup) {
var popup = document.createElement('DIV');
popup.className = 'fa_ajax_search-results';
popup.innerHTML =
'<a href="javascript:fa_ajax_search.clear();" class="fa_ajax_search-close" title="' + fa_ajax_search.lang.close + '">X</a>'+
'<div class="fa_ajax_search-title">' + fa_ajax_search.lang.title + '</div>'+
'<ul class="fa_ajax_search-topics"></ul>'+
'<p style="text-align:center;">'+
'<a href="#" class="button1">' + fa_ajax_search.lang.view_all + '</a>'+
'</p>';
fa_ajax_search.popup = popup;
}
fa_ajax_search.popup.getElementsByTagName('UL')[0].innerHTML = '<li>' + fa_ajax_search.lang.searching.replace('{KEYWORDS}', caller.value) + '</li>';
fa_ajax_search.popup.lastChild.getElementsByTagName('A')[0].href = fa_ajax_search.url(caller);
caller.parentNode.appendChild(fa_ajax_search.popup);
},
// submit a search
query : function (caller) {
fa_ajax_search.createPopup(caller);
fa_ajax_search.request = $.get(fa_ajax_search.url(caller), function(d) {
fa_ajax_search.showResults(caller, $('.topictitle', d));
});
},
// create and return the search URL
url : function (caller) {
var form = $(caller).closest('form')[0],
where = form ? form.search_where : null;
return '/search?search_keywords=' + encodeURIComponent(caller.value) + '*' + ( where ? '&search_where=' + where.value : '' );
},
// show the results in the popup
showResults : function (caller, results) {
var i = 0,
j = results.length,
list = fa_ajax_search.popup.getElementsByTagName('UL')[0],
frag = document.createDocumentFragment(),
li;
if (j) {
for (; i < j; i++) {
li = document.createElement('LI');
results[i].href = results[i].href.replace(/%2A$/, '');
li.appendChild(results[i]);
frag.appendChild(li);
}
list.innerHTML = '';
list.appendChild(frag);
} else {
list.innerHTML = '<li>' + fa_ajax_search.lang.no_results.replace('{KEYWORDS}', caller.value) + '</li>';
}
},
// initialize the selected input(s)
init : function (node) {
$(node).keyup(function() {
if (this.value.length >= 3) {
fa_ajax_search.queue(this);
} else {
fa_ajax_search.clear();
}
}).attr('autocomplete', 'off');
},
// clear and abort ongoing searches
clear : function () {
if (fa_ajax_search.wait) {
window.clearTimeout(fa_ajax_search.wait);
delete fa_ajax_search.wait;
}
if (fa_ajax_search.request) {
fa_ajax_search.request.abort();
delete fa_ajax_search.request;
}
if (fa_ajax_search.popup && fa_ajax_search.popup.parentNode) {
fa_ajax_search.popup.parentNode.removeChild(fa_ajax_search.popup);
}
}
};
// search result styles
$('head').append(
'<style type="text/css">'+
'.fa_ajax_search-results {'+
'font-family:arial, verdana, sans-serif;'+
'font-size:12px;'+
'text-align:left;'+
'white-space:normal;'+
'background:#FFF;'+
'border:1px solid #CCC;'+
'box-shadow:0 6px 12px rgba(0, 0, 0, 0.175);'+
'margin-top:3px;'+
'position:absolute;'+
'z-index:1;'+
'}'+
'.fa_ajax_search-title {'+
'color:#FFF;'+
'background:#69C;'+
'font-size:16px;'+
'height:25px;'+
'line-height:25px;'+
'margin:-1px -1px 0 -1px;'+
'padding:0 40px 0 6px;'+
'}'+
'.fa_ajax_search-results a.fa_ajax_search-close {'+
'color:#FFF !important;'+
'background:none;'+
'display:block;'+
'position:absolute;'+
'top:-1px;'+
'right:-1px;'+
'text-align:center;'+
'text-decoration:none !important;'+
'font-size:18px;'+
'line-height:25px;'+
'height:25px;'+
'width:35px;'+
'margin:0 !important;'+
'padding:0 !important;'+
'}'+
'.fa_ajax_search-results a.fa_ajax_search-close:hover { background:#F33 !important; }'+
'.fa_ajax_search-results > p { padding:3px; }'+
'.fa_ajax_search-topics {'+
'width:100%;'+
'max-height:300px;'+
'overflow-y:auto;'+
'overflow-x:hidden;'+
'}'+
'.fa_ajax_search-topics {'+
'color:#333;'+
'border-top:1px solid #CCC;'+
'border-bottom:1px solid #CCC;'+
'padding:0 !important;'+
'}'+
'.fa_ajax_search-topics li {'+
'padding:3px;'+
'display:block !important;'+
'line-height:14px !important;'+
'}'+
'.fa_ajax_search-topics li:nth-child(even) { background:rgba(0, 0, 0, 0.05); }'+
'.fa_ajax_search-topics li:nth-child(odd) { background:rgba(0, 0, 0, 0.1); }'+
'.fa_ajax_search-topics a.topictitle, #ipbwrapper .fa_ajax_search-results > p > a {'+
'font-size:12px;'+
'font-weight:normal !important;'+
'padding:0 !important;'+
'background:none !important;'+
'}'+
'</style>'
);
// wait for the document to be ready before initializing
$(function() {
$(function() {
fa_ajax_search.init(fa_ajax_search.input_fields);
});
});
}());
Merci d'avance pour ton aide.
Ps : je souhaiterai savoir aussi, hormis le fait de rajouter des lignes supplémentaires, le fait de faire l'ajout dans le CSS ou le Javascript a t-il une influence quelconque sur le forum ?
Re: Changer couleur des résultats de recherche dans la Toolbar
Effectivement ton code a moins de sauts de ligne que nous.
Colle la ligne supplémentaire juste après ceci (ligne 158 et 159) :
Concernant le P.S. ça ne fait aucune différence. C'est juste une question de goût ! les puristes diront que le CSS n'a rien à faire dans un code HTML ou un script. D'autres comme moi diront que c'est mieux d'avoir tout au même endroit, plus facile à maintenir et à supprimer.
Ca présente aussi l'intérêt d'épargner la feuille CSS qui a une taille maximale (64 kio). Les scripts javascript ont la même limite, mais elle est plus rarement atteinte.
Colle la ligne supplémentaire juste après ceci (ligne 158 et 159) :
- Code:
'.fa_ajax_search-topics li:nth-child(even) { background:rgba(0, 0, 0, 0.05); }'+
'.fa_ajax_search-topics li:nth-child(odd) { background:rgba(0, 0, 0, 0.1); }'+
Concernant le P.S. ça ne fait aucune différence. C'est juste une question de goût ! les puristes diront que le CSS n'a rien à faire dans un code HTML ou un script. D'autres comme moi diront que c'est mieux d'avoir tout au même endroit, plus facile à maintenir et à supprimer.
Ca présente aussi l'intérêt d'épargner la feuille CSS qui a une taille maximale (64 kio). Les scripts javascript ont la même limite, mais elle est plus rarement atteinte.
Re: Changer couleur des résultats de recherche dans la Toolbar
Je viens de procéder à l'ajout dans mon Javascript (ça fait mieux de tout mettre au même endroit ), tout fonctionne nickel.
Merci pour ton aide et pour tes explications
Merci pour ton aide et pour tes explications
Sujets similaires
» Changer couleur bouton "creer nouveau sujet" réponse topic + changer couleur fond recherche sous-forum
» Couleur de la police des résultats de recherche
» Problème de couleur pour les résultats de recherche
» Modifier la couleur de la zone de recherche de la Toolbar
» Changer la couleur de la toolbar
» Couleur de la police des résultats de recherche
» Problème de couleur pour les résultats de recherche
» Modifier la couleur de la zone de recherche de la Toolbar
» Changer la couleur de la toolbar
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