Dear Jeff @jeff
Please remove your current CSS with the 'Before {content}' setup - Its not working properly :)
Its not targeting your link <a href#>
it's just inserting the text "REALISATRICE" " :before" the 'Class .mb' (this element being a parent of the <a> element) .
After removing it, please insert the following code into your 'Custom <head> Content' area:
<script>
window.laytheme.on("newpageshown", function(layoutObj, type, obj){
jQuery('[data-id=73]').hover(function(){
jQuery(this).text("REALISATRICE");
}, function() {
jQuery(this).text("MYRIAM BOU-SAHA");
});
jQuery('[data-id=75]').hover(function(){
jQuery(this).text("ILLUSTRATEUR");
}, function() {
jQuery(this).text("VINCENT DUPERRAY");
});
jQuery('[data-id=76]').hover(function(){
jQuery(this).text("GRAPHISTE");
}, function() {
jQuery(this).text("CAROLE GENIN");
});
jQuery('[data-id=77]').hover(function(){
jQuery(this).text("MOTION DESIGN");
}, function() {
jQuery(this).text("GUILLAUME COQUARD");
});
jQuery('[data-id=77]').hover(function(){
jQuery(this).text("MOTION DESIGN");
}, function() {
jQuery(this).text("CÉLESTIN JEAN-CHARLES");
});
jQuery('[data-id=78]').hover(function(){
jQuery(this).text("DESIGN & ARCHITECTURE");
}, function() {
jQuery(this).text("LES MARSIENS");
});
jQuery('[data-id=79]').hover(function(){
jQuery(this).text("DESIGN OBJET & ESPACE");
}, function() {
jQuery(this).text("GEOFFREY PAUCHARD");
});
jQuery('[data-id=12]').hover(function(){
jQuery(this).text("REALISATRICE");
}, function() {
jQuery(this).text("STEPHANIE WEERTS");
});
});
</script>
When using Laytheme and JS/jQuery we need to remember two things as stated in the documentation:
https://laytheme.com/documentation.html#custom-javascript
You need to wrap your code in a 'newpage event' and also the common abbreviated '$' for jQuery should be changed/written as the full 'jQuery'.
In the code above we want to target the link itself and change it, not another element - Every link <a> has its own 'data-id' so we can use that to target. E.g
[data-id=75]
If you need help with how to inspect your pages HTML structure and find Elements and Attributes etc,
On the documentation page is help with using the browsers "development tools'
https://laytheme.com/documentation.html#custom-css-styling
.
.
[image: 1615432729409-screen-shot-2021-03-11-at-4.16.10-pm-resized.png]
.
.
.
I hope this helps Jeff & best of luck - Google is your friend and also the Documentation page :)
Best wishes
Richard
