Text Color based on current row-background
-
Hi there,
I've tried this code to change text based on current row-background and it works for desktop perfect.
But not on mobile. Can I put the code elsewhere for mobile?
For testing: I've tried to set Phone Breakpoint to „0“ and it works but not with setting "600“. Is there any easy solution for this?
var offset = 50; var $blackRows; var $nav; Frontend.GlobalEvents.on("newpageshown", function(layoutObj, type, obj){ $blackRows = jQuery(".blackrow"); $nav = jQuery("nav"); $nav.removeClass("white"); }); jQuery(document).on("scroll", function(){ $blackRows.each(function(){ var rect = this.getBoundingClientRect(); if(rect.top - offset < 0 && rect.bottom - offset > 0){ $nav.addClass("white"); return false; }else{ $nav.removeClass("white"); } }); });
Thanks!
-
Hi @stdhd
did you try to put it into the other Custom HTML Fields?Can you post a link to your website?
All the best!
Marius
-
Hehe :-)
When you add the class via jQuery you add it to the navigation.
The navigation does not exist on mobile. There we use a different navigation.In general it is good to add this kind of classed to the body.
Then you can use them for all the elements you like.I hope that helps!
Best!
Marius
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it