CODEWITHSUNDEEP
jquerycolorbox
Joe Lightfoot
Joe Lightfoot

Reputation: 11

colorbox jquery slideshowstart img instead of text

For the slideshow, I would like to use icons (.png) representing pause ("||"( and play (">") instead of text. I have the following working (the pause text actually looks quite good):

$.colorbox.settings.slideshowStart = ">>";
$.colorbox.settings.slideshowStop = "||";

Using the SAMPLE below:

 $.colorbox({slideshowStop: function(){ var url = $(this).attr('href'); return '<a href="' + url + '" target="_blank">Open In New Window</a>';

I tried returning "img src="grafix/btn_pause.png" alt="" /' enclosed in angel brackets and also tried "url(grafix/btn_pause)". If I don't put it in quotes, cbox won't launch; but when I enclose in quotes I get the text string instead of the graphic. I see .text in the .js file, so am thinking only text is allowed. I know html and css but don't know js.

Is there a way to accomplish this?

Thank you.

Upvotes: 1

Views: 240

Answers (2)

Jack
Jack

Reputation: 9548

You can replace the current text with HTML:

$.colorbox.settings.slideshowStart = "<img src='start.png'/>";

However, my choice would to be to do with Sean suggested.

Upvotes: 0

Sean Hawkridge
Sean Hawkridge

Reputation: 57

It would be much simpler to change the buttons by targeting them in your CSS - colorbox normally comes with stylesheets you can customise to meet your needs.

Upvotes: 2

Related Questions