28106 sujets

CSS et mise en forme, CSS3

bonjour,

sur un site Wordpress, le plugin Polylang me permet d'ajouter un sélecteur de langue dans le menu.

Cependant, dans le code créé, il y a un énorme attribut title qui contient le code base64 de l'image et qui s'affiche au survol avec la souris.

je pense pouvoir cibler ce lien avec une règle scss du style


ul#menu-menu-top-fr, ul#menu-menu-top-us  {
	li.lang-item a[title]  {

	}
}



mais je ne vois pas trop comment lui dire de ne pas afficher le title au survol, car là je cible le lien dans le li de classe lang-item qui a un attribut title, mais pas l’attribut title lui même....
de plus je ne veux pas invalider les autres balises title des autres liens qui elles contiennent des textes utiles.


<li class="lang-item lang-item-28 lang-item-fr menu-item menu-item-type-custom menu-item-object-custom menu-item-2180-fr" id="menu-item-2180-fr">
<a hreflang="fr-FR" href="http://vital2016/archive/galeries-photo/"
title="&lt;img src=&quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAALCAIAAAD5gJpuAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAGzSURBVHjaYiyeepkBBv79+Zfnx/f379+fP38CyT9//jAyMiq5GP77wvDnJ8MfoAIGBoAAYgGqC7STApL///3/9++/pCTv////Qdz/QO4/IMna0vf/z+9/v379//37bUUTQACBNDD8Z/j87fffvyAVX79+/Q8GQDbQeKA9fM+e/Pv18/+vnwzCIkBLAAKQOAY5AIAwCEv4/4PddNUm3ji0QJyxW3rgzE0iLfqDGr2oYuu0l54AYvnz5x9Q6d+/QPQfyAQqAin9B3EOyG1A1UDj//36zfjr1y8GBoAAFI9BDgAwCMIw+P8Ho3GDO6XQ0l4MN8b2kUwYaLszqgKM/KHcDXwBxAJUD3TJ779A8h9Q5D8SAHoARP36+Rfo41+/mcA2AAQQy49ff0Cu//MPpAeI/0FdA1QNYYNVA/3wmwEYVgwMAAHE8uPHH5BqoD1//gJJLADoJKDS378Z//wFhhJAALF8A3rizz8uTmYg788fJkj4QOKREQyYxSWBhjEC/fcXZANAALF8+/anbcHlHz9+ffvx58uPX9KckkCn/gby/wLd8uvHjx96k+cD1UGiGQgAAgwA7q17ZpsMdUQAAAAASUVORK5CYII=&quot; title=&quot;Français&quot; alt=&quot;Français&quot; /&gt;"><img alt="Français" title="Français" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAALCAIAAAD5gJpuAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAGzSURBVHjaYiyeepkBBv79+Zfnx/f379+fP38CyT9//jAyMiq5GP77wvDnJ8MfoAIGBoAAYgGqC7STApL///3/9++/pCTv////Qdz/QO4/IMna0vf/z+9/v379//37bUUTQACBNDD8Z/j87fffvyAVX79+/Q8GQDbQeKA9fM+e/Pv18/+vnwzCIkBLAAKQOAY5AIAwCEv4/4PddNUm3ji0QJyxW3rgzE0iLfqDGr2oYuu0l54AYvnz5x9Q6d+/QPQfyAQqAin9B3EOyG1A1UDj//36zfjr1y8GBoAAFI9BDgAwCMIw+P8Ho3GDO6XQ0l4MN8b2kUwYaLszqgKM/KHcDXwBxAJUD3TJ779A8h9Q5D8SAHoARP36+Rfo41+/mcA2AAQQy49ff0Cu//MPpAeI/0FdA1QNYYNVA/3wmwEYVgwMAAHE8uPHH5BqoD1//gJJLADoJKDS378Z//wFhhJAALF8A3rizz8uTmYg788fJkj4QOKREQyYxSWBhjEC/fcXZANAALF8+/anbcHlHz9+ffvx58uPX9KckkCn/gby/wLd8uvHjx96k+cD1UGiGQgAAgwA7q17ZpsMdUQAAAAASUVORK5CYII=">
</a></li>

Pour moi il est impossible de cacher ces "title"... a moins de faire en sorte de tous les supprimer en javascript lorsque le DOM est chargé.

http://codepen.io/anon/pen/QNwaRJ

dans l'exemple, je change le titre que des deux premières images. Mais tu peux faire une boucle pour faire du title globale, ou faire un à un pour être plus spécifique.

EDIT: dans mon exemple je cible les "img", tu peux cibler les "a" dans ton cas, j'ai pas fait gaffe.
Modifié par JENCAL (01 Mar 2016 - 10:21)
Modérateur
Salut,

Regarde ce petit bout de script que je viens d'écrire (vite fait et de tête) :


window.addEventListener('load', function(){
	var $a = document.querySelectorAll("a['title']");

	for(var i = 0; i < $a.length; i++){
		if(/base64/.test($a[ i ].getAttribute('title'))){
			$a[ i ].removeAttribute('title');
		}
	}

});
niuxe a écrit :
Salut,

Regarde ce petit bout de script que je viens d'écrire (vite fait et de tête) :


window.addEventListener('load', function(){
	var $a = document.querySelectorAll("a['title']");

	for(var i = 0; i &lt; $a.length; i++){
		if(/base64/.test($a[ i ].getAttribute('title'))){
			$a[ i ].removeAttribute('title');
		}
	}

});



merci, mais je pourrais aussi bien faire ça avec jQurey


$("ul#menu-menu-top-fr li.lang-item a, ul#menu-menu-top-us li.lang-item a").attr('title').text('');


mais je voulais éviter de charger un script rien que pour ça.... Smiley cligne
Modérateur
Le script que tu as écris est faux.

Si tu veux le faire avec jcuicui, il faudrait tu écrives ceci :
$('a[title*="base64"]').removeAttr('title');


D'une manière générale, un élément img en base64 dans un title -> beurk !

perso, j'utilise de moins en moins jcuicui pour des raisons de perf (vive le vanillajs). Enfin, tout dépend de ce que je veux faire.
Modifié par niuxe (01 Mar 2016 - 11:32)
niuxe a écrit :
Le script que tu as écris est faux.



oui, je l'aurais vu et corrigé, en le créant... mais tu m'avais compris... Smiley smile

niuxe a écrit :


D'une manière générale, un élément img en base64 dans un title -&gt; beurk !



c'est le plugin Wordpress qui le créé...