CODEWITHSUNDEEP
javascriptjquery
curly_brackets
curly_brackets

Reputation: 5598

AddClass to nth-element by function

We are working on a website where we have a Flash element that shows a couple of movies, and some HTML elements of video thumbs, of some other videos.

When viewing the next video, we want to highlight the thumb below, with a function that the Flash can call.

I'm thinking something like this: (This obviously doesn't work)

function highlightMovie(4) {
    $(".thumb-wrapper div").removeClass("active");
    //The "4" in the below line, comes from the "4" in the Function
    $(".thumb-wrapper div:nth-child(4)").addClass("active");
}

How do I do this? How can I call a function that doesn't have a predefined selector, but can select a nth-child??

Thank you in advance.

Upvotes: 2

Views: 485

Answers (4)

Shagglez
Shagglez

Reputation: 1522

function highlightMovie(n) {
    $($(".thumb-wrapper div").removeClass("active").children()[n]).addClass("active");
}

Upvotes: 1

shanethehat
shanethehat

Reputation: 15570

You would use ExternalInterface to call from Flash to JavaScript with a reference to the video that has started playing. Presumably there is some kind of shared ID system in your code that will let you easily identify which thumbnail to highlight.

EDIT: Try to answer the question this time...

So can't you just do:

function highlightMovie(index) {
    $(".thumb-wrapper div").removeClass("active");
    $(".thumb-wrapper div:nth-child("+index"+)").addClass("active"); 
}

I've not tested it, but can say right now that you can't use nth-child at all in IE 8 and lower.

Upvotes: 0

Andy
Andy

Reputation: 30135

function highlightMovie(number) {
    $(".thumb-wrapper div").removeClass("active");
    //The "4" in the below line, comes from the "4" in the Function
    $(".thumb-wrapper div:nth-child("+number+")").addClass("active");
}

not sure if that is this what you're asking? what does not work?

Upvotes: 1

Philipp Kyeck
Philipp Kyeck

Reputation: 18820

i would try using ExternalInterface to call a JS function from AS.

pseudo js:

function highlightThumb (index) {
  thumbs = getAllThumbsElem();
  for (var i=0;i<thumbs.length;++i) {
    if (i == index) {
      highlightElement(i);
    }
    else {
      resetHiglight(i);
    }
  }
}

Upvotes: 0

Related Questions