Is there a way to set the navigation on the waves weapons theme so that the selected page stays highlighted? I tried using "active" but no luck so far...that does not mean that is not what I am supposed to do...but I am apparently doing it wrong if so...other than that is there a certain attribute to use? I've looked around but have not found the answer...
thanks!
https://themes.coffeecup.com/responsive … index.html

That menu is a symbol so you would need to use a script to decipher the url page location of the address bar and compare it to a matching link on the page. If so, then this will add is-active class to link. You can then set your style. I make a new element states selector call is-active. You can do so by scrolling to the bottom of the selector type list and choosing "custom dynamic class". Make both fields "is-active". Then this class will show up in the In State list. Choose it just like you would as hover, focus, etc and set your style.

Here is the script to do the work (needs to be added to the footer and be global).

Thanks...I'll give it a try and let you know how it goes Hoping to get to it by the weekend.

MJ

Hey Twinstream!
Thanks, again, for the help. I seem to be missing something. I'm able to assign the dynamic class and give them the styling...but it does it to all of them as if all are selected? I tried giving different ID's to no avail.

If you have some time soon, can you please give a step-by-step guide? No worries if you don't have the time...I'll keep plugging away to see if I can get it. I'm sure it is something right in front of me that I am forgetting.
Thanks
MJ

Mark,

It will appear in SD3 that all are selected when you are in the "is-active" state you created because style is applied to any link with the class "nav-item".

Inside SD3 you will not see the styles appear in the Preview (eye) because the scripts are not allowed to run in SD3.

Let me know if it does not work in a browser preview.

Also make sure you are setting the styles in the element state selector. The "is-active" dynamic class you created will appear with the other In State selections such as Regular, Out of View, Hover, Active, Focus, and Visited.

Do not add the class "is-active" to the Type Class where the nav-item is. We want the script to determine when the "is-active" class is added. It determines this by looking at the last part of the url in the browser, and compares to any nav-link in the menu. If it matches, then the script adds the "is-active" class to that nav-link which makes the styles take effect. Changing to another page simply starts the whole process over again.

Twinstream,

Still no luck...they do not show "selected" in live view... only within Site Designer, so that is good. That part is cleared up. As well, when selecting the state, the "is-active" is already an option. I tried using it as well, but the same result. Is there a particular reason why you put it in as a custom class?

Thanks for your time. Don't worry about spending a bunch of time on my behalf. I'll keep messing a bit and if no luck, I'll keep as is.

Thanks,
MJ

how many pages do you have Mark

sorry to but in but shouldn't the code in the footer be enclosed in
<script>
$(function() {
var pgurl = window.location.href.substr(window.location.href
.lastIndexOf("/") + 1);
$("#view-menu a").each(function() {
if ($(this).attr("href") == pgurl || $(this).attr("href") == '')
$(this).addClass("is-active");
})
});
</script>

I have done a short video showing how I would do it, a little bit different to Twinstream but using his script uploading now to YouTube, will post link when done