Add CSS class to external links depending of the active slide

benymypony's Avatar


25 Oct, 2012 11:21 PM


I have a slider in a div, and in another div I have the menu that command the slider with goTo function.
Here is what my HTML looks like :

<div id="menu">
  <li><a class="menu-home" href="#">Home</a></li>
  <li><a class="menu-contact" href="#">Contact</a></li>
<div id="royalslider">
  <div class="home">Lorem ipsum.</div>
  <div class="contact">Dolor sir amet.</div>

Here is how I manage slides (it works perfectly) :

$('.home').click(function(e) {
  return false;

I need that if I click on menu CONTACT, the slider goes to slide 2 (or to .contact) and the the CONTACT in the menu get a class (or bold for example). Then if I click on HOME the slider goes to slide 1 and HOME will be bold and CONTACT regular.

Do you have an idea about how to do that ?

Thanks in advance !


EDIT : An important thing, the menu item clicked must be bold if I click on, or if I slide manually (drag) between slides.

  1. Support Staff 1 Posted by Dmitry Semenov on 27 Oct, 2012 02:42 PM

    Dmitry Semenov's Avatar


    I don't really understand the question. You don't know how to add class to element via jQuery? Or you don't know how to listen for slide change event?


Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:


Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts


? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac