Koken CMS If class is add class to another element (multiple cases)

Question

Besides a different color for each nav item when they are active i need to have my site-title (logo background color) another color for each page/album.

When a link inside the nav is active, .k-nav-current is automatically appended.

So i've tried this:

if ($("#main li:nth-child(2)").hasClass('.k-nav-current')) {
    $("#site-title").addClass("babycurrent");
} else {

};


.babycurrent{
background: rgb(35,235,0);
}

Or instead of #main li:nth-child() i've tried:
#main a#unique_nav_itemid
a#unique_nav_itemid

But none of these solutions are working.

One problem is that even if you are on the homepage, the logo has the class `k-nav-current`. It will always be true. — Joseph Marikle, Mar 18 '14 at 20:36
i think we misunderstood each other. The `K-nav-current` is assigned to the link in the navigation. when this class is assigned i want to add another class to the `#site-title id` So i can style the background of the logo for each page — Rik, Mar 18 '14 at 20:44
But that's the thing. As far as I can tell, it's always assigned no matter what page you are on (even when you just navigate to http://itook.nl/admin). So then your function to add a class to the `#site-title` will always be called immediately after page load. — Joseph Marikle, Mar 18 '14 at 21:21
yes you're correct it's always assigned no matter which page you are. And the function has to be called after every page load.So the function goes in an if else statement and is checking to which nav element the k-nav-current is assigned and then it adds for every if statement another class to `#site-title` my javascript is now just loaded in as: main.js and in that file just the if else statement and nothing more. — Rik, Mar 18 '14 at 21:43

Joseph Marikle · Accepted Answer · 2014-03-19T14:12:35.023

0

One method you can use to test to see if the element exists in the document:

if($('.k-nav-current').length) {
    $("#site-title").addClass("babycurrent");
}

of course if length is 0, it is considered "falsey". any other positive number is "truthy".

However, for any further help, we will need to see the actual markup.

EDIT:

For your current setup, you are trying to use #main li:nth-child(2) and checking its class. The class is actually applied to the anchor. You need to use #main li:nth-child(2) a

if ($("#main li:nth-child(2) a").hasClass('k-nav-current')) {
    $("#site-title").addClass("babycurrent");
}

Though it might be better to just use something like this (considering ids are unique):

if ($("#baby").hasClass('k-nav-current')) {
    $("#site-title").addClass("babycurrent");
}

Lastly, if you really want it dynamic, you can do something like this:

var current = $("a.k-nav-current")[0].id.replace('#','');
$("#site-title").addClass(current + "current");

EDIT:

$( document ).ready(function() {
  if ($("#baby").hasClass('k-nav-current')) {
    $("#site-title").addClass("babycurrent");
  }
});

// or you can do this (commented out) /*

$( document ).ready(function() {
  var current = $("a.k-nav-current")[0].id.replace('#','');
  $("#site-title").addClass(current + "current");
});

*/

edited Mar 19 '14 at 14:12

answered Mar 18 '14 at 20:04

Joseph Marikle

76,418
17
112
129

i just copy paste the dynamic one in my main.js. Now there is just those two lines. i get the error: `Uncaught TypeError: Cannot read property 'id' of undefined.` – Rik Mar 18 '14 at 22:18
Ah! that's right. Not all of them are contained in that `#main`. there's still the logo. I'l edit my answer. – Joseph Marikle Mar 18 '14 at 22:26
i get still the same error so tried the if statement and there i get no error but there is none class added in (developer tools) – Rik Mar 18 '14 at 22:31
@Rik sorry again. It needs to not have the `.` for the hasClass function. – Joseph Marikle Mar 18 '14 at 22:48
also you should probably wrap that in a document ready function – Joseph Marikle Mar 18 '14 at 22:49
i don't know what i'm doing wrong but i see still no added class in the `site-title` – Rik Mar 18 '14 at 23:45
you're my hero!! really really thanks for helping me! editted your post as answer – Rik Mar 19 '14 at 08:35

Koken CMS If class is add class to another element (multiple cases)

1 Answers1

EDIT:

EDIT: