Image LightBox jQuery

Asked Oct 12 '17 at 20:10

Active Oct 12 '17 at 22:34

Viewed 379 times

I'm trying to create a Lightbox for Image.

You can see Perfectly working demo of this code here https://jsfiddle.net/hibbard_eu/zwk954Ln/

It's working fine for me except it's not showing the cross symbol to get back to previous page.

Here's the code:

<a href="http://saccc567.com/Shows/2014/SACCC_Show/100_0000-Banner_01.JPG"  
 data-lightbox="gallery-1"
 data-title="<a class='add' href='#' data-id='#1'>Add/edit caption</a> 
              <span class='divider'>|</span>
              <span class='caption'>A banner with some cars</span>"
              id="1">
  <img src="http://saccc567.com/Shows/2014/SACCC_Show/Thumbs/100_0000-Banner_01.JPG">
</a>

<script src="http://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>

<script type="text/javascript">
$("#lightbox").on("click", "a.add", function(){
var new_caption = prompt("Enter a new caption");
if(new_caption){
   var parent_id = $(this).data("id"),
       img_title = $(parent_id).data("title"),
       new_caption_tag = "<span class='caption'>" + new_caption + "</span>";

   $(parent_id).attr("data-title", img_title.replace(/<span class='caption'>.*<\/span>/, new_caption_tag));
   $(this).next().next().text(new_caption);
}
});
</script>

How can I show the cross sign to return back?

Or is there any better example for this on jsfiddle?

edited Oct 12 '17 at 22:34

William-H-M

1,050
1
13
19

asked Oct 12 '17 at 20:10

you have cross below your picture, what do you want more? – Joint Oct 12 '17 at 20:49
A cross which is to close the LightBox when it's open? I see it well both on original demo and your piece... – dhilt Oct 12 '17 at 20:49
I'm not sure if lightbox has the ability to return to the beginning of the image when you're on the last picture if that's what you're talking about. – Monkey_Dev1400 Oct 12 '17 at 20:54
The HTML/JavaScript that you've posted works just fine. What's the problem? – Daerik Oct 12 '17 at 21:23
Don't ask for third party examples on jsfiddle. That will get your question closed. – Rob Oct 12 '17 at 22:41
@Joint It's working jsfiddle but not here – Oct 13 '17 at 05:52
@dhit Sir, No it's not working in my piece – Oct 13 '17 at 05:59
@Daerik Sir, the code i posted is not working – Oct 13 '17 at 06:00
@Rob Sir, why the above code is not working – Oct 13 '17 at 06:00
@Randomix I assure you that the code you've used in this question is functional. – Daerik Oct 13 '17 at 13:26

Image LightBox jQuery

0 Answers0