Adding: the ability for pagination to have meaningful text in links.

[arronmabrey]

Adding: the ability for pagination to have meaningful text in links instead just the slide number.

Sharing back changes from a project I did.

<div class="slides">
  <img data-slideslabel="Image One" src="image01.jpg" />
  <img data-slideslabel="Image Two" src="image02.jpg" />
  <img data-slideslabel="Image Three" src="image03.jpg" />
</div>

Also if there is no data-slideslabel set it will default back to the number for the slide.

[defencedog]

^^ how to make it work. Have edited js file but html part can't figure out??

[arronmabrey]

So you inserted this $(element).data("slideslabel") || into the correct place on line 729 of the slidesjs javascript?

If you did then all you need to do is add the 'data-slideslabel="whatever"' to the appropriate slide you want to label.

<img data-slideslabel="This is the text that will show up as the pagination for this slide." src="image01.jpg" />

[defencedog]

You mean like this ...didnt worked. I had perfectly edited js file

    <div id="slides">
            <img data-slideslabel="xxxxx" src="http://slidesjs.com/examples/standard/img/slide-1.jpg" width="780" height="300" alt="Slide 1">

            <img data-slideslabel="eeee" src="http://slidesjs.com/examples/standard/img/slide-2.jpg" width="780" height="300" alt="Slide 2">
    </div>

[arronmabrey]

Do you have a test page I can look at or can you put what you have on http://jsfiddle.net/

[defencedog]

sorry to perturb you much...but I am just a fresh chemical engineer. Hope you understand

here you go: https://defencedog.googlecode.com/svn/arronmabrey-Slides/index.html

[arronmabrey]

Its working its just being hidden by the css.

.slidesPagination li a {
    display:block;
    width:14px;
    height:0;
    padding-top:14px;
    background-image:url(../img/pagination.png);
    background-position:0 0;
    overflow:hidden;
}

Just comment out a few of the styles in the css and you can see it working.

.slidesPagination li a {
    display:block;
    /*width:14px;*/
    /*height:0;*/
    padding-top:14px;
    /*background-image:url(../img/pagination.png);*/
    background-position:0 0;
    overflow:hidden;
}

That should get you headed in the right direction.

[defencedog]

thnx...sir can you take a look at http://engineering.forumotion.info/h1-video-tutorials

all is fine but the youtube vids title is missing somehow??

Plus even in full screen mode when vid is playing next slide take over??

[arronmabrey]

Not sure about that. I don't use youtube.

[defencedog]

thank you sir; thnx very much

[nathansearles]

You can also use your own pagination with it's own links. Just have to set "pagination" to "false" in the options and create a pagination using a UL with a class of "slidesPagination" with LIs and anchor tags with what ever text or images you like. Use Firebug to copy the pagination Slides creates and paste it into your markup and edit away.