Link to home
Start Free TrialLog in
Avatar of jcbmtt
jcbmtt

asked on

selected item

a slideshow that does not have selected tab or slide number highlighted in different  style. what js code or css i  need to add to highlight the selected slide number.

working example :
http://www.littlewebthings.com/projects/blinds/


<div class="slideshow">
   <ul>
      <li><img src="lemons/1.jpg" alt="lemon" /></li>
      <li><img src="lemons/2.jpg" alt="lemon tea" /></li>
      <li><img src="lemons/3.jpg" alt="splashing lemon" /></li>
      <li><img src="lemons/4.jpg" alt="salad with lemon" /></li>
      <li><img src="lemons/5.jpg" alt="lemonade!" /></li>
      <li><img src="lemons/6.jpg" alt="sliced lemon" /></li>
      <li><img src="lemons/7.jpg" alt="dripping lemon" /></li>
   </ul>
</div>

<a href="#" class="change_link" onclick="$('.slideshow').blinds_change(0)">1</a>
<a href="#" class="change_link" onclick="$('.slideshow').blinds_change(1)">2</a>
<a href="#" class="change_link" onclick="$('.slideshow').blinds_change(2)">3</a>
<a href="#" class="change_link" onclick="$('.slideshow').blinds_change(3)">4</a>
<a href="#" class="change_link" onclick="$('.slideshow').blinds_change(4)">5</a>
<a href="#" class="change_link" onclick="$('.slideshow').blinds_change(5)">6</a>
<a href="#" class="change_link" onclick="$('.slideshow').blinds_change(6)">7</a>

$(window).load(function () {
    $('.slideshow').blinds();
})

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of Eyal
Eyal
Flag of Israel image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of jcbmtt
jcbmtt

ASKER

can this be moved to a separate function rather than making it as inline script?
sure

<a href="#" class="change_link" onclick="dowork(0,this)">1</a>

function dowork(index,e)
{
     $('.slideshow').blinds_change(index);
     $('.change_link').removeClass('selected');
     e.addClass('selected');
}